@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
120 lines (102 loc) • 1.88 kB
CSS
/* mixins & extensions */
@keyframes in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes in-down {
0% {
opacity: 0;
transform: translate3D(0, -5px, 0);
}
100% {
opacity: 1;
transform: translate3D(0, 0, 0);
}
}
@keyframes in-up {
0% {
opacity: 0;
transform: translate3D(0, 5px, 0);
}
100% {
opacity: 1;
transform: translate3D(0, 0, 0);
}
}
@keyframes in-scale {
0% {
opacity: 0;
transform: scale3D(0.95, 0.95, 1);
}
100% {
opacity: 1;
transform: scale3D(1, 1, 1);
}
}
/**
* Currently only used in Checkbox.
*/
:root {
--calcite-popper-transition: 150ms ease-in-out;
}
:host([hidden]) {
display: none;
}
.calender {
margin-bottom: 0.25rem;
}
.week-headers {
display: flex;
border-width: 0;
border-top-width: 1px;
border-style: solid;
border-color: var(--calcite-ui-border-3);
padding-top: 0;
padding-bottom: 0;
padding-left: 0.25rem;
padding-right: 0.25rem;
}
.week-header {
color: var(--calcite-ui-text-3);
text-align: center;
font-weight: var(--calcite-font-weight-bold);
width: calc(100% / 7);
}
:host([scale=s]) .week-header {
font-size: var(--calcite-font-size--2);
line-height: 1rem;
padding-top: 1rem;
padding-bottom: 1rem;
padding-left: 0;
padding-right: 0;
}
:host([scale=m]) .week-header {
font-size: var(--calcite-font-size--2);
line-height: 1rem;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
padding-left: 0;
padding-right: 0;
}
:host([scale=l]) .week-header {
font-size: var(--calcite-font-size--1);
line-height: 1rem;
padding-top: 2rem;
padding-bottom: 1.5rem;
padding-left: 0;
padding-right: 0;
}
.week-days {
outline: 2px solid transparent;
outline-offset: 2px;
display: flex;
flex-direction: row;
padding-top: 0;
padding-bottom: 0;
padding-left: 6px;
padding-right: 6px;
}