You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.1 KiB
CSS
53 lines
1.1 KiB
CSS
/* Form stuff */
|
|
/* If I do a CSS framework, it'll need to have a reset too... */
|
|
/* e.g. https://github.com/necolas/normalize.css/blob/master/normalize.css
|
|
https://byby.dev/normalize-css#:~:text=css%23css%2Dresets-,Normalize.,experience%20for%20each%20web%20browser.
|
|
https://www.joshwcomeau.com/css/custom-css-reset/
|
|
*/
|
|
form{
|
|
border:1px solid;
|
|
padding: 1rem;
|
|
}
|
|
input,select,textarea{
|
|
font:1.2rem/1.62 sans-serif;color:#556;
|
|
border:1px solid #CCC;
|
|
}
|
|
textarea{
|
|
resize: vertical;
|
|
}
|
|
|
|
input,select,textarea{
|
|
background: #EEE;
|
|
border: 2px solid #556;
|
|
box-sizing: border-box;
|
|
color: #556;
|
|
display: block;
|
|
line-height: 1;
|
|
vertical-align: top;
|
|
transition-duration:.2s;
|
|
}
|
|
input,textarea{
|
|
width:100%;
|
|
}
|
|
input[type="checkbox"]{
|
|
display:inline-block;
|
|
}
|
|
input:focus,select:focus,textarea:focus {
|
|
border-color: #9CF;
|
|
}
|
|
@media(min-width:720px){
|
|
input,select,textarea{
|
|
display:inline-block;
|
|
max-width:50%; /* so half it can be, with margins factored in... */
|
|
max-width:346.8px;
|
|
}
|
|
input,textarea{
|
|
width:auto;
|
|
}
|
|
}
|
|
@media(prefers-color-scheme:dark){
|
|
input,select,textarea{
|
|
background:#CCC;border-color:#CCC;
|
|
}
|
|
}
|