continue implementation

This commit is contained in:
Dennis Eichhorn 2023-06-09 17:39:31 +00:00
parent 6ad0ba9adb
commit 8828f4cc13
6 changed files with 216 additions and 281 deletions

View File

@ -11,7 +11,7 @@ button, input[type="submit"], input[type="button"], label.button, a.button {
color: var(--text-on-background-color-2); color: var(--text-on-background-color-2);
padding: 0 1rem 0 1rem; padding: 0 1rem 0 1rem;
flex-grow: 0; flex-grow: 0;
height: 32px; height: 30px;
//border: none; //border: none;
border: 1px solid var(--box-border); border: 1px solid var(--box-border);
box-shadow: none; box-shadow: none;

View File

@ -15,9 +15,15 @@
display: flex; display: flex;
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
flex-grow: 1;
.row { .row {
flex: 1 1 auto; flex: 1 1 auto;
flex-direction: column;
}
.col-xs-12 {
flex-basis: 0;
} }
} }
@ -81,7 +87,6 @@
.col-xs-11, .col-xs-11,
.col-xs-12 { .col-xs-12 {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto;
padding-right: 1rem; padding-right: 1rem;
} }
@ -242,6 +247,7 @@
order: 1; order: 1;
} }
// is >= sm
@media only screen and (min-width: 48em) { @media only screen and (min-width: 48em) {
.sm-hidden { .sm-hidden {
display: block; display: block;
@ -427,7 +433,18 @@
} }
} }
// is >= md
@media only screen and (min-width: 62em) { @media only screen and (min-width: 62em) {
.col-simple {
.row {
flex-direction: row;
}
.col-xs-12 {
flex-basis: 100%;
}
}
.md-hidden { .md-hidden {
display: block; display: block;
} }
@ -612,6 +629,7 @@
} }
} }
// is >= lg
@media only screen and (min-width: 75em) { @media only screen and (min-width: 75em) {
.lg-hidden { .lg-hidden {
display: block; display: block;

View File

@ -87,7 +87,7 @@ input[type="email"],
input[type="date"], input[type="date"],
input[type="number"], input[type="number"],
input[type="datetime-local"] { input[type="datetime-local"] {
height: 2rem; height: 30px;
padding-left: .5rem; padding-left: .5rem;
} }
@ -318,7 +318,7 @@ textarea, .textarea {
overflow: auto; overflow: auto;
resize: both; resize: both;
box-sizing: border-box; box-sizing: border-box;
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace; padding: .3rem .3rem .3rem .5rem;
} }
label.radio, label.checkbox { label.radio, label.checkbox {
@ -421,7 +421,7 @@ input[type="range"] {
box-sizing: border-box; box-sizing: border-box;
display: inline-block; display: inline-block;
background: var(--button-colored-background); background: var(--button-colored-background);
height: 2rem; height: 30px;
font-size: 1rem; font-size: 1rem;
min-width: 40px; min-width: 40px;
border-left: solid 1px var(--input-border); border-left: solid 1px var(--input-border);
@ -451,7 +451,6 @@ input[type="range"] {
input { input {
box-sizing: border-box; box-sizing: border-box;
font-size: 1rem;
position: relative; position: relative;
vertical-align: middle; vertical-align: middle;

View File

@ -44,7 +44,7 @@ div.sticky, section.sticky {
flex-wrap: wrap; flex-wrap: wrap;
> *:not(label) { > *:not(label) {
flex: 1; flex: 0 1 auto;
} }
& + * { & + * {
@ -52,6 +52,7 @@ div.sticky, section.sticky {
} }
label { label {
font-size: .9rem;
flex: 0 0 100%; flex: 0 0 100%;
} }

File diff suppressed because it is too large Load Diff

View File

@ -37,6 +37,9 @@
} }
.tab-content { .tab-content {
display: flex;
flex: 1;
> input { > input {
display: none; display: none;
} }
@ -46,7 +49,9 @@
} }
> input:checked + div { > input:checked + div {
display: inherit; display: flex;
flex: 1;
flex-direction: column;
} }
} }
} }
@ -67,12 +72,6 @@
background: var(--button-colored-background); background: var(--button-colored-background);
} }
/*
.active label {
border: 1px solid var(--box-border);
}
*/
li { li {
margin: 0 5px 0 0; margin: 0 5px 0 0;
} }
@ -110,6 +109,10 @@
} }
.tab-2 { .tab-2 {
display: flex;
flex: 1;
flex-direction: column;
.tab-links { .tab-links {
label { label {
padding: 5px 10px 5px 10px; padding: 5px 10px 5px 10px;