simplify some sizing

making way to have only 1 size var
This commit is contained in:
Geoff Doty 2024-01-17 18:48:33 -05:00
parent d4223e06fe
commit c0c28ef8eb
1 changed files with 8 additions and 5 deletions

View File

@ -1,7 +1,7 @@
/*! Stylelite v:0.5.0 | MIT LICENSE | https://github.com/n2geoff/stylelite */ /*! Stylelite v:0.5.0 | MIT LICENSE | https://github.com/n2geoff/stylelite */
:root { :root {
--space: 1rem; --space: 1rem;
--size: 1.1rem; --size: 1rem;
--radius: 0rem; --radius: 0rem;
--fg: #17202A; --fg: #17202A;
--bg: #FDFEFE; --bg: #FDFEFE;
@ -37,7 +37,7 @@ html,body {
font-family: -apple-system, system-ui, Roboto, sans-serif; font-family: -apple-system, system-ui, Roboto, sans-serif;
font-size: 16px; font-size: 16px;
letter-spacing: 0.0125em; letter-spacing: 0.0125em;
line-height: calc(var(--size) * 1.5); line-height: 1.5rem;
box-sizing: border-box; box-sizing: border-box;
padding: 0; padding: 0;
} }
@ -75,8 +75,8 @@ th {
} }
th,td { th,td {
padding: calc(var(--space) / 2.4);
border-bottom: 1px solid var(--mg); border-bottom: 1px solid var(--mg);
padding: .5rem;
} }
fieldset {border: none;padding: 0;} fieldset {border: none;padding: 0;}
@ -189,13 +189,16 @@ button, input {
font-size: 1rem; font-size: 1rem;
background: var(--bg); background: var(--bg);
color: var(--fg); color: var(--fg);
min-width: fit-content;
width: 100%; width: 100%;
height: calc(var(--size) * 2);
border: 1px solid var(--mg); border: 1px solid var(--mg);
height: 2.5rem;
border-radius: var(--radius); border-radius: var(--radius);
padding: .5rem 1rem; padding: .5rem 1rem;
} }
input[type=color] {padding: .25rem}
button, input[type="reset"],input[type="submit"] { button, input[type="reset"],input[type="submit"] {
display: inline-block; display: inline-block;
border-radius: var(--radius); border-radius: var(--radius);
@ -277,7 +280,7 @@ select,textarea {
display: inline-block; display: inline-block;
outline: none; outline: none;
font-size: var(--size); font-size: var(--size);
height: calc(var(--size) * 2); height: 2.5rem;
width: 100%; width: 100%;
border: 1px solid var(--mg); border: 1px solid var(--mg);
color: var(--fg); color: var(--fg);