@telekom/scale-components
Version:
Scale is the digital design system for Telekom products and experiences.
45 lines (39 loc) • 957 B
CSS
/**
* @license
* Scale https://github.com/telekom/scale
*
* Copyright (c) 2021 Egor Kirpichev and contributors, Deutsche Telekom AG
*
* 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/.
*/
:host {
--background: var(--telekom-color-background-canvas, #fff);
--spacing-x: var(--telekom-spacing-composition-space-08);
--min-height: 100vh;
}
.sr-only {
position: absolute;
left: -10000px;
overflow: hidden;
}
.shell {
display: flex;
min-height: var(--min-height);
flex-direction: column;
}
.shell .content {
box-sizing: border-box;
align-self: center;
width: 100%;
background: var(--background);
padding-left: var(--spacing-x);
padding-right: var(--spacing-x);
flex: 1;
}
@media (min-width: 1552px) {
.shell .content {
max-width: var(--header-max-width);
}
}