Introduce -h1 -h2 -h3 css vars for font-size
Change -large to -h3. Change-Id: I10c293c6e65896f2fdebaa5d24396ace3e6281db
This commit is contained in:
committed by
David Pursehouse
parent
4e8eeaf514
commit
9f4e987543
@@ -107,7 +107,7 @@ limitations under the License.
|
||||
}
|
||||
.label.u-green:not(.u-monospace),
|
||||
.label.u-red:not(.u-monospace) {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.u-gray-background {
|
||||
background-color: var(--table-header-background-color);
|
||||
|
||||
@@ -55,7 +55,7 @@ limitations under the License.
|
||||
vertical-align: top;
|
||||
}
|
||||
#help h1 {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
#help p {
|
||||
margin-bottom: var(--spacing-m);
|
||||
|
||||
@@ -90,7 +90,7 @@ limitations under the License.
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.headerTitle .headerSubject {
|
||||
font-weight: var(--font-weight-bold);
|
||||
@@ -300,7 +300,7 @@ limitations under the License.
|
||||
}
|
||||
.headerTitle {
|
||||
flex-wrap: wrap;
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.desktop {
|
||||
display: none;
|
||||
|
||||
@@ -42,7 +42,7 @@ limitations under the License.
|
||||
}
|
||||
#title {
|
||||
display: inline-block;
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
margin-top: var(--spacing-xs);
|
||||
}
|
||||
h2 {
|
||||
|
||||
@@ -161,7 +161,7 @@ limitations under the License.
|
||||
}
|
||||
@media screen and (max-width: 50em) {
|
||||
.bigTitle {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
gr-smart-search,
|
||||
|
||||
@@ -106,7 +106,7 @@ limitations under the License.
|
||||
}
|
||||
.loading {
|
||||
color: var(--deemphasized-text-color);
|
||||
font-size: 2rem;
|
||||
font-size: var(--font-size-h1);
|
||||
height: 100%;
|
||||
padding: var(--spacing-l);
|
||||
text-align: center;
|
||||
@@ -185,7 +185,7 @@ limitations under the License.
|
||||
}
|
||||
.mobileNavLink {
|
||||
color: var(--primary-text-color);
|
||||
font-size: 1.5rem;
|
||||
font-size: var(--font-size-h2);
|
||||
font-weight: var(--font-weight-bold);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@@ -51,7 +51,7 @@ limitations under the License.
|
||||
padding: var(--spacing-m) var(--spacing-l);
|
||||
}
|
||||
header gr-editable-label {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
--label-style: {
|
||||
text-overflow: initial;
|
||||
white-space: initial;
|
||||
@@ -72,7 +72,7 @@ limitations under the License.
|
||||
.controlGroup {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.rightControls {
|
||||
justify-content: flex-end;
|
||||
|
||||
@@ -111,7 +111,7 @@ limitations under the License.
|
||||
margin-top: var(--spacing-m);
|
||||
}
|
||||
.errorText {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.errorMoreInfo {
|
||||
color: var(--deemphasized-text-color);
|
||||
|
||||
@@ -165,7 +165,7 @@ limitations under the License.
|
||||
}
|
||||
@media only screen and (max-width: 50em) {
|
||||
:host {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
gr-change-list-item {
|
||||
flex-wrap: wrap;
|
||||
|
||||
@@ -35,7 +35,7 @@ limitations under the License.
|
||||
}
|
||||
.header .label {
|
||||
font-weight: var(--font-weight-bold);
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
margin: 0 var(--spacing-l) 0 0;
|
||||
}
|
||||
.header .note {
|
||||
|
||||
@@ -78,7 +78,7 @@ limitations under the License.
|
||||
}
|
||||
.genericList .groupHeader {
|
||||
background-color: var(--table-subheader-background-color);
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
}
|
||||
.genericList a {
|
||||
color: var(--primary-text-color);
|
||||
|
||||
@@ -75,15 +75,15 @@ limitations under the License.
|
||||
}
|
||||
/* Other Shared Styles*/
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
font-size: var(--font-size-h1);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
h2 {
|
||||
font-size: 1.5rem;
|
||||
font-size: var(--font-size-h2);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
h3 {
|
||||
font-size: var(--font-size-large);
|
||||
font-size: var(--font-size-h3);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
iron-icon {
|
||||
|
||||
@@ -74,9 +74,11 @@ html {
|
||||
|
||||
/* fonts */
|
||||
--font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
|
||||
--font-size-normal: 1rem; /* 13 px */
|
||||
--font-size-small: .92rem; /* 12 px */
|
||||
--font-size-large: 1.154rem; /* 15 px */
|
||||
--font-size-normal: 1rem; /* 13px */
|
||||
--font-size-small: .92rem; /* 12px */
|
||||
--font-size-h3: 1.154rem; /* 15px */
|
||||
--font-size-h2: 1.5rem; /* 19.5px */
|
||||
--font-size-h1: 2rem; /* 26px */
|
||||
/* Used on text for change list that needs user's attention. */
|
||||
--font-weight-bold: 500;
|
||||
--monospace-font-family: 'Roboto Mono', Menlo, 'Lucida Console', Monaco, monospace;
|
||||
|
||||
Reference in New Issue
Block a user