Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision
  • clickable-select-chevron
  • feat/new-image-formats
  • master
  • 1.2.0
  • 1.4.0
  • 1.4.1
  • 1.4.2
  • 1.5.0
  • 1.5.1
  • 1.5.2
  • 1.5.3
  • 1.5.4
  • 1.5.5
  • 1.6.0
  • 1.6.1
  • 1.6.2
  • 1.6.3
  • 1.6.4
  • 1.7.0
  • 1.8.0
  • 2.0.0
  • 2.0.0-alpha-1
  • 2.0.0-alpha-10
  • 2.0.0-alpha-11
  • 2.0.0-alpha-12
  • 2.0.0-alpha-13
  • 2.0.0-alpha-14
  • 2.0.0-alpha-15
  • 2.0.0-alpha-16
  • 2.0.0-alpha-17
  • 2.0.0-alpha-2
  • 2.0.0-alpha-3
  • 2.0.0-alpha-4
  • 2.0.0-alpha-5
  • 2.0.0-alpha-6
  • 2.0.0-alpha-7
  • 2.0.0-alpha-8
  • 2.0.0-alpha-9
  • 2.0.1
  • 2.0.2
  • 2.0.3
  • 2.0.4
  • 2.1.0
  • 2.1.1
  • 2.1.2
  • 2.10.0
  • 2.11.0
  • 2.12.1
  • 2.13.0
  • 2.14.0
  • 2.15.0
  • 2.16.0
  • 2.16.1
  • 2.17.0
  • 2.18.0
  • 2.19.0
  • 2.2.0
  • 2.2.1
  • 2.20.0
  • 2.3.0
  • 2.3.1
  • 2.3.2
  • 2.3.3
  • 2.3.4
  • 2.4.0
  • 2.5.0
  • 2.5.1
  • 2.5.2
  • 2.6.0
  • 2.7.0
  • 2.7.1
  • 2.8.0
  • 2.9.0
  • 2.9.1
74 results

Target

Select target project
  • to/weby/ui-styleguide
  • va-fighters/ui-styleguide
2 results
Select Git revision
  • master
  • 1.2.0
  • 1.4.0
  • 1.4.1
  • 1.4.2
  • 1.5.0
  • 1.5.1
  • 1.5.2
  • 1.5.3
  • 1.5.4
  • 1.5.5
  • 1.6.0
  • 1.6.1
  • 1.6.2
  • 1.6.3
  • 1.6.4
  • 1.7.0
  • 1.8.0
  • 2.0.0-alpha-1
  • 2.0.0-alpha-10
  • 2.0.0-alpha-11
  • 2.0.0-alpha-2
  • 2.0.0-alpha-3
  • 2.0.0-alpha-4
  • 2.0.0-alpha-5
  • 2.0.0-alpha-6
  • 2.0.0-alpha-7
  • 2.0.0-alpha-8
  • 2.0.0-alpha-9
29 results
Show changes
Showing
with 219 additions and 21 deletions
<nav class="pagination pagination--inline space-x-1 {{ classes }}">
{{> atoms-icon-button(cta: "Předchozí", icon: "ico--chevron-left", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed btn--inverted-icon") }}
{{> atoms-basic-button(cta: "1", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed hidden md:inline-block") }}
{{> atoms-basic-button(cta: "2", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed hidden md:inline-block") }}
{{> atoms-basic-button(cta: "3", classes: "btn--grey-500 btn--condensed hidden md:inline-block") }}
{{> atoms-basic-button(cta: "4", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed hidden md:inline-block") }}
{{> atoms-basic-button(cta: "5", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed hidden md:inline-block") }}
{{> atoms-icon-button(cta: "Další", icon: "ico--chevron-right", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed") }}
</nav>
<nav class="pagination pagination--inline space-x-1 {{ classes }}">
{{> atoms-icon-button(cta: "Předchozí", icon: "ico--chevron-left", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed btn--inverted-icon") }}
{{> atoms-icon-button(cta: "Další", icon: "ico--chevron-right", classes: "btn--grey-125 btn--hoveractive btn--to-black btn--condensed") }}
</nav>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-6 gap-4" style="min-height: 500px;">
{{> molecules-banner(color: "bg-black") }}
{{> molecules-banner(color: "bg-violet-300") }}
{{> molecules-banner(color: "bg-green-200") }}
{{> molecules-banner(color: "bg-blue-200") }}
{{> molecules-banner(color: "bg-violet-500") }}
{{> molecules-banner(color: "bg-red-600") }}
{{> molecules-banner(color: "bg-blue-300") }}
{{> molecules-banner(color: "bg-brands-facebook") }}
{{> molecules-banner(color: "bg-brands-twitter") }}
</div>
<div class="form-field {{# error }}form-field--error{{/ error }} {{ classes }}">
{{^ nolabel }}
<label class="form-field__label" for="field">{{ label }}{{^ label }}{{ form.label }}{{/ label }}</label>
{{/ nolabel }}
<div class="form-field__wrapper form-field__wrapper--shadowed">
{{> atoms-textarea }}
</div>
......
<ul class="navbar-menu text-white">
<li class="navbar-menu__item">
<a href="#" data-href="{{ link.templates-homepage }}" class="navbar-menu__link">Hlavní strana</a>
</li>
<li class="navbar-menu__item">
<ui-navbar-subitem-replacing label="Lidé">
<span class="navbar-menu__link navbar-menu__submenu-toggle">Lidé</span>
<div class="navbar-menu__submenu-wrap">
<ul class="navbar-menu__submenu">
<li><a href="#" data-href="{{ link.templates-people }}" class="navbar-menu__link">Delší link co je delší než hlavní menu položka</a></li>
</ul>
</div>
</ui-navbar-subtitem-replacing>
</li>
<li class="navbar-menu__item">
<a href="#" data-href="{{ link.templates-pirate-center }}" class="navbar-menu__link">Pirátské centrum</a>
</li>
<li class="navbar-menu__item">
<a href="#" data-href="{{ link.templates-contact }}" class="navbar-menu__link">Kontakt</a>
</li>
</ul>
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
{{> molecules-chip(classes: "chip--black") }}
{{> molecules-chip(classes: "chip--grey-700") }}
{{> molecules-chip(classes: "chip--grey-500") }}
{{> molecules-chip(classes: "chip--grey-125") }}
{{> molecules-chip(classes: "chip--blue-300") }}
{{> molecules-chip(classes: "chip--cyan-200") }}
{{> molecules-chip(classes: "chip--cyan-500") }}
{{> molecules-chip(classes: "chip--green-300") }}
{{> molecules-chip(classes: "chip--green-400") }}
{{> molecules-chip(classes: "chip--orange-300") }}
{{> molecules-chip(classes: "chip--violet-400") }}
{{> molecules-chip(classes: "chip--violet-500") }}
{{> molecules-chip(classes: "chip--red-600") }}
</div>
</div>
<span class="chip chip--grey-125 chip--hoveractive text-xs">
<span class="ico--chevron-left"></span>
</span>
<span class="chip chip--grey-125 chip--hoveractive ml-1">
<span class="ico--chevron-right"></span>
</span>
<span class="chip chip--black chip--select">
<select>
<option value="">Select input choice</option>
<option value="">choice</option>
<option value="">choice</option>
<option value="">choice</option>
<option value="">choice</option>
</select>
<span class="chip__icon ico--chevron-down"></span>
</span>
<div class="chip {{ classes }}">
{{ cta }}
</div>
<div class="space-x-2 text-sm flex items-center">
<button class="text-grey-200 hover:text-blue-300 flex items-center space-x-1">
<span class="font-bold">6</span>
<i class="ico--thumbs-up"></i>
</button>
<button class="text-grey-200 hover:text-red-600 flex items-center space-x-1">
<i class="ico--thumbs-down transform -scale-x-1"></i>
<span class="font-bold">2</span>
</button>
</div>
<div class="space-x-2 text-sm flex items-center">
<button class="text-blue-300 flex items-center space-x-1">
<span class="font-bold">6</span>
<i class="ico--thumbs-up"></i>
</button>
<button class="text-red-600 flex items-center space-x-1">
<i class="ico--thumbs-down transform -scale-x-1"></i>
<span class="font-bold">2</span>
</button>
</div>
<div class="flex items-start p-2 -ml-2">
<img src="{{ img.avatar.src }}" class="w-12 h-12 rounded mr-3">
<div class="flex-1 overflow-hidden">
<div class="mb-1">
<div class="flex justify-between">
<div class="flex items-center">
<span class="font-bold">{{ person.first }} {{ person.last }}</span>
<span class="text-grey-200 text-sm ml-2">KS Pardubický kraj</span>
<span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
{{> molecules-chip(classes: "chip--grey-125 chip--condensed text-grey-300 ml-2", cta: "Příspěvek")}}
</div>
</div>
</div>
<p class="text-black leading-normal">{{ excerpt.medium }}</p>
</div>
</div>
<div class="flex items-start p-2 -ml-2">
<img src="{{ img.avatar.src }}" class="w-12 h-12 rounded mr-3">
<div class="flex-1 overflow-hidden">
<div class="mb-1">
<div class="flex justify-between">
<div class="flex items-center">
<span class="font-bold">{{ person.first }} {{ person.last }}</span>
<span class="text-grey-200 text-sm ml-2">KS Pardubický kraj</span>
<span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
</div>
{{> molecules-thumbs }}
</div>
</div>
<p class="text-black leading-normal">{{ excerpt.medium }}</p>
</div>
</div>
<div class="flex items-start p-2 -ml-2">
<img src="{{ img.avatar.src }}" class="w-12 h-12 rounded mr-3">
<div class="flex-1 overflow-hidden">
<div class="mb-1">
<div class="flex justify-between">
<div class="flex items-center">
<span class="font-bold">{{ person.first }} {{ person.last }}</span>
<span class="text-grey-200 text-sm ml-2">KS Pardubický kraj</span>
<span class="text-grey-200 ml-1 text-sm">@ 11:42</span>
</div>
</div>
</div>
<p class="text-black leading-normal">{{ excerpt.medium }}</p>
</div>
</div>
<div class="dropdown">
<span>Dropdown</span>
<div class="dropdown-content">
<p>Hello World!</p>
</div>
</div>
<div class="btn btn--icon {{ classes }}">
<div class="btn__body-wrap">
<button class="btn__body {{ bodyClasses }}">{{ cta }}</button>
<button class="btn__icon dropdown-button">
<i class="ico--chevron-down"></i>
<ul class="dropdown-button__choices bg-white text-black whitespace-no-wrap">
<li class="dropdown-button__choice hover:bg-grey-125">
<a class="block px-4 py-3" href="#">Navrhnout postup</a>
</li>
</ul>
</button>
</div>
</div>
<div class="modal__overlay hidden toggle-modal-sample-1" id="modal-sample-1">
<div class="modal__content" role="dialog">
<div class="modal__container w-full max-w-2xl" role="dialog">
<div class="modal__container-body elevation-10">
<button class="modal__close" title="Zavřít"><i class="ico--cross"></i></button>
{{> molecules-image-card }}
</div>
</div>
</div>
</div>
<button class="toggle-modal-sample-1">Toggle modal</button>
<script>
var toggles = document.getElementsByClassName("toggle-modal-sample-1");
var modal = document.getElementById("modal-sample-1");
for (var i = 0; i < toggles.length; i++) {
toggles[i].addEventListener("click", function () {
modal.classList.toggle("hidden");
})
}
</script>
{{> atoms-image(classes: "mx-auto my-6 lg:max-w-[800px] max-w-full object-contain") }}
{{> atoms-image(classes: "float-left mr-4 mb-6 lg:max-w-[400px] max-w-full object-contain") }}
{{> atoms-image(classes: "float-left mr-4 mb-6 object-contain") }}
{{> atoms-image(classes: "float-right ml-4 mb-6 lg:max-w-[400px] max-w-full object-contain") }}
{{> atoms-image(classes: "float-right ml-4 mb-6 object-contain") }}
......@@ -45,11 +45,11 @@
</nav>
<aside class="subnav-aside">
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': isCurrentView('regions')}">
<a @click="toggleView('regions')" class="subnav-aside__close"><i class="ico--close"></i></a>
<a @click="toggleView('regions')" class="subnav-aside__close"><i class="ico--cross"></i></a>
<ui-region-map class="container container--default"></ui-region-map>
</div>
<div class="subnav-aside__item" :class="{'subnav-aside__item--visible': isCurrentView('calendar')}">
<a @click="toggleView('calendar')" class="subnav-aside__close"><i class="ico--close"></i></a>
<a @click="toggleView('calendar')" class="subnav-aside__close"><i class="ico--cross"></i></a>
<div class="container container--default">
<ui-calendar-renderer :events="events" :on-show-more="onShowMore" :has-more="hasMore" :name="'Krajský kalendář'"></ui-calendar-renderer>
</div>
......
......@@ -28,25 +28,34 @@
<a href="#" data-href="{{ link.templates-homepage }}" class="navbar-menu__link">Hlavní strana</a>
</li>
<li class="navbar-menu__item">
<ui-navbar-subitem label="Lidé">
<ui-navbar-subitem-replacing label="Lidé" items="[[&quot;Delší link co je delší než hlavní menu položka&quot;, &quot;{{ link.templates-people }}&quot;]]">
<span class="navbar-menu__link navbar-menu__submenu-toggle">Lidé</span>
<div class="navbar-menu__submenu-wrap">
<ul class="navbar-menu__submenu">
<li><a href="#" data-href="{{ link.templates-people }}" class="navbar-menu__link">Delší link co je delší než hlavní menu položka</a></li>
</ul>
</ui-navbar-subtitem>
</div>
</ui-navbar-subtitem-replacing>
</li>
<li class="navbar-menu__item">
<ui-navbar-subitem label="Aktuality" href="{{ link.templates-article-listing }}">
<ui-navbar-subitem-replacing label="Aktuality" href="{{ link.templates-article-listing }}" items="[[&quot;Detail aktuality&quot;, &quot;{{ link.templates-article-detail }}&quot;]]">
<a href="{{ link.templates-article-listing }}" class="navbar-menu__link navbar-menu__submenu-toggle">Lidé</a>
<div class="navbar-menu__submenu-wrap">
<ul class="navbar-menu__submenu">
<li><a href="#" data-href="{{ link.templates-article-detail }}" class="navbar-menu__link">Detail aktuality</a></li>
</ul>
</ui-navbar-subtitem>
</div>
</ui-navbar-subtitem-replacing>
</li>
<li class="navbar-menu__item">
<ui-navbar-subitem label="Volby">
<ui-navbar-subitem-replacing label="Volby" items="[[&quot;Volební rozcestník&quot;, &quot;{{ link.templates-elections }}&quot;]]">
<span class="navbar-menu__link navbar-menu__submenu-toggle">Volby</span>
<div class="navbar-menu__submenu-wrap">
<ul class="navbar-menu__submenu">
<li><a href="#" data-href="{{ link.templates-elections }}" class="navbar-menu__link">Volební rozcestník</a></li>
</ul>
</ui-navbar-subtitem>
</div>
</ui-navbar-subtitem-replacing>
</li>
<li class="navbar-menu__item">
<a href="#" data-href="{{ link.templates-pirate-center }}" class="navbar-menu__link">Pirátské centrum</a>
......