summaryrefslogtreecommitdiff
path: root/scss/values/spacing/_constants.scss
diff options
context:
space:
mode:
authorJoe Carstairs <118172583+jcarstairs-scottlogic@users.noreply.github.com>2024-01-19 07:32:30 +0000
committerGitHub <noreply@github.com>2024-01-19 07:32:30 +0000
commit0b2fbe3f5b9e2fcf0da2b320af504d5cca759045 (patch)
tree6616775cbd5090eca7656eefa45dc2767a602d2f /scss/values/spacing/_constants.scss
parentda96287803ea26f4cc35173f9f34b71a1d6adfa5 (diff)
Layout and typography improvements (#63)
* Adds soft hyphens to homepage * auto-hyphenates! * Tighter line-height in logo * Fixes spacing and typography below xs breakpoint * Fixes xs-sm spacing and typography * Fixes border widths * Link hover uses wavy underline instead of fat underline * Fixes committee img layout on <xs * Nice separators between committee members * Better styling for committee member heading * Consistent start-end block padding for sections * Better breadcrumb styling * Neatens alignment in footer * Renames scss/variables -> scss/custom-properties * Pulls out colours SCSS variables * Merges margins and padding values * Moves variables/colours -> values/colours * Starts migrating spacing values to SCSS * Pulls out typography logic to SCSS variables/functions * Removes unneeded --er custom property * Calculates grid-total-width-absolute in SCSS * Forwards constants with @forward * Removes TODOs and unnecessary assignment to --width-prose
Diffstat (limited to 'scss/values/spacing/_constants.scss')
-rw-r--r--scss/values/spacing/_constants.scss58
1 files changed, 58 insertions, 0 deletions
diff --git a/scss/values/spacing/_constants.scss b/scss/values/spacing/_constants.scss
new file mode 100644
index 0000000..9a990b8
--- /dev/null
+++ b/scss/values/spacing/_constants.scss
@@ -0,0 +1,58 @@
+$grid-column-width-er: 32;
+$grid-gutter-width-er: 4;
+
+$grid-padding-er: (
+ 'xxl': 32,
+ 'xl': 26,
+ 'lg': 20,
+ 'md': 16,
+ 'sm': 12,
+ 'xs': 4,
+ 'initial': 1
+);
+
+$grid-column-count: (
+ 'xxl': 12,
+ 'xl': 12,
+ 'lg': 12,
+ 'md': 8,
+ 'sm': 8,
+ 'xs': 4,
+ 'initial': 1
+);
+
+$grid-prose-column-count: (
+ 'xxl': 8,
+ 'xl': 8,
+ 'lg': 8,
+ 'md': 8,
+ 'sm': 8,
+ 'xs': 4,
+ 'initial': 1
+);
+
+$grid-padding-er: (
+ 'xxl': 32,
+ 'xl': 26,
+ 'lg': 20,
+ 'md': 16,
+ 'sm': 12,
+ 'xs': 4,
+ 'initial': 1
+);
+
+$spacing-factor: (
+ 'inline': (lg: 4, md: 2, sm: 1),
+ 'block': (lg: 16, md: 10, sm: 5)
+);
+
+$grid-min-total-width-absolute: (
+ 'xxl': 100rem,
+ 'xl': 80rem,
+ 'lg': 64rem,
+ 'md': 48rem,
+ 'sm': 30rem,
+ 'xs': 100vw,
+ 'initial': 100vw
+);
+