styles.scss

// _vanilla.defaults.scss modified

$brand-color: #416989;
$brand-neutral-colors: (#0a64a0, #dc2878, #501eb4, #49516f);
$brand-accent-colors: (#7ed4c6, #ff7d28);
$brand-link-color: #416989;
$brand-status-colors: (
    critical: #dc2878,
    error: #ff324d,
    warning: #ffd602,
    ok: #8cc800,
    unknown: #a8a8a8,
    disabled: #a8a8a8,
) !default;
$brand-grey-colors: (#000001, #333333, #3b3b3b, #434343, #666666);
// $button-secondary-color: nth($brand-neutral-colors, 2);
$brand-font-family: 'Work Sans', Arial, sans-serif;
$brand-large-number-font-family: 'Work Sans', Arial, sans-serif;
$code-font-family: Consolas, Menlo, 'DejaVu Sans Mono', 'Liberation Mono', monospace;
$text-strong-font-weight: 500;
$fonts-path: 'https://fonts.gstatic.com/s/worksans/v2';
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 300;
    src: local('Work Sans Light'), local('WorkSans-Light'),
        url('#{$fonts-path}/FD_Udbezj8EHXbdsqLUplxampu5_7CjHW5spxoeN3Vs.woff2') format('woff2');
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Work Sans'), local('WorkSans-Regular'),
        url('#{$fonts-path}//ElUAY9q6T0Ayx4zWzW63VJBw1xU1rKptJj_0jans920.woff2') format('woff2');
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 500;
    src: local('Work Sans Medium'), local('WorkSans-Medium'),
        url('#{$fonts-path}/Nbre-U_bp6Xktt8cpgwaJBampu5_7CjHW5spxoeN3Vs.woff2') format('woff2');
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 600;
    src: local('Work Sans SemiBold'), local('WorkSans-SemiBold'),
        url('#{$fonts-path}/z9rX03Xuz9ZNHTMg1_ghGRampu5_7CjHW5spxoeN3Vs.woff2') format('woff2');
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Work Sans Bold'), local('WorkSans-Bold'),
        url('#{$fonts-path}/4udXuXg54JlPEP5iKO5AmRampu5_7CjHW5spxoeN3Vs.woff2') format('woff2');
}
.iframe-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
}
.iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
@import '~grommet/scss/grommet-core/index';
@import '~grommet/scss/vanilla/_objects.button-vanilla.scss';