Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Code Issues Projects Releases Wiki Activity

html href fixes, custom input fixes

Browse Source
This commit is contained in:
codecalm
2019-09-26 00:13:52 +02:00
parent 6ca4337ecd
commit a85a05eb4d
52 changed files with 228 additions and 233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pages/_docs/alerts.md
View File

@@ -25,7 +25,7 @@ Add the `alert-link` class to any links inside the alert box to create "matching
{% example %}
{% for variant in site.variants %}
{% capture variant-text %}
This is a {{ variant.name }} alert — <a href="#" class="alert-link">check it out</a>!
This is a {{ variant.name }} alert — <a href="javascript:void(0)" class="alert-link">check it out</a>!
{% endcapture %}
{% include ui/alert.html type=variant.name text=variant-text %}
{% endfor %}

4
pages/_docs/badges.md
View File

@@ -36,7 +36,7 @@ A small count and labeling component. Please read the [official Bootstrap docume
{% example %}
{% for color in site.colors %}
<a href="#" class="badge bg-{{ color[0] }}">{{ color[0] }}</a>
<a href="javascript:void(0)" class="badge bg-{{ color[0] }}">{{ color[0] }}</a>
{% endfor %}
{% endexample %}
@@ -45,6 +45,6 @@ A small count and labeling component. Please read the [official Bootstrap docume
{% example %}
{% for color in site.colors %}
<a href="#" class="badge bg-{{ color[0] }}"></a>
<a href="javascript:void(0)" class="badge bg-{{ color[0] }}"></a>
{% endfor %}
{% endexample %}

66
pages/_docs/buttons.md
View File

@@ -10,7 +10,7 @@ description: Use Bootstrap’s custom button styles for actions in forms, dialog
The `.btn` classes are designed to be used with the `<button>` element. However, you can also use these classes on `<a>` or `<input>` elements (though some browsers may apply a slightly different rendering).
{% example html wrapper=btn-list %}
<a href="#" class="btn btn-primary" role="button">Link</a>
<a href="javascript:void(0)" class="btn btn-primary" role="button">Link</a>
<button class="btn btn-primary">Button</button>
<input type="button" class="btn btn-primary" value="Input" />
<input type="submit" class="btn btn-primary" value="Submit" />
@@ -23,9 +23,9 @@ Use any of the available button classes to quickly create a styled button . We p
{% example html wrapper=btn-list %}
{% for button in site.button_variants %}
<a href="#" class="btn btn-{{ button.name }}">{{ button.title }}</a>
<a href="javascript:void(0)" class="btn btn-{{ button.name }}">{{ button.title }}</a>
{% endfor %}
<a href="#" class="btn btn-link">Link</a>
<a href="javascript:void(0)" class="btn btn-link">Link</a>
{% endexample %}
### Disabled buttons
@@ -45,7 +45,7 @@ The classic button, in different colors.
{% example html wrapper=btn-list %}
{% for button in site.colors %}
<a href="#" class="btn btn-{{ button[0] }}">{{ button[1].name }}</a>
<a href="javascript:void(0)" class="btn btn-{{ button[0] }}">{{ button[1].name }}</a>
{% endfor %}
{% endexample %}
@@ -209,9 +209,9 @@ You can now create a list of buttons with the `.btn-list` container.
{% example html %}
<div class="btn-list">
<a href="#" class="btn btn-success">Save changes</a>
<a href="#" class="btn btn-secondary">Save and continue</a>
<a href="#" class="btn btn-danger">Cancel</a>
<a href="javascript:void(0)" class="btn btn-success">Save changes</a>
<a href="javascript:void(0)" class="btn btn-secondary">Save and continue</a>
<a href="javascript:void(0)" class="btn btn-danger">Cancel</a>
</div>
{% endexample %}
@@ -219,25 +219,25 @@ If the list is very long, it will automatically wrap on multiple lines, while ke
{% example html %}
<div class="btn-list">
<a href="#" class="btn btn-secondary">One</a>
<a href="#" class="btn btn-secondary">Two</a>
<a href="#" class="btn btn-secondary">Three</a>
<a href="#" class="btn btn-secondary">Four</a>
<a href="#" class="btn btn-secondary">Five</a>
<a href="#" class="btn btn-secondary">Six</a>
<a href="#" class="btn btn-secondary">Seven</a>
<a href="#" class="btn btn-secondary">Eight</a>
<a href="#" class="btn btn-secondary">Nine</a>
<a href="#" class="btn btn-secondary">Ten</a>
<a href="#" class="btn btn-secondary">Eleven</a>
<a href="#" class="btn btn-secondary">Twelve</a>
<a href="#" class="btn btn-secondary">Thirteen</a>
<a href="#" class="btn btn-secondary">Fourteen</a>
<a href="#" class="btn btn-secondary">Fifteen</a>
<a href="#" class="btn btn-secondary">Sixteen</a>
<a href="#" class="btn btn-secondary">Seventeen</a>
<a href="#" class="btn btn-secondary">Eighteen</a>
<a href="#" class="btn btn-secondary">Nineteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">One</a>
<a href="javascript:void(0)" class="btn btn-secondary">Two</a>
<a href="javascript:void(0)" class="btn btn-secondary">Three</a>
<a href="javascript:void(0)" class="btn btn-secondary">Four</a>
<a href="javascript:void(0)" class="btn btn-secondary">Five</a>
<a href="javascript:void(0)" class="btn btn-secondary">Six</a>
<a href="javascript:void(0)" class="btn btn-secondary">Seven</a>
<a href="javascript:void(0)" class="btn btn-secondary">Eight</a>
<a href="javascript:void(0)" class="btn btn-secondary">Nine</a>
<a href="javascript:void(0)" class="btn btn-secondary">Ten</a>
<a href="javascript:void(0)" class="btn btn-secondary">Eleven</a>
<a href="javascript:void(0)" class="btn btn-secondary">Twelve</a>
<a href="javascript:void(0)" class="btn btn-secondary">Thirteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Fourteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Fifteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Sixteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Seventeen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Eighteen</a>
<a href="javascript:void(0)" class="btn btn-secondary">Nineteen</a>
</div>
{% endexample %}
@@ -245,23 +245,23 @@ Use the `.text-center` or the `.text-right` modifiers to alter the alignment.
{% example html %}
<div class="btn-list text-center">
<a href="#" class="btn btn-primary">Save changes</a>
<a href="#" class="btn btn-secondary">Save and continue</a>
<a href="javascript:void(0)" class="btn btn-primary">Save changes</a>
<a href="javascript:void(0)" class="btn btn-secondary">Save and continue</a>
</div>
{% endexample %}
{% example html %}
<div class="btn-list text-right">
<a href="#" class="btn btn-primary">Save changes</a>
<a href="#" class="btn btn-secondary">Save and continue</a>
<a href="javascript:void(0)" class="btn btn-primary">Save changes</a>
<a href="javascript:void(0)" class="btn btn-secondary">Save and continue</a>
</div>
{% endexample %}
### Button with avatar
{% example html%}
<a href="#" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="4" class="btn-avatar" %} Avatar</a>
<a href="#" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="5" class="btn-avatar" %} Avatar</a>
<a href="#" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="6" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="4" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="5" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary mr-2">{% include ui/avatar.html person-id="6" class="btn-avatar" %} Avatar</a>
{% endexample %}

12
pages/_docs/cards.md
View File

@@ -95,14 +95,14 @@ You can also add the image on the left side of the card. All you need do to is:
<a class="media-content " style="background-image:url({% include ui/image.html id=7 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-yellow">NATURE</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-yellow">NATURE</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column">
<div class="flex-fill ">
<a href="#" class="card-title text-md">
<a href="javascript:void(0)" class="card-title text-md">
It’s 2018, and the race is on between tech giants to decide who will control what you see every time you open your eyes
</a>
<a class="text-muted mt-2 ">What Not To Wear: The Hats, Scarves In History</a>
@@ -127,11 +127,11 @@ You can also add the image on the left side of the card. All you need do to is:
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<div class="mb-3">
<a href="#">
<a href="javascript:void(0)">
<span class="badge badge-md text-uppercase bg-danger">Fashion</span>
</a>
</div>
<a href="#" class="card-title h-2x">
<a href="javascript:void(0)" class="card-title h-2x">
What Not To Wear: The Hats, Scarves In History
</a>
</div>
@@ -151,14 +151,14 @@ You can also add the image on the left side of the card. All you need do to is:
<div class="media media-4x3 col-4">
<a class="media-content" style="background-image:url({% include ui/image.html id=6 %})"></a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-white-overlay">MUSIC</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-white-overlay">MUSIC</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column">
<div class="flex-fill">
<a href="#" class="card-title text-md">
<a href="javascript:void(0)" class="card-title text-md">
Radio Listeners Prepare For An Impending Alien Invasion In This Visually Stunning Short Film
</a>
<a class="text-muted mt-2">What Not To Wear: The Hats, Scarves In History</a>

6
pages/_includes/cards/_full-2.html
View File

@@ -3,13 +3,13 @@
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
<a class="nav-link active" href="javascript:void(0)">Active</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
<a class="nav-link" href="javascript:void(0)">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
<a class="nav-link disabled" href="javascript:void(0)">Disabled</a>
</li>
</ul>
</div>

8
pages/_includes/cards/_full.html
View File

@@ -4,8 +4,8 @@
<div class="card-header">
<h5 class="card-title">Card title</h5>
<div class="card-options">
<a href="#" class="btn btn-secondary btn-sm">Button</a>
<a href="#" class="btn btn-primary btn-sm">Button</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-sm">Button</a>
<a href="javascript:void(0)" class="btn btn-primary btn-sm">Button</a>
</div>
</div>
@@ -20,8 +20,8 @@
</ul>
<div class="card-body">
<a href="#" class="card-link">Card link</a>
<a href="#" class="card-link">Another link</a>
<a href="javascript:void(0)" class="card-link">Card link</a>
<a href="javascript:void(0)" class="card-link">Another link</a>
</div>
<div class="progress card-progress">

4
pages/_includes/cards/activity.html
View File

@@ -7,7 +7,7 @@
{% include ui/avatar.html person-id="3" class="mr-3"%}
</div>
<div class="text-muted">
<strong class="text-body">Martin</strong> completed the task <a href="#">Set up client chat channel</a>
<strong class="text-body">Martin</strong> completed the task <a href="javascript:void(0)">Set up client chat channel</a>
<div class="font-weight-light">Just now</div>
</div>
</div>
@@ -27,7 +27,7 @@
{% include ui/avatar.html person-id="10" class="mr-3"%}
</div>
<div class="text-muted">
<strong class="text-body">Kate</strong> added the task <a href="#">Let's make Tabler awesome!</a>
<strong class="text-body">Kate</strong> added the task <a href="javascript:void(0)">Let's make Tabler awesome!</a>
<div class="font-weight-light">Just now</div>
</div>
</div>

6
pages/_includes/cards/blog-single.html
View File

@@ -7,17 +7,17 @@
<div class="card{% if type == 'aside' %} card-aside{% endif %}">
{% if type == 'image' %}
<a href="#"><img class="card-img-top" src="{{ site.base }}/img/photos//{{ site.data.photos[article.image].file }}" alt="{{ article.title | escape}}"></a>
<a href="javascript:void(0)"><img class="card-img-top" src="{{ site.base }}/img/photos//{{ site.data.photos[article.image].file }}" alt="{{ article.title | escape}}"></a>
{% endif %}
{% if type == 'aside' %}
<a href="#" class="card-aside-column{% if include.aside-class %} {{ include.aside-class }}{% endif %}" style="background-image: url({{ site.base }}/img/photos//{{ site.data.photos[article.image].file }})"></a>
<a href="javascript:void(0)" class="card-aside-column{% if include.aside-class %} {{ include.aside-class }}{% endif %}" style="background-image: url({{ site.base }}/img/photos//{{ site.data.photos[article.image].file }})"></a>
{% endif %}
<div class="card-body d-flex flex-column">
<h4><a href="#">{{ article.title }}</a></h4>
<h4><a href="javascript:void(0)">{{ article.title }}</a></h4>
<div class="text-muted">{{ article.description | truncate: truncate }}</div>

10
pages/_includes/cards/card.html
View File

@@ -21,18 +21,18 @@
</div>
</form>
{% elsif include.show-buttons %}
<a href="#" class="btn btn-primary btn-sm">Action 1</a>
<a href="#" class="btn btn-secondary btn-sm ml-2">Action 2</a>
<a href="javascript:void(0)" class="btn btn-primary btn-sm">Action 1</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-sm ml-2">Action 2</a>
{% elsif include.show-switch %}
{% include ui/switch.html checked=true %}
{% elsif include.options %}
{{ include.options }}
{% else %}
<a href="#" class="card-options-link" data-toggle="card-collapse">{% include ui/icon.html icon="chevron-up" %}</a>
<a href="javascript:void(0)" class="card-options-link" data-toggle="card-collapse">{% include ui/icon.html icon="chevron-up" %}</a>
{% if include.show-fullscreen %}
<a href="#" class="card-options-link" data-toggle="card-fullscreen">{% include ui/icon.html icon="maximize" %}</a>
<a href="javascript:void(0)" class="card-options-link" data-toggle="card-fullscreen">{% include ui/icon.html icon="maximize" %}</a>
{% endif %}
<a href="#" class="card-options-link" data-toggle="card-remove">{% include ui/icon.html icon="x" %}</a>
<a href="javascript:void(0)" class="card-options-link" data-toggle="card-remove">{% include ui/icon.html icon="x" %}</a>
{% endif %}
</div>
{% endunless %}

8
pages/_includes/cards/comments.html
View File

@@ -21,14 +21,14 @@
</p>
<div class="small">
<span class="text-success mr-1">+{{ forloop.index | random_number: 20, 50 }}</span>
<a href="#" data-toggle="tooltip" data-placement="top" title="Vote Up">{% include ui/icon.html icon="chevron-up" %}</a>
<a href="#" class="mr-1" data-toggle="tooltip" data-placement="top" title="Vote Down">
<a href="javascript:void(0)" data-toggle="tooltip" data-placement="top" title="Vote Up">{% include ui/icon.html icon="chevron-up" %}</a>
<a href="javascript:void(0)" class="mr-1" data-toggle="tooltip" data-placement="top" title="Vote Down">
{% include ui/icon.html icon="chevron-down" %}
</a>
<span class="mr-1">·</span>
<a href="#" class="mr-1 text-muted">Reply</a>
<a href="javascript:void(0)" class="mr-1 text-muted">Reply</a>
<span class="mr-1">·</span>
<a href="#" class="text-muted">Edit</a>
<a href="javascript:void(0)" class="text-muted">Edit</a>
</div>
</div>
</div>

2
pages/_includes/cards/company-employees.html
View File

@@ -13,7 +13,7 @@
{% for person in site.data.people limit: 5 offset: 20 %}
<tr>
<td class="w-1">{% include ui/avatar.html src=person.photo %}</td>
<td><a href="#" class="text-inherit">{{ person.full_name }}</a></td>
<td><a href="javascript:void(0)" class="text-inherit">{{ person.full_name }}</a></td>
<td>{{ person.department }}</td>
<td class="w-1 pr-0">{{ forloop.index | random_number: 30, 90 }}%</td>
<td>

12
pages/_includes/cards/company-lookup.html
View File

@@ -64,7 +64,7 @@
<ul class="list-unstyled">
<li class="mb-5">
<a href="#">Amazons Super Bowl commercial might contain a clue about where HQ2 will be</a>
<a href="javascript:void(0)">Amazons Super Bowl commercial might contain a clue about where HQ2 will be</a>
<p class="mb-1">Eagleeyed viewers of the Super Bowl spotted something most people missed in Amazons
commercial for its Alexa voice assistant Before Alexa lo…</p>
<div class="row">
@@ -73,7 +73,7 @@
</div>
</li>
<li class="mb-5">
<a href="#">Holiday performance propels Amazon to stellar quarter results</a>
<a href="javascript:void(0)">Holiday performance propels Amazon to stellar quarter results</a>
<p>This story was delivered to BI Intelligence ECommerce Briefing subscribers hours before appearing
on Business Insider To be the first to kno…</p>
<div class="row">
@@ -82,7 +82,7 @@
</div>
</li>
<li class="mb-5">
<a href="#">12 highpaying jobs Amazons HQ2 will likely bring to its future city</a>
<a href="javascript:void(0)">12 highpaying jobs Amazons HQ2 will likely bring to its future city</a>
<p class="mb-1">These Amazon jobs all earn over 90000tanleimagesShutterstock</p>
<div class="row">
<div class="col text-muted">businessinsider.com</div>
@@ -182,19 +182,19 @@
<li class="list-separated-item">
<h5 class="mb-1">Crunchbase</h5>
<div>
<a href="#">crunchbase.com/organization/amazon</a>
<a href="javascript:void(0)">crunchbase.com/organization/amazon</a>
</div>
</li>
<li class="list-separated-item">
<h5 class="mb-1">Twitter</h5>
<div>
<a href="#">twitter.com/amazon</a>
<a href="javascript:void(0)">twitter.com/amazon</a>
</div>
</li>
<li class="list-separated-item">
<h5 class="mb-1">Facebook</h5>
<div>
<a href="#">facebook.com/amazon</a>
<a href="javascript:void(0)">facebook.com/amazon</a>
</div>
</li>
</ul>

16
pages/_includes/cards/feed-card.html
View File

@@ -2,11 +2,11 @@
{% assign id = 0 | random_id %}
<div class="card">
<div class="card-header d-flex">
<a href="#">
<a href="javascript:void(0)">
{% include ui/avatar.html person=person size="md" %}
</a>
<div class="mx-3">
<a href="#">{{ person.full_name }}</a>
<a href="javascript:void(0)">{{ person.full_name }}</a>
<div class="text-muted text-sm">11 days ago</div>
</div>
</div>
@@ -175,13 +175,13 @@
</div>
<div class="card-footer">
<div class="toolbar toolbar-mx">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="thumbs-up" %} 321 Likes
</a>
<a href="#feed-form-{{ id }}" class="text-muted" data-toggle="collapse">
{% include ui/icon.html icon="message-square" %} 56 Comments
</a>
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="share-2" %}
Share
</a>
@@ -192,10 +192,10 @@
<textarea class="form-control" rows="3"></textarea>
<div class="d-flex pt-2">
<div class="toolbar mt-1">
<a href="#" class="text-muted">{% include ui/icon.html icon="image" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="video" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="map-pin" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="paperclip" %}</a>
<a href="javascript:void(0)" class="text-muted">{% include ui/icon.html icon="image" %}</a>
<a href="javascript:void(0)" class="text-muted">{% include ui/icon.html icon="video" %}</a>
<a href="javascript:void(0)" class="text-muted">{% include ui/icon.html icon="map-pin" %}</a>
<a href="javascript:void(0)" class="text-muted">{% include ui/icon.html icon="paperclip" %}</a>
</div>
<button class="btn btn-sm btn-primary ml-auto">Post</button>
</div>

6
pages/_includes/cards/image-box.html
View File

@@ -1,11 +1,11 @@
<div class="card">
<a href="#">
<a href="javascript:void(0)">
<img class="card-img-top" src="{{ site.base }}/img/photos/{{ site.data.photos[0].file }}"/>
</a>
<div class="card-body">
<h4>Awesome Breakfast</h4>
<div class="toolbar mb-3">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="clock" %}
May 23rd, 2018
</a>
@@ -16,6 +16,6 @@
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad aspernatur consequatur dolor dolore, earum enim
error, nemo neque nulla quasi rerum, </p>
<a href="#" class="btn btn-primary">See more</a>
<a href="javascript:void(0)" class="btn btn-primary">See more</a>
</div>
</div>

2
pages/_includes/cards/most-visited-pages.html
View File

@@ -14,7 +14,7 @@
{% for page in site.data.pages %}
<tr>
<td>{{ page.uri }}</td>
<td><a href="#" class="text-muted-light">{% include ui/icon.html icon="link" %}</a></td>
<td><a href="javascript:void(0)" class="text-muted-light">{% include ui/icon.html icon="link" %}</a></td>
<td>{{ page.visitors | format_number }}</td>
<td>{{ page.unique | format_number }}</td>
<td>{{ page.bounce-rate }}</td>

4
pages/_includes/cards/place-box.html
View File

@@ -29,11 +29,11 @@
<div class="card-body">
<h4>Sunny Place Apartment</h4>
<div class="toolbar mb-5">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="map-pin" %}
Veiga, PT
</a>
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="users" %}
51
</a>

2
pages/_includes/cards/pricing-card.html
View File

@@ -24,7 +24,7 @@
</ul>
<div class="text-center mt-6">
<a href="#" class="btn btn-{{ include.featured-color | default: 'secondary' }} btn-block">Choose plan</a>
<a href="javascript:void(0)" class="btn btn-{{ include.featured-color | default: 'secondary' }} btn-block">Choose plan</a>
</div>
</div>
</div>

4
pages/_includes/cards/project-box.html
View File

@@ -2,11 +2,11 @@
<div class="card-body">
<h4>System redesign</h4>
<div class="toolbar mb-3">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="file" %}
24 Files
</a>
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="bar-chart-2" %}
12 Reports
</a>

2
pages/_includes/cards/project-kanban.html
View File

@@ -13,7 +13,7 @@
{% include ui/dropdown-menu.html right=true %}
</div>
<div class="card-title">
<h6 class="h4 mb-3"><a href="#">{{ include.title | default: 'Task Title' }}</a>{% if include.badge %} <span class="badge">{{ include.badge }}</span>{% endif %}</h6>
<h6 class="h4 mb-3"><a href="javascript:void(0)">{{ include.title | default: 'Task Title' }}</a>{% if include.badge %} <span class="badge">{{ include.badge }}</span>{% endif %}</h6>
</div>
{% include ui/avatar-list.html offset=offset limit=limit size="sm" stacked=true class="mb-3" %}

2
pages/_includes/cards/quote-box.html
View File

@@ -11,7 +11,7 @@
illo inventore molestiae!</p>
<div class="d-flex align-items-center">
<a href="#">
<a href="javascript:void(0)">
{% include ui/avatar.html person=p size="lg" %}
</a>
<div class="mx-3">

2
pages/_includes/cards/recommended-users.html
View File

@@ -5,7 +5,7 @@
<div class="card-body">
{% for person in site.data.people limit: 5 offset: 50 %}
<div class="mb-3">
<a href="#" class="d-flex align-items-center text-inherit">
<a href="javascript:void(0)" class="d-flex align-items-center text-inherit">
{% include ui/avatar.html person=person size="sm" class="mr-2"%}
{{ person.full_name }}
</a>

4
pages/_includes/cards/subscribe.html
View File

@@ -8,7 +8,7 @@
</div>
<div class="col">
<h4 class="card-title m-0">
<a href="#">{{ person.full_name }}</a>
<a href="javascript:void(0)">{{ person.full_name }}</a>
</h4>
<div class="text-muted">
Working in {{ person.company }}
@@ -18,7 +18,7 @@
</div>
</div>
<div class="col-auto">
<a href="#" class="btn btn-sm btn-secondary d-none d-md-inline-block">
<a href="javascript:void(0)" class="btn btn-sm btn-secondary d-none d-md-inline-block">
Subscribe
</a>
</div>

10
pages/_includes/cards/tabs.html
View File

@@ -28,13 +28,13 @@
{% endif %}
{% if include.dropdown %}
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<a class="dropdown-item" href="javascript:void(0)">Action</a>
<a class="dropdown-item" href="javascript:void(0)">Another action</a>
<a class="dropdown-item" href="javascript:void(0)">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
<a class="dropdown-item" href="javascript:void(0)">Separated link</a>
</div>
</li>
{% endif %}

6
pages/_includes/cards/tasks.html
View File

@@ -13,17 +13,17 @@
</label>
</td>
<td class="w-100">
<a href="#" class="text-inherit">{{ task.name }}</a>
<a href="javascript:void(0)" class="text-inherit">{{ task.name }}</a>
</td>
<td class="text-nowrap text-muted-light">
{% include ui/icon.html icon="calendar" %}
{{ forloop.index | random_date: "2019-01-01", "2018-01-01" | date: '%B %d, %Y' }}
</td>
<td class="text-nowrap">
<a href="#" class="text-muted-light">{% include ui/icon.html icon="check" %} {{ forloop.index | random_number: 0, 6 }}/{{ forloop.index | random_number: 5, 10 }}</a>
<a href="javascript:void(0)" class="text-muted-light">{% include ui/icon.html icon="check" %} {{ forloop.index | random_number: 0, 6 }}/{{ forloop.index | random_number: 5, 10 }}</a>
</td>
<td class="text-nowrap">
<a href="#" class="text-muted-light">{% include ui/icon.html icon="message-square" %} {{ forloop.index | random_number: 0, 12 }}</a>
<a href="javascript:void(0)" class="text-muted-light">{% include ui/icon.html icon="message-square" %} {{ forloop.index | random_number: 0, 12 }}</a>
</td>
<td>
{% include ui/avatar.html person-id=forloop.index size="sm" %}

2
pages/_includes/cards/text-box.html
View File

@@ -5,6 +5,6 @@
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium asperiores aspernatur dolor fugit id,
illo iste molestiae nam nesciunt veniam?
</p>
<a href="#" class="btn btn-primary">Find out more</a>
<a href="javascript:void(0)" class="btn btn-primary">Find out more</a>
</div>
</div>

6
pages/_includes/cards/top-users.html
View File

@@ -7,13 +7,13 @@
{% for person in site.data.people limit: 12 offset: 40 %}
<div class="col-sm-6" data-id="8">
<div class="media">
<a href="#">
<a href="javascript:void(0)">
{% include ui/avatar.html src=person.photo size="md" %}
</a>
</div>
<div class="d-flex flex-column">
<a href="#" class="text-default">{{ person.full_name }}</a>
<a href="#" class="text-muted leading-none">
<a href="javascript:void(0)" class="text-default">{{ person.full_name }}</a>
<a href="javascript:void(0)" class="text-muted leading-none">
{{ person.company }}
</a>
</div>

2
pages/_includes/cards/user-card-bg.html
View File

@@ -1,6 +1,6 @@
{% assign person-id = include.person-id | default: 0 %}
{% assign person = site.data.people[person-id] %}
<a class="card card-link" href="#">
<a class="card card-link" href="javascript:void(0)">
<div class="card-cover text-center{% if include.blurred %} card-cover-blurred{% endif %}" style="background-image: url({% include ui/image.html id=person-id %})">
{% include ui/avatar.html size="xl" person=person thumb=true %}
</div>

2
pages/_includes/cards/user-card-big.html
View File

@@ -8,5 +8,5 @@
<div class="card-title mb-1">{{ person.full_name }}</div>
<div class="text-muted">{{ person.job_title }}</div>
</div>
<a href="#" class="card-btn">View full profile</a>
<a href="javascript:void(0)" class="card-btn">View full profile</a>
</div>

2
pages/_includes/cards/user-card.html
View File

@@ -1,6 +1,6 @@
{% assign person-id = include.person-id | default: 0 %}
{% assign person = site.data.people[person-id] %}
<a class="card card-link" href="#">
<a class="card card-link" href="javascript:void(0)">
<div class="card-body">
<div class="float-{% if include.right %}right{% else %}left mr-3{% endif %}">
{% include ui/avatar.html person=person %}

6
pages/_includes/cards/user-profile-2.html
View File

@@ -4,16 +4,16 @@
<div class="card">
<div class="card-body text-center">
<a href="#">
<a href="javascript:void(0)">
{% include ui/avatar.html person=p size="lg" class="mb-3" %}
</a>
<h4>{{p.full_name}}</h4>
<div class="toolbar justify-content-center">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="map-pin" %}
{{ p.city }}, {{ p.country }}
</a>
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="briefcase" %}
{{ p.job_title }}
</a>

6
pages/_includes/cards/user-profile.html
View File

@@ -5,7 +5,7 @@
<div class="card">
<div class="card-body">
<div class="d-flex align-items-center mb-3">
<a href="#">
<a href="javascript:void(0)">
{% include ui/avatar.html person=p size="lg" %}
</a>
<div class="mx-3">
@@ -21,8 +21,8 @@
officiis.</p>
<div class="d-flex">
<a href="#" class="btn btn-block btn-primary">View profile</a>
<a href="#" class="btn btn-secondary btn-icon ml-3">
<a href="javascript:void(0)" class="btn btn-block btn-primary">View profile</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-icon ml-3">
{% include ui/icon.html icon="user" %}
</a>
</div>

18
pages/_includes/forms/form-elements-3.html
View File

@@ -6,31 +6,17 @@
<div class="mb-3">
<label class="form-label">Valid State</label>
<input type="text" class="form-control is-valid" name="example-text-input-valid"
placeholder="Valid State..">
<input type="text" class="form-control is-valid" placeholder="Valid State..">
<input type="text" class="form-control mt-3 state-valid" value="Valid state">
</div>
<div class="mb-3">
<label class="form-label">Invalid State</label>
<input type="text" class="form-control is-invalid" name="example-text-input-invalid"
placeholder="Invalid State..">
<input type="text" class="form-control is-invalid" placeholder="Invalid State..">
<div class="invalid-feedback">Invalid feedback</div>
<input type="text" class="form-control mt-3 state-invalid" value="Invalid state">
</div>
<div class="mb-3">
<label class="form-label">Country</label>
<select class="form-select">
<option value="">Germany</option>
</select>
</div>
<div class="mb-3">
<label class="form-label">Size</label>
{% include ui/input-selectgroup.html values="S,M,L,XL,XXL" type="radio" name="size" %}
</div>

14
pages/_includes/layout/debug.html
View File

@@ -1,10 +1,10 @@
<div class="debug">
<a href="#" data-debug="dark">Dark mode</a>
<a href="#" data-debug="rtl">RTL mode</a>
<a href="#" data-debug="code">Show cards code</a>
<a href="#" data-debug="folded">Folded sidebar</a>
<a href="#" data-debug="fullscreen">Fullscreen</a>
<a href="#" data-debug="header-sticky">Sticky header</a>
<a href="javascript:void(0)" data-debug="dark">Dark mode</a>
<a href="javascript:void(0)" data-debug="rtl">RTL mode</a>
<a href="javascript:void(0)" data-debug="code">Show cards code</a>
<a href="javascript:void(0)" data-debug="folded">Folded sidebar</a>
<a href="javascript:void(0)" data-debug="fullscreen">Fullscreen</a>
<a href="javascript:void(0)" data-debug="header-sticky">Sticky header</a>
<a href="{{ site.base }}/pages.html">All pages</a>
<div class="debug-info">Jekyll {{ jekyll.version }}</div>
@@ -137,7 +137,7 @@
var $card = $(this),
htmlCode = $card[0].innerHTML.replace(/(^[ \t]*\n)/gm, '');
var $button = $('<div class="card-debug"><a href="#" class="text-muted-light" data-code>code</a></div>'),
var $button = $('<div class="card-debug"><a href="javascript:void(0)" class="text-muted-light" data-code>code</a></div>'),
$codeLink = $button.find('[data-code]');
$codeLink

8
pages/_includes/layout/page-title.html
View File

@@ -21,17 +21,17 @@
</div>
</div>
</div>
<a href="#" class="btn btn-icon btn-secondary ml-2">
<a href="javascript:void(0)" class="btn btn-icon btn-secondary ml-2">
{% include ui/icon.html icon="refresh-ccw" %}
</a>
<a href="#" class="btn btn-icon btn-secondary ml-2">
<a href="javascript:void(0)" class="btn btn-icon btn-secondary ml-2">
{% include ui/icon.html icon="filter" %}
</a>
</form>
{% elsif page.page-right == "breadcrumb" %}
<ol class="breadcrumb m-0">
<li class="breadcrumb-item"><a href="#">UI Kit</a></li>
<li class="breadcrumb-item"><a href="#">Tables</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0)">UI Kit</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0)">Tables</a></li>
<li class="breadcrumb-item active">Basic Tables</li>
</ol>
{% endif %}

2
pages/_includes/layout/sidenav-content.html
View File

@@ -21,7 +21,7 @@
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" class="nav-link">
<a href="javascript:void(0)" class="nav-link">
<span class="nav-icon">{% include ui/icon.html icon="power" %}</span>
<span class="nav-text">Logout</span>
</a>

2
pages/_includes/parts/calendar.html
View File

@@ -34,7 +34,7 @@
{% endif %}
<div class="calendar-date{% if day <= 0 %} prev-month{% elsif day > days %} next-month{% endif %}{% if range-start and day >= range-start and range-end and day <= range-end %} calendar-range{% if day == range-start %} range-start{% endif %}{% if day == range-end %} range-end{% endif %}{% endif %}">
<a href="#" class="date-item{% if day == today %} date-today{% endif %}">{{ d }}</a>
<a href="javascript:void(0)" class="date-item{% if day == today %} date-today{% endif %}">{{ d }}</a>
</div>
{% endfor %}
</div>

8
pages/_includes/parts/dropdown/days.html
View File

@@ -1,10 +1,10 @@
<div class="dropdown">
<a class="dropdown-toggle text-muted-light" href="#" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<a class="dropdown-toggle text-muted-light" href="javascript:void(0)" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ include.value | default: 'Last 7 days' }}
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item active" href="#">Last 7 days</a>
<a class="dropdown-item" href="#">Last 30 days</a>
<a class="dropdown-item" href="#">Last 3 months</a>
<a class="dropdown-item active" href="javascript:void(0)">Last 7 days</a>
<a class="dropdown-item" href="javascript:void(0)">Last 30 days</a>
<a class="dropdown-item" href="javascript:void(0)">Last 3 months</a>
</div>
</div>

5
pages/_includes/parts/input-datalist.html
View File

@@ -2,8 +2,7 @@
<label class="form-label">Datalist example</label>
<input class="form-control" list="datalistOptions" placeholder="Type to search..." />
<datalist id="datalistOptions">
{% for country in site.data.countries %}
<option value="{{ country | escape }}">
{% endfor %}
{% for country in site.data.countries limit: 10 %}
<option value="{{ country | escape }}" />{% endfor %}
</datalist>
</div>

36
pages/_includes/parts/navbar.html
View File

@@ -27,7 +27,7 @@
{% endif %}
{% if include.plus-left %}
<a href="#" class="btn btn-primary">
<a href="javascript:void(0)" class="btn btn-primary">
{% include ui/icon.html icon="plus" %}
</a>
{% endif %}
@@ -66,7 +66,7 @@
<div class="flex">
<span>6 Notifications</span>
</div>
<a href="#">See all <i class="fa fa-angle-right text-muted"></i></a>
<a href="javascript:void(0)">See all <i class="fa fa-angle-right text-muted"></i></a>
</div>
</div>
</li>
@@ -74,7 +74,7 @@
{% if include.progress %}
<li class="nav-item">
<a href="#" class="nav-link text-muted-light">
<a href="javascript:void(0)" class="nav-link text-muted-light">
Profile Completeness: 70%
<!--<span class="progress progress-xs">-->
<!--<span class="progress-bar" style="width: 70%"></span>-->
@@ -85,12 +85,12 @@
{% if include.language %}
<li class="nav-item dropdown">
<a href="#" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
<a href="javascript:void(0)" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
<span class="flag flag-gb mr-2"></span>English
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-scrollable">
{% for language in site.data.languages %}
<a href="#" class="dropdown-item"><span class="flag flag-{{ language.flag }} mr-2"></span>{{
<a href="javascript:void(0)" class="dropdown-item"><span class="flag flag-{{ language.flag }} mr-2"></span>{{
language.name }}</a>
{% endfor %}
</div>
@@ -103,7 +103,7 @@
{% if include.user-menu %}
<li class="nav-item dropdown">
<a href="#" data-toggle="dropdown"
<a href="javascript:void(0)" data-toggle="dropdown"
class="nav-link d-flex align-items-center py-0 px-lg-0 px-2 text-color ml-2">
{% if include.user-menu == 1 %}
{% include ui/avatar.html src=person.photo %}
@@ -123,24 +123,24 @@
{% endif %}
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
{% include ui/icon.html icon="user" class="dropdown-icon" %} Profile
</a>
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
{% include ui/icon.html icon="settings" class="dropdown-icon" %} Settings
</a>
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
<span class="float-right"><span class="badge badge-primary">6</span></span>
{% include ui/icon.html icon="mail" class="dropdown-icon" %} Inbox
</a>
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
{% include ui/icon.html icon="send" class="dropdown-icon" %} Message
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
{% include ui/icon.html icon="help-circle" class="dropdown-icon" %} Need help?
</a>
<a class="dropdown-item" href="#">
<a class="dropdown-item" href="javascript:void(0)">
{% include ui/icon.html icon="log-out" class="dropdown-icon" %} Sign out
</a>
</div>
@@ -149,18 +149,18 @@
{% if include.manage %}
<li class="nav-item">
<a href="#" class="btn btn-secondary">Manage Widgets</a>
<a href="javascript:void(0)" class="btn btn-secondary">Manage Widgets</a>
</li>
{% endif %}
{% if include.register %}
<li class="nav-item ">
<a href="#" class="nav-link">
<a href="javascript:void(0)" class="nav-link">
Sign in
</a>
</li>
<li class="d-flex align-items-center">
<a href="#" class="btn btn-pill btn-sm btn-primary d-none d-lg-block">
<a href="javascript:void(0)" class="btn btn-pill btn-sm btn-primary d-none d-lg-block">
Register
</a>
</li>
@@ -168,19 +168,19 @@
{% if include.plus %}
<li class="nav-item">
<a href="#" class="btn btn-primary btn-icon">{% include ui/icon.html icon="plus" %}</a>
<a href="javascript:void(0)" class="btn btn-primary btn-icon">{% include ui/icon.html icon="plus" %}</a>
</li>
{% endif %}
{% if include.premium %}
<li class="nav-item">
<a href="#" class="btn btn-success">Go Premium</a>
<a href="javascript:void(0)" class="btn btn-success">Go Premium</a>
</li>
{% endif %}
{% if include.sync %}
<li class="nav-item">
<a href="#" class="btn btn-secondary">{% include ui/icon.html icon="rotate-cw" class="mr-2" %}Sync</a>
<a href="javascript:void(0)" class="btn btn-secondary">{% include ui/icon.html icon="rotate-cw" class="mr-2" %}Sync</a>
</li>
{% endif %}
</ul>

6
pages/_includes/parts/pagination.html
View File

@@ -2,7 +2,7 @@
{% assign active-item = include.active-item | default: 2 %}
<ul class="pagination {{ include.class }}">
<li class="page-item{% if include.prev-description %} page-prev{% endif %} disabled">
<a class="page-link" href="#" tabindex="-1">
<a class="page-link" href="javascript:void(0)" tabindex="-1">
{% if include.prev-description %}
<div class="page-item-subtitle">Previous</div>
<div class="page-item-title">{{ include.prev-description }}</div>
@@ -13,11 +13,11 @@
</li>
{% for i in (1..count) %}
<li class="page-item{% if i == active-item %} active{% endif %}"><a class="page-link" href="#">{{ i }}</a></li>
<li class="page-item{% if i == active-item %} active{% endif %}"><a class="page-link" href="javascript:void(0)">{{ i }}</a></li>
{% endfor %}
<li class="page-item{% if include.prev-description %} page-next{% endif %}">
<a class="page-link" href="#">
<a class="page-link" href="javascript:void(0)">
{% if include.next-description %}
<div class="page-item-subtitle">Next</div>

6
pages/_includes/ui/alert.html
View File

@@ -5,9 +5,9 @@
"This is a custom alert box!" }}
{% if include.buttons %}
<div class="btn-list">
<a href="#" class="btn btn-success">Save changes</a>
<a href="#" class="btn btn-secondary">Cancel</a>
<a href="javascript:void(0)" class="btn btn-success">Save changes</a>
<a href="javascript:void(0)" class="btn btn-secondary">Cancel</a>
</div>
{% endif %}
{% if include.close %}<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>{% endif %}
{% if include.close %}<a href="javascript:void(0)" class="close" data-dismiss="alert" aria-label="close">&times;</a>{% endif %}
</div>

2
pages/_includes/ui/avatar-list.html
View File

@@ -6,6 +6,6 @@
{% include ui/avatar.html person=person size=size %}
{% endfor %}
{% if include.text %}
<a href="#" class="avatar">{{ include.text }}</a>
<a href="javascript:void(0)" class="avatar">{{ include.text }}</a>
{% endif %}
</div>

4
pages/_includes/ui/breadcrumb.html
View File

@@ -2,9 +2,9 @@
<ol class="breadcrumb{% if include.class %} {{ include.class }}{% endif %}" aria-label="breadcrumbs">
{% for page in pages %}
{% if forloop.last %}
<li class="breadcrumb-item active" aria-current="page"><a href="#">{{ page }}</a></li>
<li class="breadcrumb-item active" aria-current="page"><a href="javascript:void(0)">{{ page }}</a></li>
{% else %}
<li class="breadcrumb-item"><a href="#">{{ page }}</a></li>
<li class="breadcrumb-item"><a href="javascript:void(0)">{{ page }}</a></li>
{% endif %}
{% endfor %}
</ol>

2
pages/_includes/ui/dropdown-menu.html
View File

@@ -4,7 +4,7 @@
{% if item == '-' %}
<div class="dropdown-divider"></div>
{% else %}
<a class="dropdown-item" href="#">{{ item }}</a>
<a class="dropdown-item" href="javascript:void(0)">{{ item }}</a>
{% endif %}
{% endfor %}
</div>

2
pages/_includes/ui/steps.html
View File

@@ -4,7 +4,7 @@
{% for i in (1..count) %}
{% assign elem = 'a' %}
{% if i > active %}{% assign elem = 'span' %}{% endif %}
<{{ elem }} href="#" class="step-item{% if i == active %} active{% endif %}"{% if include.show-tooltip %} data-toggle="tooltip" title="Step {{ i }} description"{% endif %}>{% if include.show-title %}
<{{ elem }} href="javascript:void(0)" class="step-item{% if i == active %} active{% endif %}"{% if include.show-tooltip %} data-toggle="tooltip" title="Step {{ i }} description"{% endif %}>{% if include.show-title %}
Step {{ i }}
{% endif %}</{{ elem }}>
{% endfor %}

14
pages/buttons.html
View File

@@ -35,15 +35,15 @@ done: true
{% include ui/button.html text="Button" block=true color="secondary" %}
</p>
<p>
<a href="#" class="btn btn-secondary">{% include ui/avatar.html person-id="4" class="btn-avatar" %} Avatar</a>
<a href="#" class="btn btn-secondary">{% include ui/avatar.html person-id="5" class="btn-avatar" %} Avatar</a>
<a href="#" class="btn btn-secondary">{% include ui/avatar.html person-id="6" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary">{% include ui/avatar.html person-id="4" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary">{% include ui/avatar.html person-id="5" class="btn-avatar" %} Avatar</a>
<a href="javascript:void(0)" class="btn btn-secondary">{% include ui/avatar.html person-id="6" class="btn-avatar" %} Avatar</a>
</p>
<p>
<a href="#" class="btn btn-primary btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="#" class="btn btn-secondary btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="#" class="btn btn-warning btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="#" class="btn btn-outline-danger btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="javascript:void(0)" class="btn btn-primary btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="javascript:void(0)" class="btn btn-warning btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
<a href="javascript:void(0)" class="btn btn-outline-danger btn-loading"><span class="loader btn-loader"></span> Loading&hellip;</a>
</p>
<p>

36
pages/cards-2.html
View File

@@ -12,14 +12,14 @@ done: true
<div class="media media-4x3 col-4">
<a class="media-content" style="background-image:url({% include ui/image.html id=6 %})"></a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-white-overlay">MUSIC</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-white-overlay">MUSIC</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column">
<div class="flex-fill">
<a href="#" class="card-title text-md">
<a href="javascript:void(0)" class="card-title text-md">
Radio Listeners Prepare For An Impending Alien Invasion In This Visually Stunning Short Film
</a>
<a class="text-muted mt-2">What Not To Wear: The Hats, Scarves In History</a>
@@ -34,14 +34,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=7 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-dark-overlay">MUSIC</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-dark-overlay">MUSIC</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column">
<div class="flex-fill ">
<a href="#" class="card-title text-md">
<a href="javascript:void(0)" class="card-title text-md">
It’s 2018, and the race is on between tech giants to decide who will control what you see every time you open your eyes
</a>
<a class="text-muted mt-2 ">What Not To Wear: The Hats, Scarves In History</a>
@@ -58,14 +58,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=8 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-primary">TOP5</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-primary">TOP5</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<a href="#" class="card-title ">
<a href="javascript:void(0)" class="card-title ">
The Tallest Unclimbed Mountains In The World
</a>
</div>
@@ -81,14 +81,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=9 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-info">Music</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-info">Music</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<a href="#" class="card-title ">
<a href="javascript:void(0)" class="card-title ">
Congrats on the Lifestyle! The Dark Side to Influencer Marketing
</a>
</div>
@@ -104,14 +104,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=10 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-primary">TOP5</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-primary">TOP5</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<a href="#" class="card-title h-2x">
<a href="javascript:void(0)" class="card-title h-2x">
The Tallest Unclimbed Mountains In The World
</a>
</div>
@@ -127,14 +127,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=11 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-danger">Fashion</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-danger">Fashion</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<a href="#" class="card-title h-2x">
<a href="javascript:void(0)" class="card-title h-2x">
What Not To Wear: The Hats, Scarves In History
</a>
</div>
@@ -150,14 +150,14 @@ done: true
<a class="media-content " style="background-image:url({% include ui/image.html id=12 %})">
</a>
<div class="media-overlay overlay-top">
<a href="#"><span class="badge badge-md text-uppercase bg-warning">AI</span></a>
<a href="javascript:void(0)"><span class="badge badge-md text-uppercase bg-warning">AI</span></a>
</div>
<div class="media-action ">
</div>
</div>
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<a href="#" class="card-title">
<a href="javascript:void(0)" class="card-title">
How AI Helps Recruiters Track Jobseekers’ Emotions
</a>
</div>
@@ -179,11 +179,11 @@ done: true
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<div class="mb-3">
<a href="#">
<a href="javascript:void(0)">
<span class="badge badge-md text-uppercase bg-danger">Fashion</span>
</a>
</div>
<a href="#" class="card-title h-2x">
<a href="javascript:void(0)" class="card-title h-2x">
What Not To Wear: The Hats, Scarves In History
</a>
</div>
@@ -204,11 +204,11 @@ done: true
<div class="card-body d-flex flex-column ">
<div class="flex-fill ">
<div class="mb-3">
<a href="#">
<a href="javascript:void(0)">
<span class="badge badge-md text-uppercase bg-warning">AI</span>
</a>
</div>
<a href="#" class="card-title h-2x">
<a href="javascript:void(0)" class="card-title h-2x">
How AI Helps Recruiters Track Jobseekers’ Emotions
</a>
</div>

16
pages/email.html
View File

@@ -10,31 +10,31 @@ page-title: Crypto currencies
<div>
<div class="list-group list-group-transparent mb-0">
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center active">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center active">
<span class="icon mr-3">{% include ui/icon.html icon="inbox" %}</span>Inbox <span class="ml-auto badge bg-blue">14</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="send" %}</span>Sent Mail
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="alert-circle" %}</span>Important <span class="ml-auto badge bg-gray">3</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="star" %}</span>Starred
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="file" %}</span>Drafts
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="tag" %}</span>Tags
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<a href="javascript:void(0)" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="trash" %}</span>Trash
</a>
</div>
<div class="mt-4">
<a href="#" class="btn btn-secondary btn-block">Compose new Email</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-block">Compose new Email</a>
</div>
</div>
</div>

6
pages/gallery.html
View File

@@ -11,7 +11,7 @@ done: true
{% assign person = site.data.people[forloop.index0] %}
<div class="col-sm-6 col-lg-4">
<div class="card p-3">
<a href="#" class="mb-3"><img src="{{ site.base }}/img/photos/{{photo.file}}" class="rounded"></a>
<a href="javascript:void(0)" class="mb-3"><img src="{{ site.base }}/img/photos/{{photo.file}}" class="rounded"></a>
<div class="d-flex align-items-center">
{% include ui/avatar.html person=person class="mr-2" %}
<div>
@@ -19,11 +19,11 @@ done: true
<div class="text-muted">{{ forloop.index | random_date_ago: 10 | timeago }}</div>
</div>
<div class="ml-auto">
<a href="#" class="text-muted">
<a href="javascript:void(0)" class="text-muted">
{% include ui/icon.html icon="eye" %}
{{ forloop.index | random_number: 300, 600 }}
</a>
<a href="#" class="ml-3 text-muted">
<a href="javascript:void(0)" class="ml-3 text-muted">
{% include ui/icon.html icon="heart" %}
{{ forloop.index | random_number: 20, 100 }}
</a>

2
pages/homepage.html
View File

@@ -16,7 +16,7 @@ page-title: Homepage
<div class="d-flex">
{% include ui/avatar.html person=person class="mr-3" size="md" %}
<div>
{{ person.first_name }} <a href="#">created a new task</a><br>
{{ person.first_name }} <a href="javascript:void(0)">created a new task</a><br>
<div class="text-muted">{{ forloop.index | random_number: 1, 10 }}h ago</div>
</div>
</div>

26
pages/repo.html
View File

@@ -12,18 +12,18 @@ done: true
master
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">dev</a>
<a class="dropdown-item" href="#">stage</a>
<a class="dropdown-item" href="#">fix/ui-1</a>
<a class="dropdown-item" href="javascript:void(0)">dev</a>
<a class="dropdown-item" href="javascript:void(0)">stage</a>
<a class="dropdown-item" href="javascript:void(0)">fix/ui-1</a>
</div>
</div>
<div class="ml-auto">
<div class="btn-list">
<a href="#" class="btn btn-secondary btn-icon">{% include ui/icon.html icon="refresh-ccw" %}</a>
<a href="#" class="btn btn-secondary">{% include ui/icon.html icon="eye" class="mr-1" %}Watch</a>
<a href="#" class="btn btn-success">{% include ui/icon.html icon="download" class="mr-1" %}Clone or download</a>
<a href="#" class="btn btn-secondary btn-icon">{% include ui/icon.html icon="settings" %}</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-icon">{% include ui/icon.html icon="refresh-ccw" %}</a>
<a href="javascript:void(0)" class="btn btn-secondary">{% include ui/icon.html icon="eye" class="mr-1" %}Watch</a>
<a href="javascript:void(0)" class="btn btn-success">{% include ui/icon.html icon="download" class="mr-1" %}Clone or download</a>
<a href="javascript:void(0)" class="btn btn-secondary btn-icon">{% include ui/icon.html icon="settings" %}</a>
</div>
</div>
</div>
@@ -32,12 +32,12 @@ done: true
<div class="d-flex align-items-center w-100">
{% include ui/avatar.html person=person size="xs" class="mr-2" %}
<div>
<a href="#" class="text-default">{{ person.full_name }}</a>
<a href="javascript:void(0)" class="text-default">{{ person.full_name }}</a>
merge pull request
<a href="#" class="text-default">#176</a>
<a href="javascript:void(0)" class="text-default">#176</a>
from codecalm/dev
</div>
<div class="ml-auto">Latest commit <a href="#" class="text-inherit font-semibold">54e9403</a> 4 days ago</div>
<div class="ml-auto">Latest commit <a href="javascript:void(0)" class="text-inherit font-semibold">54e9403</a> 4 days ago</div>
</div>
</div>
<div class="table-responsive">
@@ -50,13 +50,13 @@ done: true
{% else %}
{% include ui/icon.html icon="file" class="mr-1" %}
{% endif %}
<a href="#" class="text-default">{{ file.name }}</a>
<a href="javascript:void(0)" class="text-default">{{ file.name }}</a>
</td>
<td class="text-muted text-nowrap">
<a href="#" class="text-inherit">{{ file.comment }}</a>
<a href="javascript:void(0)" class="text-inherit">{{ file.comment }}</a>
</td>
<td class="text-right text-muted text-nowrap">
<a href="#" class="text-inherit">{{ file.date }}</a>
<a href="javascript:void(0)" class="text-inherit">{{ file.date }}</a>
</td>
</tr>
{% endfor %}

10
scss/ui/forms/_input.custom.scss
View File

@@ -35,3 +35,13 @@ Icon input
left: auto;
}
}
/**
Bootstrap color input
*/
.form-control-color {
&::-webkit-color-swatch {
border: none;
}
}