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
Hide whitespace changes
Inline Side-by-side
Showing
with 885 additions and 286 deletions
source/css/atoms/container.pcss
View file @ aac6d1d3
......@@ -10,21 +10,19 @@
}
@responsive {
/* Removes default container padding from the element. */
/* @note: needs to be kept in sync with tailwind configuration */
.container-padding--zero {
margin-left: -1rem;
margin-right: -1rem;
/* Removes default container padding from the element. */
/* @note: needs to be kept in sync with tailwind configuration */
.container-padding--zero {
margin-left: -1rem;
margin-right: -1rem;
@screen xl {
margin-left: -2rem;
margin-right: -2rem;
}
@screen xl {
margin-left: -2rem;
margin-right: -2rem;
}
}
.container-padding--auto {
margin-left: 0;
margin-right: 0;
}
.container-padding--auto {
margin-left: 0;
margin-right: 0;
}
source/css/atoms/form-field.pcss
View file @ aac6d1d3
.text-input-addon {
@apply flex items-center bg-grey-125 text-grey-300 font-normal py-3 px-4 text-lg whitespace-no-wrap border border-grey-200 transition duration-200;
@apply flex items-center bg-grey-125 text-grey-300 font-normal py-3 px-4 text-lg whitespace-nowrap border border-grey-200 transition duration-200;
}
.text-input {
......@@ -114,7 +114,7 @@
@apply relative flex;
input {
@apply w-5 h-5 mr-2 flex-shrink-0 cursor-pointer appearance-none outline-none bg-grey-200 border border-grey-200 transition duration-200;
@apply w-5 h-5 mr-2 flex-shrink-0 cursor-pointer appearance-none outline-none bg-white border border-grey-200 transition duration-200;
&:hover:not([disabled]):not([readonly]) {
@apply border-grey-300;
......@@ -127,6 +127,7 @@
&:checked {
@apply bg-blue-300 border-transparent;
}
&[disabled] {
......
source/css/atoms/full-calendar.pcss 0 → 100644
View file @ aac6d1d3
:root {
--fc-button-bg-color: #000;
--fc-button-border-color: #000;
--fc-button-hover-bg-color: #f9ce05;
--fc-button-hover-border-color: #f9ce05;
--fc-button-active-bg-color: #f9ce05;
--fc-button-active-border-color: #f9ce05;
--fc-event-bg-color: #fea86a;
--fc-event-border-color: #fea86a;
--fc-border-color: #ed9654;
--fc-today-bg-color: #ed9654;
--fc-daygrid-event-dot-width: 4px;
}
.fc {
@apply font-condensed;
}
.fc-col-header {
width: 100%!important;
}
/* Don't underline only when there is no href attribute defined. */
.fc .fc-col-header-cell-cushion:not([href]),
.fc .fc-daygrid-day-number:not([href]) {
@apply no-underline;
}
.fc .fc-col-header-cell {
@apply bg-orange-300 p-3 font-alt text-white text-xl capitalize;
}
.fc .fc-button {
@apply font-alt rounded-none px-5 py-2 duration-150;
}
.fc .fc-button:hover:not(:disabled),
.fc .fc-button:active:not(:disabled){
@apply text-black;
}
.fc .fc-event {
@apply p-1 rounded-none border-none text-sm;
}
.fc .fc-toolbar-title,
.fc .fc-today-button {
@apply capitalize;
}
.fc .fc-daygrid-day-number {
@apply font-alt text-3xl text-orange-300;
}
.fc .fc-multimonth-daygrid .fc-daygrid-day-number {
@apply text-base;
}
.fc .fc-day-today .fc-daygrid-day-number {
@apply text-white;
}
source/css/atoms/heading.pcss
View file @ aac6d1d3
......@@ -3,7 +3,8 @@
}
.h-alt {
@apply font-alt font-normal leading-negative;
@apply font-alt font-normal;
line-height: 0.96;
}
.h-allcaps {
......@@ -11,119 +12,123 @@
}
@responsive {
.head-alt-xl,
.content-block .head-alt-xl {
@apply text-7xl font-alt font-normal leading-negative;
}
.head-alt-lg,
.content-block .head-alt-lg {
@apply text-6xl font-alt font-normal leading-negative;
}
.head-alt-xl,
.content-block .head-alt-xl {
@apply text-7xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-md,
.content-block .head-alt-md {
@apply text-4xl font-alt font-normal leading-negative;
}
.head-alt-lg,
.content-block .head-alt-lg {
@apply text-6xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-base,
.content-block .head-alt-base {
@apply text-3xl font-alt font-normal leading-negative;
}
.head-alt-md,
.content-block .head-alt-md {
@apply text-4xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-sm,
.content-block .head-alt-sm {
@apply text-2xl font-alt font-normal leading-negative;
}
.head-alt-base,
.content-block .head-alt-base {
@apply text-3xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-xs,
.content-block .head-alt-xs {
@apply text-xl font-alt font-normal leading-negative;
}
.head-alt-sm,
.content-block .head-alt-sm {
@apply text-2xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-2xs,
.content-block .head-alt-2xs {
@apply text-lg font-alt font-normal leading-negative;
}
.head-alt-xs,
.content-block .head-alt-xs {
@apply text-xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-2xs,
.content-block .head-alt-2xs {
@apply text-lg font-alt font-normal;
line-height: 0.96;
}
.head-base,
.content-block .head-base {
@apply text-3xl font-condensed font-medium leading-tight;
}
.head-sm,
.content-block .head-sm {
@apply text-2xl font-condensed font-medium leading-tight;
}
.head-base,
.content-block .head-base {
@apply text-3xl font-condensed font-medium leading-tight;
}
.head-xs,
.content-block .head-xs {
@apply text-xl font-condensed font-medium leading-tight;
}
.head-sm,
.content-block .head-sm {
@apply text-2xl font-condensed font-medium leading-tight;
}
.head-2xs,
.content-block .head-2xs {
@apply text-lg font-condensed font-medium leading-tight;
}
.head-xs,
.content-block .head-xs {
@apply text-xl font-condensed font-medium leading-tight;
}
.head-2xs,
.content-block .head-2xs {
@apply text-lg font-condensed font-medium leading-tight;
}
.head-heavy-base,
.content-block .head-heavy-base {
@apply text-3xl font-condensed font-bold leading-tight;
}
.head-heavy-sm,
.content-block .head-heavy-sm {
@apply text-2xl font-condensed font-bold leading-tight;
}
.head-heavy-base,
.content-block .head-heavy-base {
@apply text-3xl font-condensed font-bold leading-tight;
}
.head-heavy-xs,
.content-block .head-heavy-xs {
@apply text-xl font-condensed font-bold leading-tight;
}
.head-heavy-sm,
.content-block .head-heavy-sm {
@apply text-2xl font-condensed font-bold leading-tight;
}
.head-heavy-2xs,
.content-block .head-heavy-2xs {
@apply text-lg font-condensed font-bold leading-tight;
}
.head-heavy-xs,
.content-block .head-heavy-xs {
@apply text-xl font-condensed font-bold leading-tight;
}
.head-heavy-2xs,
.content-block .head-heavy-2xs {
@apply text-lg font-condensed font-bold leading-tight;
}
.head-allcaps-2xs,
.content-block .head-allcaps-2xs {
@apply text-lg font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-3xs,
.content-block .head-allcaps-3xs {
@apply text-base font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-2xs,
.content-block .head-allcaps-2xs {
@apply text-lg font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-4xs,
.content-block .head-allcaps-4xs {
@apply text-sm font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-3xs,
.content-block .head-allcaps-3xs {
@apply text-base font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-4xs,
.content-block .head-allcaps-4xs {
@apply text-sm font-condensed font-normal uppercase leading-tight;
}
.head-allcaps-heavy-2xs,
.content-block .head-allcaps-heavy-2xs {
@apply text-lg font-condensed font-bold uppercase leading-tight;
}
.head-allcaps-heavy-3xs,
.content-block .head-allcaps-heavy-3xs {
@apply text-base font-condensed font-bold uppercase leading-tight;
}
.head-allcaps-heavy-2xs,
.content-block .head-allcaps-heavy-2xs {
@apply text-lg font-condensed font-bold uppercase leading-tight;
}
.head-allcaps-heavy-4xs,
.content-block .head-allcaps-heavy-4xs {
@apply text-sm font-condensed font-bold uppercase leading-tight;
}
.head-allcaps-heavy-3xs,
.content-block .head-allcaps-heavy-3xs {
@apply text-base font-condensed font-bold uppercase leading-tight;
}
.head-allcaps-heavy-4xs,
.content-block .head-allcaps-heavy-4xs {
@apply text-sm font-condensed font-bold uppercase leading-tight;
}
source/css/atoms/horizontal-rule.pcss
View file @ aac6d1d3
hr:not(.hr--unstyled) {
@apply border-t border-grey-100 my-4;
@screen md {
@apply my-8;
}
@apply border-t border-grey-100 my-4 md:my-8;
&.hr--big {
@apply my-8;
@screen md {
@apply my-16;
}
@apply my-8 md:my-16;
}
&.hr--condensed {
@apply my-2;
@screen md {
@apply my-4;
}
@apply my-2 md:my-4;
}
}
source/css/atoms/icons.pcss
View file @ aac6d1d3
@font-face {
font-family: 'pirati-ui';
src: url('../fonts/pirati-ui.eot?71e4e2c92abaa13920ac90278872d7d4');
src: url('../fonts/pirati-ui.eot?71e4e2c92abaa13920ac90278872d7d4#iefix') format('embedded-opentype'),
url('../fonts/pirati-ui.ttf?71e4e2c92abaa13920ac90278872d7d4') format('truetype'),
url('../fonts/pirati-ui.woff?71e4e2c92abaa13920ac90278872d7d4') format('woff'),
url('../fonts/pirati-ui.svg?71e4e2c92abaa13920ac90278872d7d4#pirati-ui') format('svg');
font-weight: normal;
src: url('../fonts/pirati-ui.eot?964zxx');
src: url('../fonts/pirati-ui.eot?964zxx#iefix') format('embedded-opentype'),
url('../fonts/pirati-ui.ttf?964zxx') format('truetype'),
url('../fonts/pirati-ui.woff?964zxx') format('woff'),
url('../fonts/pirati-ui.svg?964zxx#pirati-ui') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
......@@ -26,117 +25,363 @@
-moz-osx-font-smoothing: grayscale;
}
.ico--lock-open:before { content: "\e949"; }
.ico--lock:before { content: "\e94a"; }
.ico--dots-three-vertical:before { content: "\e940"; }
.ico--dots-three-horizontal:before { content: "\e941"; }
.ico--log-out:before { content: "\e942"; }
.ico--pin:before { content: "\e943"; }
.ico--edit-pencil:before { content: "\e929"; }
.ico--at:before { content: "\e905"; }
.ico--strategy:before { content: "\e932"; }
.ico--pig:before { content: "\e928"; }
.ico--thermometer:before { content: "\e90a"; }
.ico--pirati:before { content: "\e90d"; }
.ico--stackshare:before { content: "\e90f"; }
.ico--open-source:before { content: "\e90e"; }
.ico--search:before { content: "\e913"; }
.ico--switch:before { content: "\e94b"; }
.ico--loop:before { content: "\e94c"; }
.ico--repeat:before { content: "\e94c"; }
.ico--player:before { content: "\e94c"; }
.ico--reload:before { content: "\e94c"; }
.ico--refresh:before { content: "\e94c"; }
.ico--update:before { content: "\e94c"; }
.ico--synchronize:before { content: "\e94c"; }
.ico--arrows:before { content: "\e94c"; }
.ico--spinner:before { content: "\e94d"; }
.ico--loading:before { content: "\e94d"; }
.ico--loading-wheel:before { content: "\e94d"; }
.ico--refresh1:before { content: "\e94d"; }
.ico--repeat1:before { content: "\e94d"; }
.ico--busy:before { content: "\e94d"; }
.ico--wait:before { content: "\e94d"; }
.ico--arrow:before { content: "\e94d"; }
.ico--bullhorn:before { content: "\e944"; }
.ico--bin:before { content: "\e945"; }
.ico--trashcan:before { content: "\e945"; }
.ico--remove:before { content: "\e945"; }
.ico--delete:before { content: "\e945"; }
.ico--recycle:before { content: "\e945"; }
.ico--dispose:before { content: "\e945"; }
.ico--cross:before { content: "\e937"; }
.ico--checkbox-checked:before { content: "\e938"; }
.ico--quill:before { content: "\e939"; }
.ico--feather:before { content: "\e939"; }
.ico--write:before { content: "\e939"; }
.ico--edit:before { content: "\e939"; }
.ico--sphere:before { content: "\e93a"; }
.ico--globe:before { content: "\e93a"; }
.ico--internet:before { content: "\e93a"; }
.ico--wikipedia:before { content: "\e93b"; }
.ico--brand:before { content: "\e93b"; }
.ico--youtube:before { content: "\e936"; }
.ico--users:before { content: "\e934"; }
.ico--group:before { content: "\e934"; }
.ico--team:before { content: "\e934"; }
.ico--members:before { content: "\e934"; }
.ico--community:before { content: "\e934"; }
.ico--collaborate:before { content: "\e934"; }
.ico--book:before { content: "\e935"; }
.ico--read:before { content: "\e935"; }
.ico--reading:before { content: "\e935"; }
.ico--bubbles:before { content: "\e930"; }
.ico--map:before { content: "\e914"; }
.ico--compass:before { content: "\e915"; }
.ico--folder-open:before { content: "\e916"; }
.ico--folder:before { content: "\e917"; }
.ico--drawer:before { content: "\e918"; }
.ico--stop:before { content: "\e919"; }
.ico--github:before { content: "\e91a"; }
.ico--clock:before { content: "\e91b"; }
.ico--calendar:before { content: "\e91c"; }
.ico--flickr:before { content: "\e91d"; }
.ico--instagram:before { content: "\e91e"; }
.ico--twitter:before { content: "\e91f"; }
.ico--newspaper:before { content: "\e920"; }
.ico--cart:before { content: "\e921"; }
.ico--home:before { content: "\e922"; }
.ico--link:before { content: "\e912"; }
.ico--power:before { content: "\e90c"; }
.ico--house:before { content: "\e93f"; }
.ico--rocket:before { content: "\e946"; }
.ico--jet:before { content: "\e946"; }
.ico--speed:before { content: "\e946"; }
.ico--spaceship:before { content: "\e946"; }
.ico--fast:before { content: "\e946"; }
.ico--location:before { content: "\e906"; }
.ico--phone:before { content: "\e907"; }
.ico--linkedin:before { content: "\e903"; }
.ico--github1:before { content: "\e904"; }
.ico--gplus:before { content: "\e900"; }
.ico--twitter1:before { content: "\e901"; }
.ico--facebook:before { content: "\e902"; }
.ico--menu:before { content: "\e933"; }
.ico--chevron-right:before { content: "\e923"; }
.ico--chevron-left:before { content: "\e924"; }
.ico--chevron-down:before { content: "\e925"; }
.ico--chevron-up:before { content: "\e926"; }
.ico--eye-off:before { content: "\e947"; }
.ico--eye:before { content: "\e948"; }
.ico--zoom_out_map:before { content: "\e927"; }
.ico--arrow-down:before { content: "\e911"; }
.ico--link1:before { content: "\e910"; }
.ico--city:before { content: "\e908"; }
.ico--beer:before { content: "\e909"; }
.ico--thumbs-down:before { content: "\e93d"; }
.ico--thumbs-up:before { content: "\e93e"; }
.ico--tasks:before { content: "\e93c"; }
.ico--calculator:before { content: "\e931"; }
.ico--bank:before { content: "\e92a"; }
.ico--facebook-official:before { content: "\e92b"; }
.ico--close:before { content: "\e92c"; }
.ico--anchor:before { content: "\e92d"; }
.ico--feed:before { content: "\e92e"; }
.ico--paw:before { content: "\e90b"; }
.ico--envelope:before { content: "\e92f"; }
\ No newline at end of file
.ico--mastodon:before {
content: "\e973";
}
.ico--helios:before {
content: "\e96e";
}
.ico--redmine:before {
content: "\e96f";
}
.ico--zulip:before {
content: "\e970";
}
.ico--forum:before {
content: "\e971";
}
.ico--pirati:before {
content: "\e90d";
}
.ico--jitsi:before {
content: "\e90f";
}
.ico--open-source:before {
content: "\e90e";
}
.ico--donation-full:before {
content: "\e96c";
}
.ico--donation-outline:before {
content: "\e96d";
}
.ico--strategy:before {
content: "\e932";
}
.ico--pig:before {
content: "\e928";
}
.ico--thermometer:before {
content: "\e90a";
}
.ico--menu:before {
content: "\e933";
}
.ico--chevron-right:before {
content: "\e923";
}
.ico--chevron-left:before {
content: "\e924";
}
.ico--chevron-down:before {
content: "\e925";
}
.ico--chevron-up:before {
content: "\e926";
}
.ico--link-horizontal:before {
content: "\e910";
}
.ico--beer:before {
content: "\e909";
}
.ico--food:before {
content: "\e968";
}
.ico--dots-three-vertical:before {
content: "\e940";
}
.ico--dots-three-horizontal:before {
content: "\e941";
}
.ico--log-out:before {
content: "\e942";
}
.ico--envelope:before {
content: "\e908";
}
.ico--pin:before {
content: "\e943";
}
.ico--at:before {
content: "\e905";
}
.ico--glass:before {
content: "\e967";
}
.ico--checkmark:before {
content: "\e965";
}
.ico--info:before {
content: "\e901";
}
.ico--question:before {
content: "\e904";
}
.ico--warning:before {
content: "\e93f";
}
.ico--code:before {
content: "\e94a";
}
.ico--checkbox-unchecked:before {
content: "\e94e";
}
.ico--star-full:before {
content: "\e94f";
}
.ico--star-empty:before {
content: "\e950";
}
.ico--bookmark:before {
content: "\e951";
}
.ico--cog:before {
content: "\e952";
}
.ico--key:before {
content: "\e953";
}
.ico--zoom-in:before {
content: "\e954";
}
.ico--zoom-out:before {
content: "\e955";
}
.ico--shrink:before {
content: "\e956";
}
.ico--printer:before {
content: "\e957";
}
.ico--file-openoffice:before {
content: "\e958";
}
.ico--user:before {
content: "\e959";
}
.ico--file-excel:before {
content: "\e95a";
}
.ico--file-word:before {
content: "\e95b";
}
.ico--file-pdf:before {
content: "\e95c";
}
.ico--file-picture:before {
content: "\e95d";
}
.ico--file-blank:before {
content: "\e95e";
}
.ico--folder-upload:before {
content: "\e95f";
}
.ico--upload:before {
content: "\e960";
}
.ico--cloud-upload:before {
content: "\e961";
}
.ico--folder-download:before {
content: "\e962";
}
.ico--download:before {
content: "\e963";
}
.ico--cloud-download:before {
content: "\e964";
}
.ico--alarm:before {
content: "\e900";
}
.ico--calculator:before {
content: "\e911";
}
.ico--facebook-full:before {
content: "\e913";
}
.ico--feed:before {
content: "\e927";
}
.ico--library:before {
content: "\e929";
}
.ico--office:before {
content: "\e92a";
}
.ico--attachment:before {
content: "\e92b";
}
.ico--enlarge:before {
content: "\e92c";
}
.ico--eye-off:before {
content: "\e92e";
}
.ico--eye:before {
content: "\e92f";
}
.ico--share:before {
content: "\e931";
}
.ico--search:before {
content: "\e939";
}
.ico--pencil:before {
content: "\e93c";
}
.ico--lock-open:before {
content: "\e947";
}
.ico--lock:before {
content: "\e948";
}
.ico--equalizer:before {
content: "\e949";
}
.ico--switch:before {
content: "\e94b";
}
.ico--loop:before {
content: "\e94c";
}
.ico--refresh:before {
content: "\e94d";
}
.ico--bullhorn:before {
content: "\e944";
}
.ico--bin:before {
content: "\e945";
}
.ico--cross:before {
content: "\e937";
}
.ico--checkbox-checked:before {
content: "\e938";
}
.ico--globe:before {
content: "\e93a";
}
.ico--wikipedia:before {
content: "\e93b";
}
.ico--youtube:before {
content: "\e936";
}
.ico--users:before {
content: "\e934";
}
.ico--book:before {
content: "\e935";
}
.ico--bubbles:before {
content: "\e930";
}
.ico--map:before {
content: "\e914";
}
.ico--compass:before {
content: "\e915";
}
.ico--folder-open:before {
content: "\e916";
}
.ico--folder:before {
content: "\e917";
}
.ico--drawer:before {
content: "\e918";
}
.ico--stop:before {
content: "\e919";
}
.ico--github:before {
content: "\e91a";
}
.ico--clock:before {
content: "\e91b";
}
.ico--calendar:before {
content: "\e91c";
}
.ico--flickr:before {
content: "\e91d";
}
.ico--instagram:before {
content: "\e91e";
}
.ico--twitter:before {
content: "\e91f";
}
.ico--newspaper:before {
content: "\e920";
}
.ico--cart:before {
content: "\e921";
}
.ico--home:before {
content: "\e922";
}
.ico--link:before {
content: "\e912";
}
.ico--power:before {
content: "\e90c";
}
.ico--rocket:before {
content: "\e946";
}
.ico--location:before {
content: "\e906";
}
.ico--phone:before {
content: "\e907";
}
.ico--linkedin:before {
content: "\e903";
}
.ico--facebook:before {
content: "\e902";
}
.ico--envelop:before {
content: "\e972";
}
.ico--file-text2:before {
content: "\e974";
}
.ico--price-tag:before {
content: "\e975";
}
.ico--price-tags:before {
content: "\e976";
}
.ico--stats-dots:before {
content: "\e99b";
}
.ico--bed:before {
content: "\e969";
}
.ico--train:before {
content: "\e96a";
}
.ico--bus:before {
content: "\e96b";
}
.ico--wheelchair:before {
content: "\e966";
}
.ico--thumbs-down:before {
content: "\e93d";
}
.ico--thumbs-up:before {
content: "\e93e";
}
.ico--anchor:before {
content: "\e92d";
}
.ico--paw:before {
content: "\e90b";
}
source/css/atoms/list.pcss
View file @ aac6d1d3
......@@ -46,7 +46,7 @@
.unordered-list--dense,
.content-block ul {
@apply row-gap-0;
@apply gap-y-0;
}
.unordered-list--linked,
......
source/css/atoms/super-button.pcss
View file @ aac6d1d3
.super-button {
@apply inline-flex font-alt text-4xl py-8 px-4 transition duration-200;
@apply inline-flex font-alt text-4xl py-8 px-4 transition duration-200 md:px-6;
&:hover {
@apply no-underline;
}
@screen md {
@apply px-6;
}
}
.super-button__body {
......
source/css/atoms/table.pcss
View file @ aac6d1d3
......@@ -12,6 +12,13 @@
}
}
.table--light {
th,
thead td {
@apply bg-transparent text-black;
}
}
.table--striped,
.content-block table {
tr:nth-child(even) td {
......@@ -35,6 +42,15 @@
th,
thead td,
td {
@apply p-2;
@apply px-2 py-1;
}
}
.table--unxpadded {
th,
thead td,
td {
@apply px-0;
}
}
source/css/atoms/text-shadow.pcss 0 → 100644
View file @ aac6d1d3
.text-shadow-xs {
text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
}
.text-shadow-sm {
text-shadow: 1px 1px .25rem rgba(0, 0, 0, 0.3)
}
.text-shadow {
text-shadow: 1px 1px .25rem rgba(0, 0, 0, 0.3);
}
.text-shadow-md {
text-shadow: 1px 1px .5rem rgba(0, 0, 0, 0.5);
}
.text-shadow-lg {
text-shadow: 1px 1px .5rem rgba(0, 0, 0, 0.8);
}
source/css/atoms/tooltip.pcss 0 → 100644
View file @ aac6d1d3
.tooltip {
--bg-opacity: 0.8 !important;
z-index: 999;
@apply inline-block relative pointer-events-none;
&::before,
&::after {
content: "";
width: 0;
height: 0;
position: absolute;
opacity: 0.8;
}
&,
&.tooltip--default {
@apply text-xs py-2 px-4 rounded-none;
}
&--top,
&.tooltip--top
&.place-top {
margin-top: -10px;
&::before {
border-top: 8px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
bottom: -8px;
left: 50%;
margin-left: -10px;
}
&::after {
border-left: 8px solid transparent;
border-right: 8px solid transparent;
bottom: -6px;
left: 50%;
margin-left: -8px;
border-top-style: solid;
border-top-width: 6px;
}
}
&--bottom,
&.tooltip--bottom,
&.place-bottom {
margin-top: 10px;
&::before {
border-bottom: 8px solid transparent;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
top: -8px;
left: 50%;
margin-left: -10px;
}
&::after {
border-left: 8px solid transparent;
border-right: 8px solid transparent;
top: -6px;
left: 50%;
margin-left: -8px;
border-bottom-style: solid;
border-bottom-width: 6px;
}
}
&--left,
&.tooltip--left,
&.place-left {
margin-left: -10px;
margin-top: 0;
&::before {
border-left: 8px solid transparent;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
right: -8px;
top: 50%;
margin-top: -5px;
}
&::after {
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
right: -6px;
top: 50%;
margin-top: -4px;
border-left-style: solid;
border-left-width: 6px;
}
}
&--right,
&.tooltip--right,
&.place-right {
margin-left: 10px;
margin-top: 0;
&::before {
border-right: 8px solid transparent;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
left: -8px;
top: 50%;
margin-top: -5px;
}
&::after {
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
left: -6px;
top: 50%;
margin-top: -4px;
border-right-style: solid;
border-right-width: 6px;
}
}
&,
&--default,
&--dark,
&.type-dark,
&--black {
@apply bg-black text-white;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.black");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.black");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.black");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.black");
}
}
&--error,
&.type-error,
&--red-600 {
@apply bg-red-600 text-white;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.red.600");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.red.600");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.red.600");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.red.600");
}
}
&--warning,
&.type-warning,
&--yellow-400 {
@apply bg-yellow-400 text-black;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.yellow.400");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.yellow.400");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.yellow.400");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.yellow.400");
}
}
&--info,
&.type-info,
&--blue-300 {
@apply bg-blue-300 text-white;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.blue.300");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.blue.300");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.blue.300");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.blue.300");
}
}
&--grey-125,
&--light,
&.type-light {
@apply bg-grey-125 text-grey-300;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.grey.125");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.grey.125");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.grey.125");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.grey.125");
}
}
&--green-400,
&--success,
&.type-success {
@apply bg-green-400 text-white;
&.place-top::after,
&.tooltip--top::after {
border-top-color: theme("colors.green.400");
}
&.place-bottom::after,
&.tooltip--bottom::after {
border-bottom-color: theme("colors.green.400");
}
&.place-left::after,
&.tooltip--left::after {
border-left-color: theme("colors.green.400");
}
&.place-right::after,
&.tooltip--right::after {
border-right-color: theme("colors.green.400");
}
}
}
source/css/molecules/article-card.pcss
View file @ aac6d1d3
......@@ -21,15 +21,15 @@
/* padding shall be kept in sync with general card */
/* No pointer events to make full article cover clickable */
@apply absolute left-0 bottom-0 p-4 pointer-events-none;
}
.article-card-sharing {
/* Turn on pointer events to make sharer clickable */
@apply mb-4 transition duration-200 opacity-0 pointer-events-auto;
@apply mb-4 lg:transition lg:duration-200 lg:opacity-0 lg:pointer-events-auto;
}
.article-card:hover .article-card-sharing {
@apply opacity-100;
@apply lg:opacity-100;
}
.article-card-meta {
......
source/css/molecules/banner.pcss
View file @ aac6d1d3
.banner {
@apply px-4 py-8 flex flex-wrap flex-col;
@screen lg {
@apply px-8;
}
@apply px-4 py-8 flex flex-wrap flex-col lg:px-8;
}
.banner__icon {
......
source/css/molecules/calendar.pcss
View file @ aac6d1d3
......@@ -14,11 +14,7 @@
@apply h-full border-r border-grey-125 p-2 flex justify-center items-start;
&:first-child {
@apply border-l;
@screen xl {
@apply border-l-0;
}
@apply border-l xl:border-l-0;
}
&.calendar-table-row__col--norborder {
......
source/css/molecules/candidate-card.pcss
View file @ aac6d1d3
......@@ -33,7 +33,7 @@
@apply text-sm bg-grey-50 flex border-t border-b border-grey-125 leading-10;
> div {
@apply px-4 flex items-center;
@apply px-4 flex items-center md:justify-center;
&:not(:first-child) {
@apply border-l border-grey-125;
......@@ -48,8 +48,6 @@
}
@screen md {
@apply justify-center;
&:first-child {
@apply w-auto text-left;
}
......@@ -66,12 +64,9 @@
}
.candidate-card__social {
@apply p-4;
grid-area: social;
@apply p-4 md:text-center;
@screen md {
@apply text-center;
}
grid-area: social;
}
@screen sm {
......
source/css/molecules/candidate-table-row.pcss
View file @ aac6d1d3
......@@ -44,7 +44,7 @@
}
.candidate-table-row__affiliation {
@apply flex items-center justify-start whitespace-no-wrap py-1 pl-6 pr-4;
@apply flex items-center justify-start whitespace-nowrap py-1 pl-6 pr-4;
grid-area: affiliation;
}
......
source/css/molecules/chips.pcss
View file @ aac6d1d3
......@@ -4,8 +4,7 @@
py-2 px-3
text-xs
font-bold leading-none tracking-normal
cursor-pointer
whitespace-no-wrap;
whitespace-nowrap;
}
.chip--condensed {
......
source/css/molecules/content-block.pcss
View file @ aac6d1d3
......@@ -65,8 +65,12 @@
@apply text-sm;
}
pre {
line-height: 1;
}
/* Contact lines are quite frequent so these are blacklisted for anchor style specifically. */
a:not(.contact-line):not(.content-block--nostyle) {
a:not(.contact-line):not(.content-block--nostyle) {
@apply underline;
}
......
source/css/molecules/form-field.pcss
View file @ aac6d1d3
......@@ -17,19 +17,28 @@
box-shadow: inset 0 2px 6px 0 rgba(0,0,0,.05);
}
&,
&--row-items {
/* Allow bypass defualt positioning */
&:not(.form-field__wrapper--freeform) {
.form-field__control + .form-field__control {
@apply ml-4;
}
}
&--col-items {
@apply flex-col;
}
.form-field__control + .form-field__control {
@apply ml-0 mt-4;
}
.form-field__wrapper--row-items {
@apply flex-row;
.form-field__control + .form-field__control {
@apply ml-4 mt-0;
}
}
.form-field__wrapper--col-items {
@apply flex-col;
.form-field__control + .form-field__control {
@apply ml-0 mt-4;
}
}
......
source/css/molecules/modal.pcss
View file @ aac6d1d3
......@@ -10,7 +10,7 @@
top-0 left-0 bottom-0 right-0
z-50
flex items-center flex-row
bg-white bg-opacity-75
bg-grey-125 bg-opacity-75
cursor-pointer overflow-auto;
}
......@@ -26,19 +26,32 @@
.modal__container {
@apply
h-full
h-auto
p-3
pointer-events-auto shadow-md;
@screen md {
@apply h-auto p-0;
}
pointer-events-auto
md:p-0;
.modal__container-body {
@apply min-h-full bg-white;
@apply bg-white relative;
}
}
.modal__close {
@apply
absolute
right-0
top-0
h-8
w-8
flex
items-center
justify-center
z-50
m-auto
text-black
bg-white;
}
.ReactModal__Body--open {
@apply overflow-hidden;
}

Pirátský GitLab - Home of the CopyLeft