0
0
mirror of https://github.com/wagtail/wagtail.git synced 2024-12-01 11:41:20 +01:00
wagtail/client/scss/settings/_variables.scss
2023-11-09 08:57:56 +00:00

67 lines
1.6 KiB
SCSS

@use 'sass:color';
// paths
// We can't use absolute paths here, because those are dependent on Django's
// STATIC_URL setting. Instead, relative paths from the final location of the
// compiled CSS files are used.
// */
$images-root: '../images/';
// grid settings
$grid-columns: 12;
$grid-gutter-width: 3%;
$grid-max-width: 1200px;
$grid-content-indent: 0.7;
$mobile-nice-padding: 20px;
$desktop-nice-padding: 80px;
// All text inputs have a 42px set height to simplify alignment.
$text-input-height: 2.625rem;
// Forms should be constrainted to a maximum width for legibility.
$max-form-width: 840px;
// Consistent spacing between form fields.
$form-field-spacing: theme('spacing.[7.5]');
// Indentation for nested fields.
$nested-field-indent: theme('spacing.[7.5]');
$nested-field-indent-sm: theme('spacing.3');
// screen breakpoints
$breakpoints: (
xs: 0,
sm: 50em,
// 800px
md: 56.25em,
// 900px
lg: 75em,
// 1200px
xl: 100em,
// 1440px
);
// Fonts
// Our fonts are based off of a list of system fallbacks to ensure
// that the most 'up-to-date' and available system font is used and rendered consistently as possible across browsers.
$font-sans: theme('fontFamily.sans');
$font-mono: theme('fontFamily.mono');
// misc sizing
$menu-width: 200px;
$menu-width-slim: 60px;
$side-panel-width: 500px;
$mobile-nav-indent: 50px;
$sidebar-toggle-spacing: 12px;
$sidebar-toggle-size: 35px;
// transitions
// Please keep in sync with SIDEBAR_TRANSITION_DURATION variable in `client/src/components/Sidebar/Sidebar.tsx`
$menu-transition-duration: 150ms;
$focus-outline-width: 3px;
$object-title-height: 40px;