Sha256: ff375025c5fb8af4352893da6d56816412b3c312f35bee437345508d6119071a
Contents?: true
Size: 1.62 KB
Versions: 3
Compression:
Stored size: 1.62 KB
Contents
@import 'mixins/objects.grid'; @import 'mixins/components.buttons'; .c-calendar { @include grid; @include grid--wrap; @include grid--center; @include grid__cell--no-gutter; z-index: var(--z-over-control); max-width: 400px; padding: var(--spacing-medium); text-align: center; background-color: var(--color-background); border: 1px solid transparent; border-radius: var(--border-radius); } .c-calendar__control, .c-calendar__date { --button-color: var(--color-quiet); --button-background-color: transparent; @include button-color; display: inline; flex: 0 0 12%; max-width: 12%; margin: 1.1%; padding: 2.5% 0; font-size: var(--text-font-size-medium); border-radius: var(--border-radius); outline: 0; user-select: none; &:hover { border-color: var(--border-color); } } .c-calendar__control { --button-color: var(--color-default); } .c-calendar__header { @include grid__cell; @include grid__cell--no-gutter; @include grid__cell--width(71.5%); padding: var(--spacing-small) 0; } .c-calendar__day { @include grid__cell; @include grid__cell--no-gutter; flex: 0 0 12%; max-width: 12%; margin: 1.1%; padding: var(--spacing-small) 0; font-weight: var(--text-font-weight-heavy); } .c-calendar__date--in-month { --button-color: #000; } .c-calendar__date[aria-current='date'] { border-color: var(--border-color); } .c-calendar__date--selected[aria-selected='true'], .c-calendar__date--selected[aria-selected='true']:hover { --button-color: #fff; @include button-color; border-color: transparent; } .c-calendar__footer { width: 100%; padding-top: var(--spacing-large); }
Version data entries
3 entries across 3 versions & 1 rubygems