styled forms and imput fields
This commit is contained in:
parent
1140149ac9
commit
2a7d702e6f
|
@ -1385,30 +1385,64 @@ Add your custom styles in this file so it is easier to update the theme.
|
|||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="color"],
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper textarea {
|
||||
color: #111;
|
||||
background-color: #eee;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
border: 0.05rem solid #000;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
padding: 0.3rem;
|
||||
}
|
||||
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="text"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="text"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="text"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="email"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="email"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="email"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="url"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="url"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="url"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="password"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="password"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="password"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="search"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="search"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="search"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="number"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="number"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="number"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="tel"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="tel"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="tel"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="range"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="range"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="range"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="date"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="date"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="date"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="month"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="month"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="month"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="week"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="week"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="week"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="time"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="time"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="time"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime-local"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime-local"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="datetime-local"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="color"]:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper textarea:focus {
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="color"]:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper input[type="color"]:focus-visible,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper textarea:focus,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper textarea:focus-within,
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper textarea:focus-visible {
|
||||
color: #000;
|
||||
box-shadow: none;
|
||||
outline: unset;
|
||||
}
|
||||
|
||||
.edit-post-visual-editor__content-area .editor-styles-wrapper select {
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -33,7 +33,7 @@ $color__background-hr: $color__black;
|
|||
$color__background-button: $color__black;
|
||||
$color__background-pre: $color__grey-lighter;
|
||||
$color__background-ins: $color__white-dark;
|
||||
$color__background-input: $color__grey-lighter;
|
||||
$color__background-input: transparent;
|
||||
|
||||
$color__text-screen: $color__black;
|
||||
$color__text-input: $color__black-grey;
|
||||
|
|
|
@ -16,13 +16,14 @@ input[type="color"],
|
|||
textarea {
|
||||
color: $color__text-input;
|
||||
background-color: $color__background-input;
|
||||
border: none;
|
||||
border: $border__line;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
padding: 0.3rem;
|
||||
|
||||
&:focus {
|
||||
&:focus,&:focus-within,&:focus-visible {
|
||||
color: $color__text-input-focus;
|
||||
box-shadow: none;
|
||||
outline: unset;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
40
style.css
40
style.css
|
@ -1246,30 +1246,64 @@ input[type="datetime-local"],
|
|||
input[type="color"],
|
||||
textarea {
|
||||
color: #111;
|
||||
background-color: #eee;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
border: 0.05rem solid #000;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
padding: 0.3rem;
|
||||
}
|
||||
|
||||
input[type="text"]:focus,
|
||||
input[type="text"]:focus-within,
|
||||
input[type="text"]:focus-visible,
|
||||
input[type="email"]:focus,
|
||||
input[type="email"]:focus-within,
|
||||
input[type="email"]:focus-visible,
|
||||
input[type="url"]:focus,
|
||||
input[type="url"]:focus-within,
|
||||
input[type="url"]:focus-visible,
|
||||
input[type="password"]:focus,
|
||||
input[type="password"]:focus-within,
|
||||
input[type="password"]:focus-visible,
|
||||
input[type="search"]:focus,
|
||||
input[type="search"]:focus-within,
|
||||
input[type="search"]:focus-visible,
|
||||
input[type="number"]:focus,
|
||||
input[type="number"]:focus-within,
|
||||
input[type="number"]:focus-visible,
|
||||
input[type="tel"]:focus,
|
||||
input[type="tel"]:focus-within,
|
||||
input[type="tel"]:focus-visible,
|
||||
input[type="range"]:focus,
|
||||
input[type="range"]:focus-within,
|
||||
input[type="range"]:focus-visible,
|
||||
input[type="date"]:focus,
|
||||
input[type="date"]:focus-within,
|
||||
input[type="date"]:focus-visible,
|
||||
input[type="month"]:focus,
|
||||
input[type="month"]:focus-within,
|
||||
input[type="month"]:focus-visible,
|
||||
input[type="week"]:focus,
|
||||
input[type="week"]:focus-within,
|
||||
input[type="week"]:focus-visible,
|
||||
input[type="time"]:focus,
|
||||
input[type="time"]:focus-within,
|
||||
input[type="time"]:focus-visible,
|
||||
input[type="datetime"]:focus,
|
||||
input[type="datetime"]:focus-within,
|
||||
input[type="datetime"]:focus-visible,
|
||||
input[type="datetime-local"]:focus,
|
||||
input[type="datetime-local"]:focus-within,
|
||||
input[type="datetime-local"]:focus-visible,
|
||||
input[type="color"]:focus,
|
||||
textarea:focus {
|
||||
input[type="color"]:focus-within,
|
||||
input[type="color"]:focus-visible,
|
||||
textarea:focus,
|
||||
textarea:focus-within,
|
||||
textarea:focus-visible {
|
||||
color: #000;
|
||||
box-shadow: none;
|
||||
outline: unset;
|
||||
}
|
||||
|
||||
select {
|
||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue