зеркало из https://github.com/mozilla/bedrock.git
98 строки
3.0 KiB
SCSS
98 строки
3.0 KiB
SCSS
// This Source Code Form is subject to the terms of the Mozilla Public
|
|
// License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
// file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
|
|
|
|
|
|
|
|
|
// These are general styles for elements/components that occur on every page.
|
|
// Individual pages may include additional component styles as needed.
|
|
@use '~@mozilla-protocol/core/protocol/css/includes/lib' as * with ($brand-theme: 'mozilla', $type-scale: 'standard', $font-path: '/media/protocol/fonts', $image-path: '/media/protocol/img');
|
|
@use '~@mozilla-protocol/core/protocol/css/includes/themes';
|
|
@use '~@mozilla-protocol/core/protocol/css/components/forms/form';
|
|
|
|
// Fonts
|
|
@import '~@mozilla-protocol/core/protocol/css/includes/fonts/inter';
|
|
@import '~@mozilla-protocol/core/protocol/css/includes/fonts/zilla-slab';
|
|
|
|
// Base elements - general HTML elements
|
|
@import '~@mozilla-protocol/core/protocol/css/base/elements';
|
|
|
|
// Base includes - animations
|
|
@import '~@mozilla-protocol/core/protocol/css/base/includes';
|
|
|
|
// Utility includes
|
|
@import '~@mozilla-protocol/core/protocol/css/base/utilities/backgrounds';
|
|
@import '~@mozilla-protocol/core/protocol/css/base/utilities/titles';
|
|
|
|
// Global components
|
|
@import '~@mozilla-protocol/core/protocol/css/components/button';
|
|
@import '~@mozilla-protocol/core/protocol/css/components/footer';
|
|
@import '~@mozilla-protocol/core/protocol/css/components/language-switcher';
|
|
@import 'components/download-button';
|
|
|
|
// Consent banner
|
|
@import '~@mozmeao/consent-banner/styles';
|
|
|
|
// Custom global components for nav and footer
|
|
// These will later be backported to Protocol
|
|
@import 'components/footer';
|
|
@import 'components/navigation';
|
|
@import 'components/menu';
|
|
@import 'components/menu-item';
|
|
@import 'components/sub-navigation';
|
|
|
|
// Temporary styling until the newsletter component is updated in Protocol
|
|
// https://github.com/mozilla/protocol/issues/578
|
|
|
|
.mzp-c-newsletter-subtitle {
|
|
@include text-title-xs;
|
|
}
|
|
|
|
.mzp-c-newsletter-desc {
|
|
@include text-body-md;
|
|
}
|
|
|
|
.mzp-c-newsletter-details legend {
|
|
font-family: $body-font-family;
|
|
|
|
@supports (--css: variables) {
|
|
font-family: var(--body-font-family);
|
|
}
|
|
}
|
|
|
|
#newsletter-submit + .mzp-c-fieldnote {
|
|
@include text-body-xs;
|
|
margin: 0 auto;
|
|
max-width: 30em;
|
|
}
|
|
|
|
// style classes automatically added by python to match Protocol form error styles
|
|
.errorlist {
|
|
@include white-links;
|
|
background-color: form.$form-red;
|
|
border-radius: form.$field-border-radius;
|
|
color: $color-white;
|
|
padding: $spacing-sm;
|
|
margin-bottom: $spacing-xl;
|
|
}
|
|
|
|
.error-msg {
|
|
@include light-links;
|
|
background-color: form.$form-red;
|
|
border-radius: form.$field-border-radius;
|
|
color: $color-white;
|
|
padding: $spacing-sm;
|
|
margin-bottom: $spacing-xl;
|
|
}
|
|
|
|
// hide <template> elements in the DOM.
|
|
template {
|
|
display: none !important; /* stylelint-disable-line declaration-no-important */
|
|
}
|
|
|
|
// temporary override for Mozilla Monitor word mark
|
|
.mzp-c-wordmark.t-product-mozilla-monitor {
|
|
background-image: url('/media/img/logos/mozilla/monitor/wordmark.svg');
|
|
}
|