More actions
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
| Line 8: | Line 8: | ||
font-size: 0.875rem; | font-size: 0.875rem; | ||
color: var(--color-base); | color: var(--color-base); | ||
} | |||
#simple-calc__input1, #simple-calc__input2, #simple-calc__input3 { | |||
padding: 6px 8px; | |||
line-height: var(--line-height-xs); | |||
color: var(--color-base--emphasized); | |||
background-color: transparent; | |||
border-color: var(--border-color-base--darker); | |||
border-radius: var(--border-radius--small); | |||
} | |||
#simple-calc__input1:hover, #simple-calc__input2:hover, #simple-calc__input3:hover { | |||
background-color: var(--color-surface-0); | |||
border-color: var(--color-primary--hover); | |||
} | |||
#simple-calc__input1:focus, #simple-calc__input2:focus, #simple-calc__input3:focus { | |||
background-color: var(--color-surface-0); | |||
border-color: var(--color-primary); | |||
box-shadow: inset 0 0 0 1px var(--color-primary); | |||
} | |||
#simple-calc__input1:not(:disabled), #simple-calc__input2:not(:disabled), #simple-calc__input3:not(:disabled) { | |||
transition: color 100ms,border-color 100ms,box-shadow 100ms; | |||
} | } | ||
Revision as of 02:38, 25 October 2023
/* Calculator stylings */
#simple-calc__seed {
display: none;
}
.simple-calc__label {
font-size: 0.875rem;
color: var(--color-base);
}
#simple-calc__input1, #simple-calc__input2, #simple-calc__input3 {
padding: 6px 8px;
line-height: var(--line-height-xs);
color: var(--color-base--emphasized);
background-color: transparent;
border-color: var(--border-color-base--darker);
border-radius: var(--border-radius--small);
}
#simple-calc__input1:hover, #simple-calc__input2:hover, #simple-calc__input3:hover {
background-color: var(--color-surface-0);
border-color: var(--color-primary--hover);
}
#simple-calc__input1:focus, #simple-calc__input2:focus, #simple-calc__input3:focus {
background-color: var(--color-surface-0);
border-color: var(--color-primary);
box-shadow: inset 0 0 0 1px var(--color-primary);
}
#simple-calc__input1:not(:disabled), #simple-calc__input2:not(:disabled), #simple-calc__input3:not(:disabled) {
transition: color 100ms,border-color 100ms,box-shadow 100ms;
}