Some color variables fixes for faceted block work as expected.

This commit is contained in:
mateuswetah 2020-04-27 15:38:00 -03:00
parent 8958f9e743
commit f189f3a812
10 changed files with 18 additions and 71 deletions

View File

@ -7,41 +7,6 @@
justify-content: center;
align-items: center;
color: var(--tainacan-block-gray4, #555758); }
@-webkit-keyframes skeleton-animation {
0% {
opacity: 1.0; }
50% {
opacity: 0.2; }
100% {
opacity: 1.0; } }
@-moz-keyframes skeleton-animation {
0% {
opacity: 1.0; }
50% {
opacity: 0.2; }
100% {
opacity: 1.0; } }
@-o-keyframes skeleton-animation {
0% {
opacity: 1.0; }
50% {
opacity: 0.2; }
100% {
opacity: 1.0; } }
@keyframes skeleton-animation {
0% {
opacity: 1.0; }
50% {
opacity: 0.2; }
100% {
opacity: 1.0; } }
.wp-block-tainacan-faceted-search .skeleton {
border-radius: 2px;
background: var(--tainacan-block-gray1, #f2f2f2);
-webkit-animation: skeleton-animation 1.8s ease infinite;
-moz-animation: skeleton-animation 1.8s ease infinite;
-o-animation: skeleton-animation 1.8s ease infinite;
animation: skeleton-animation 1.8s ease infinite; }
.wp-block-tainacan-faceted-search .preview-warning {
width: 100%;
font-size: 0.875em;

File diff suppressed because one or more lines are too long

View File

@ -173,6 +173,7 @@
flex-grow: 2;
.dropdown-trigger button {
padding: 2px 0.5em 2px 0.5em !important;
height: auto !important;
font-size: 1em !important;
min-height: 100%;

View File

@ -53,7 +53,7 @@ button.link-style:active {
&.is-outlined {
color: var(--tainacan-secondary);
background-color: transparent !important;
border-color: var(--tainacan-input-color) !important;
border-color: var(--tainacan-input-border-color) !important;
}
&.is-outlined:hover {
color: var(--tainacan-secondary) !important;

View File

@ -19,6 +19,7 @@
h3 {
font-size: 1em;
color: var(--tainacan-heading-color);
}
}

View File

@ -55,6 +55,7 @@
button.is-primary:focus,
button.is-primary:active {
color: var(--tainacan-blue5) !important;
background-color: var(--tainacan-blue2) !important;
}
}
.tabs {

View File

@ -1,6 +1,7 @@
.tags {
font-family: var(--tainacan-font-family, inherit);
border: solid 1px var(--tainacan-input-border-color) !important;
background-color: var(--tainacan-input-background-color);
border-radius: 20px;
flex-wrap: nowrap;
margin-bottom: 0.375em !important;
@ -12,7 +13,7 @@
animation-duration: 0.3s;
.tag {
background-color: var(--tainacan-white);
background-color: var(--tainacan-input-background-color);
margin-bottom: 0 !important;
margin-right: 4px !important;
max-width: calc(100% - 21px);
@ -31,7 +32,7 @@
border-radius: 50px !important;
margin-right: 0px !important;
color: var(--tainacan-info-color);
background-color: var(--tainacan-white);
background-color: var(--tainacan-input-background-color);
transition: border-width 0.15s linear, background-color 0.15s linear;
&:after,

View File

@ -75,7 +75,7 @@
button.is-primary:focus,
button.is-primary:active {
border: 1px solid var(--tainacan-input-border-color);
background-color: var(--tainacan-gray1) !important;
background-color: var(--tainacan-primary) !important;
color: var(--tainacan-secondary) !important;
padding: 0.25em 0.6em !important;
border-radius: 0 !important;

View File

@ -12,37 +12,7 @@
align-items: center;
color: var(--tainacan-block-gray4, $gray4);
}
// Skeleton loading
@-webkit-keyframes skeleton-animation {
0%{opacity: 1.0}
50%{opacity: 0.2}
100%{opacity: 1.0}
}
@-moz-keyframes skeleton-animation {
0%{opacity: 1.0}
50%{opacity: 0.2}
100%{opacity: 1.0}
}
@-o-keyframes skeleton-animation {
0%{opacity: 1.0}
50%{opacity: 0.2}
100%{opacity: 1.0}
}
@keyframes skeleton-animation {
0%{opacity: 1.0}
50%{opacity: 0.2}
100%{opacity: 1.0}
}
.skeleton {
border-radius: 2px;
background: var(--tainacan-block-gray1, $gray1);
-webkit-animation: skeleton-animation 1.8s ease infinite;
-moz-animation: skeleton-animation 1.8s ease infinite;
-o-animation: skeleton-animation 1.8s ease infinite;
animation: skeleton-animation 1.8s ease infinite;
}
.preview-warning {
width: 100%;
font-size: 0.875em;

View File

@ -151,6 +151,14 @@ export default {
}
}
.date-filter-container,
.numeric-filter-container {
@media screen and (min-width: 1366px) {
flex-wrap: nowrap !important;
height: auto !important;
}
}
.column-large-width {
.tainacan-compound-group {
display: inline-block;