зеркало из https://github.com/mozilla/bedrock.git
Refresh: Standardize border widths (#15435)
This commit is contained in:
Stephanie Hobson
GitHub
Родитель
3a16d18cb6
Коммит
23da6414a6
|
|
@ -5,7 +5,7 @@
|
|||
$max-footer-content-width: $content-max;
|
||||
|
||||
@mixin divider-line {
|
||||
border-bottom: 4px solid $m24-color-light-gray;
|
||||
border-bottom: $border-width solid $m24-color-light-gray;
|
||||
}
|
||||
|
||||
// hide details for JS users
|
||||
|
|
@ -143,7 +143,7 @@ $max-footer-content-width: $content-max;
|
|||
|
||||
input[type="email"],
|
||||
select {
|
||||
border: 2px solid $m24-color-black;
|
||||
border: $border-width solid $m24-color-black;
|
||||
border-radius: 0;
|
||||
background-color: $m24-color-light-gray;
|
||||
color: $m24-color-black;
|
||||
|
|
@ -248,7 +248,7 @@ $max-footer-content-width: $content-max;
|
|||
margin-bottom: 0;
|
||||
|
||||
button {
|
||||
border: 2px solid $m24-color-green;
|
||||
border: $border-width solid $m24-color-green;
|
||||
border-radius: 0;
|
||||
font-family: $secondary-font;
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
$max-footer-content-width: $content-max;
|
||||
|
||||
@mixin divider-line {
|
||||
border-bottom: 4px solid $m24-color-light-gray;
|
||||
border-bottom: $border-width solid $m24-color-light-gray;
|
||||
}
|
||||
|
||||
// whole footer
|
||||
|
|
@ -236,7 +236,7 @@ $max-footer-content-width: $content-max;
|
|||
background-color: transparent;
|
||||
color: $m24-color-black;
|
||||
padding: 6px 24px;
|
||||
border: 2px solid $m24-color-green;
|
||||
border: $border-width solid $m24-color-green;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
max-width: 800px;
|
||||
|
|
@ -334,7 +334,7 @@ $max-footer-content-width: $content-max;
|
|||
}
|
||||
|
||||
.mzp-js-language-switcher-select {
|
||||
border: 2px solid transparent;
|
||||
border: $border-width solid transparent;
|
||||
border-radius: 0;
|
||||
font-family: $secondary-font;
|
||||
font-weight: 600;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
|
||||
.m24-navigation-refresh {
|
||||
background-color: $color-white;
|
||||
border-bottom: 2px solid $m24-color-medium-gray;
|
||||
border-bottom: $border-width solid $m24-color-medium-gray;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
&.mzp-is-scrolling {
|
||||
// Shadow colors are equivalent to $color-ink-90, $color-blue-90, $color-ink-90
|
||||
// We can't use a $box-shadow token here because it needs a different size and offset
|
||||
box-shadow: 0 0 6px 1px rgba(29, 17, 51, 0.04), 0 0 8px 2px rgba(9, 32, 77, 0.12), 0 0 5px -3px rgba(29, 17, 51, 0.12);
|
||||
box-shadow: 0 0 6px 1px rgba(29, 17, 51, 0.04), 0 0 8px $border-width rgba(9, 32, 77, 0.12), 0 0 5px -3px rgba(29, 17, 51, 0.12);
|
||||
}
|
||||
|
||||
&.mzp-is-hidden {
|
||||
|
|
@ -184,7 +184,7 @@
|
|||
}
|
||||
|
||||
.m24-c-navigation-menu {
|
||||
border-top: 2px solid $m24-color-medium-gray;
|
||||
border-top: $border-width solid $m24-color-medium-gray;
|
||||
margin-bottom: 0;
|
||||
width: 100%;
|
||||
|
||||
|
|
@ -292,7 +292,7 @@
|
|||
}
|
||||
|
||||
.m24-c-menu-category {
|
||||
border-bottom: 2px solid $token-color-light-gray;
|
||||
border-bottom: $border-width solid $token-color-light-gray;
|
||||
border-top: none;
|
||||
padding: 8px 16px;
|
||||
position: relative;
|
||||
|
|
@ -355,7 +355,7 @@
|
|||
@include border-box;
|
||||
|
||||
@media #{$mq-md} {
|
||||
border-bottom: 4px solid $m24-color-medium-gray;
|
||||
border-bottom: $border-width solid $m24-color-medium-gray;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
padding: 0;
|
||||
|
|
@ -468,11 +468,11 @@
|
|||
}
|
||||
|
||||
& > li {
|
||||
border-bottom: 2px solid transparent;
|
||||
border-bottom: $border-width solid transparent;
|
||||
width: 100%;
|
||||
|
||||
@media #{$mq-md} {
|
||||
border-bottom: 2px solid $token-color-light-gray;
|
||||
border-bottom: $border-width solid $token-color-light-gray;
|
||||
}
|
||||
|
||||
.m24-c-menu-item {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
.m24-pencil-banner {
|
||||
background-color: $m24-color-light-green;
|
||||
border-bottom: 2px solid $m24-color-green;
|
||||
border-bottom: $border-width solid $m24-color-green;
|
||||
padding: $spacer-sm;
|
||||
|
||||
.m24-pencil-banner-copy {
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@
|
|||
color: inherit;
|
||||
|
||||
.m24-c-grid-tile-image > * {
|
||||
outline: 2px solid transparent;
|
||||
outline: $border-width solid transparent;
|
||||
transition: outline-color 150ms ease-in-out;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ $logo-spacing: calc(24px + #{$spacer-xs});
|
|||
}
|
||||
|
||||
.m24-c-spring-item {
|
||||
border-bottom: 4px solid $m24-color-light-gray;
|
||||
border-bottom: $border-width solid $m24-color-light-gray;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,3 +14,6 @@ $spacer-2xs: var(--spacer-2xs);
|
|||
|
||||
// container
|
||||
$container-padding: var(--container-padding);
|
||||
|
||||
// border
|
||||
$border-width: 2px;
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче