diff --git a/11ty/definitions/mansplaining.md b/11ty/definitions/mansplaining.md index b311735b..8b7b712f 100644 --- a/11ty/definitions/mansplaining.md +++ b/11ty/definitions/mansplaining.md @@ -11,11 +11,13 @@ reading: --- ## Issues + Mansplaining places men (usually without authority) in a position of default authority, and places women and gender minoritised people with authority in a position of default subordination, which reinforces the power differential in men's favour. Mansplaining occupies real time in meetings, leading to men gaining more air time and exposure, despite the stereotype that women speak more.[1](https://slate.com/human-interest/2013/02/do-women-talk-more-the-answer-is-no-but-the-belief-persists-despite-the-evidence.html)[2](https://slate.com/human-interest/2013/02/do-women-talk-more-the-answer-is-no-but-the-belief-persists-despite-the-evidence.html) ## Impact + Mansplaining can reinforce toxic masculinity and rape culture, as it fundamentally is about disbelieving women and gender-minoritised individuals. Mansplaining contributes to the invalidation and disbelief of any women and gender-minoritised individuals and their credentials. The disbelief and intrinsic questioning of women and gender-minoritised individual especially reinforces systemic bias and injustice against them. @@ -26,10 +28,10 @@ Examples include but aren't limited to: a man explaining to a woman how to prono ## Note -A good way to check if you're mansplaining is to ask yourself whether: +A good way to check if you're mansplaining is to ask yourself whether: (1) the person explicitly asked for the explanation -(2) you are assuming incompetence because of the person's gender, race, ability, etc, and, +(2) you are assuming incompetence because of the person's gender, race, ability, etc, and, (3) how your systematic and individual bias, particularly gender bias in this context, affects your interpretation of (1) and (2) diff --git a/assets/css/base/_typography.scss b/assets/css/base/_typography.scss index 114b931c..c5815b16 100644 --- a/assets/css/base/_typography.scss +++ b/assets/css/base/_typography.scss @@ -1,68 +1,63 @@ h1 { - font-family: $ext-sans; - font-weight: $bold; + font-family: $ext-sans; + font-weight: $bold; } h1, h2, h3, h4 { - margin-bottom: 0.5em; - margin-top: 1em; - word-break: break-word; + margin-bottom: 0.5em; + margin-top: 1em; + word-break: break-word; } p { - font-size: 1.25rem; - line-height: 1.25; - margin: 0.75rem 0; + font-size: 1.25rem; + line-height: 1.25; + margin: 0.75rem 0; } .thicc-headline { - // a sensible base font size - font-size: 3rem; - line-height: 0.75; - margin: 0.5rem 0rem; - padding: 0; + // a sensible base font size + font-size: 3rem; + line-height: 0.75; + margin: 0.5rem 0rem; + padding: 0; } @media (min-width: 51rem) and (min-height: 400px) { - // a dramatic font size - .thicc-headline { - font-size: 12vh; - } + // a dramatic font size + .thicc-headline { + font-size: 12vh; + } } @media (min-width: 51rem) and (min-height: 850px) { - // cap the maximum font size of the title - // at the same size that 12vh computes to - // when the viewport is 850px high - // One day we can use CSS clamp https://caniuse.com/#feat=mdn-css_types_clamp - .thicc-headline { - font-size: 6.75rem; - } + // cap the maximum font size of the title + // at the same size that 12vh computes to + // when the viewport is 850px high + // One day we can use CSS clamp https://caniuse.com/#feat=mdn-css_types_clamp + .thicc-headline { + font-size: 6.75rem; + } } .main-headline { - font-family: orpheuspro, Palatino, Times, serif; - font-size: 3.5rem; - line-height: 1.2; - margin: 0; + font-family: orpheuspro, Palatino, Times, serif; + font-size: 3.5rem; + line-height: 1.2; + margin: 0; } .sub-headline { - font-size: 1.25rem; - font-weight: bold; -} - -.sub-headline { - font-family: $ext-sans; - font-size: 1.25rem; - font-weight: $regular; - letter-spacing: 0.1; - margin: .75rem 0; + font-family: $ext-sans; + font-size: 1.25rem; + font-weight: $bold; + letter-spacing: 0.1; + margin: .75rem 0; } .small { - font-size: 0.75em; + font-size: 0.75em; } diff --git a/assets/css/structures/_grid.scss b/assets/css/structures/_grid.scss index 69b190a2..e6841075 100644 --- a/assets/css/structures/_grid.scss +++ b/assets/css/structures/_grid.scss @@ -1,91 +1,88 @@ .grid { - display: grid; - grid-column-gap: 4rem; - grid-row-gap: 10rem; - grid-template-columns: repeat(4, [col] 1fr [col]); - grid-template-rows: fit-content, fit-content, auto; + display: grid; + grid-column-gap: 4rem; + grid-row-gap: 10rem; + grid-template-columns: repeat(4, [col] 1fr [col]); + grid-template-rows: fit-content, fit-content, auto; } .auto-grid { - display: grid; - grid-gap: var(--l-gap); - grid-template-columns: repeat( - auto-fit, - minmax(var(--auto-grid-min-size), 1fr) - ); + display: grid; + grid-gap: var(--l-gap); + grid-template-columns: repeat(auto-fit, minmax(var(--auto-grid-min-size), 1fr)); } @media screen and (max-width: 880px) { - .auto-grid { - display: flex; - flex-direction: column; - } + .auto-grid { + display: flex; + flex-direction: column; + } } .small-left-grid { - display: grid; - grid-gap: 1rem; + display: grid; + grid-gap: 1rem; - @media (min-width: #{pxToRem(800)}) { - grid-template-columns: 10rem 60ch; - } + @media (min-width: #{pxToRem(800)}) { + grid-template-columns: 10rem 60ch; + } } .block__dictionary { - margin-left: auto; - margin-right: auto; - max-width: 50rem; - padding: 0 1rem; + margin-left: auto; + margin-right: auto; + max-width: 50rem; + padding: 0 1rem; } .block__word { - display: flex; - flex-direction: column; - grid-column: span 2; - margin: 1rem; + display: flex; + flex-direction: column; + grid-column: span 2; + margin: 1rem; } .block__type { - align-items: flex-start; - display: grid; - grid-template-columns: 1fr 4fr; -} - -.box { - background: black; - color: white; - grid-column: span 2; - height: auto; - margin: 1rem 0; - padding: 1rem; - @media (min-width: #{pxToRem(768)}) { - margin: 1rem 0.5rem; - } - - &--divider { - margin: 2rem 0; - } - - a { - color: white; - - &:focus { - background-color: $lt-background-color; - color: $black; - } - } - *::selection { - background: white; /* WebKit/Blink Browsers */ - color: black; - } + align-items: flex-start; + display: grid; + grid-template-columns: 1fr 4fr; } .list { - margin: 1rem 0; - li { - margin: 0.75rem 0; - } - a { - word-break: break-word; - } + margin: 1rem 0; + li { + margin: 0.75rem 0; + } + a { + word-break: break-word; + } +} + +.box { + background: black; + color: white; + grid-column: span 2; + height: auto; + margin: 1rem 0; + padding: 1rem; + @media (min-width: #{pxToRem(768)}) { + margin: 1rem 0.5rem; + } + + &--divider { + margin: 2rem 0; + } + + a { + color: white; + + &:focus { + background-color: $lt-background-color; + color: $black; + } + } + *::selection { + background: white; /* WebKit/Blink Browsers */ + color: black; + } }