Implement some custom formatting for input fields in the documentation (#11632)

* Implement some custom formatting for input fields in the documentation

Aside of resulting in more consistent appearance across browsers,
this also fixes input form rendering when using Firefox with a
dark system theme on Linux.

* change the expected html in the tests

(cherry picked from commit 0a1cb631a2)
This commit is contained in:
Hugo Locurcio
2019-07-03 07:40:25 +02:00
committed by narimiran
parent bd35d44808
commit 1e48169bbc
6 changed files with 102 additions and 0 deletions

View File

@@ -297,6 +297,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */

View File

@@ -99,6 +99,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */

View File

@@ -99,6 +99,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */

View File

@@ -99,6 +99,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */

View File

@@ -99,6 +99,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */

View File

@@ -99,6 +99,23 @@ input#searchInput {
width: 80%;
}
/*
* Some custom formatting for input forms.
* This also fixes input form colors on Firefox with a dark system theme on Linux.
*/
input {
-moz-appearance: none;
color: #333;
background-color: #f8f8f8;
border: 1px solid #aaa;
font-family: "Lato", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;
font-size: 0.9em;
padding: 6px;
}
input:focus {
border: 1px solid #1fa0eb;
box-shadow: 0 0 2px #1fa0eb;
}
/* Docgen styles */
/* Links */