chore: run formatter

This commit is contained in:
Corbin Crutchley
2023-08-09 03:54:51 -07:00
parent 713f3bd3f9
commit 3ba9627390
11 changed files with 190 additions and 171 deletions

View File

@@ -1,5 +1,5 @@
// @ts-nocheck // @ts-nocheck
const csso = require('postcss-csso'); const csso = require("postcss-csso");
module.exports = { module.exports = {
// Restructure false, otherwise FFG site breaks // Restructure false, otherwise FFG site breaks

View File

@@ -61,7 +61,8 @@
margin-bottom: var(--collection-card_title_padding-bottom); margin-bottom: var(--collection-card_title_padding-bottom);
} }
.title, .description { .title,
.description {
// prevents text overflow when the container is smaller than a single word (issue #620) // prevents text overflow when the container is smaller than a single word (issue #620)
// - this otherwise has no effect, since the container can always expand vertically // - this otherwise has no effect, since the container can always expand vertically
overflow: hidden; overflow: hidden;

View File

@@ -187,7 +187,8 @@
background-color: var(--btn_primary_background-color_emphasized_hovered); background-color: var(--btn_primary_background-color_emphasized_hovered);
} }
&:focus-visible, &.focusVisible { &:focus-visible,
&.focusVisible {
box-shadow: 0 0 0 var(--btn_primary_focus-outline_width) box-shadow: 0 0 0 var(--btn_primary_focus-outline_width)
var(--btn_primary_focus-oultine_color); var(--btn_primary_focus-oultine_color);
} }
@@ -205,7 +206,8 @@
background-color: var(--btn_secondary_background-color_emphasized_hovered); background-color: var(--btn_secondary_background-color_emphasized_hovered);
} }
&:focus-visible, &.focusVisible { &:focus-visible,
&.focusVisible {
box-shadow: 0 0 0 var(--btn_secondary_focus-outline_width) box-shadow: 0 0 0 var(--btn_secondary_focus-outline_width)
var(--btn_secondary_focus-oultine_color); var(--btn_secondary_focus-oultine_color);
} }
@@ -223,7 +225,8 @@
background-color: var(--btn_primary_background-color_default_hovered); background-color: var(--btn_primary_background-color_default_hovered);
} }
&:focus-visible, &.focusVisible { &:focus-visible,
&.focusVisible {
box-shadow: 0 0 0 var(--btn_primary_focus-outline_width) box-shadow: 0 0 0 var(--btn_primary_focus-outline_width)
var(--btn_primary_focus-oultine_color); var(--btn_primary_focus-oultine_color);
} }
@@ -241,7 +244,8 @@
background-color: var(--btn_secondary_background-color_default_hovered); background-color: var(--btn_secondary_background-color_default_hovered);
} }
&:focus-visible, &.focusVisible { &:focus-visible,
&.focusVisible {
box-shadow: 0 0 0 var(--btn_secondary_focus-outline_width) box-shadow: 0 0 0 var(--btn_secondary_focus-outline_width)
var(--btn_secondary_focus-oultine_color); var(--btn_secondary_focus-oultine_color);
} }

View File

@@ -53,7 +53,7 @@
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
margin-top: var(--spc-6x) margin-top: var(--spc-6x);
} }
.fundamentalsPricingCard { .fundamentalsPricingCard {

View File

@@ -138,7 +138,13 @@
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: linear-gradient(90deg, var(--section-background) 0%, transparent 33.33%, transparent 66.67%, var(--section-background) 100%); background: linear-gradient(
90deg,
var(--section-background) 0%,
transparent 33.33%,
transparent 66.67%,
var(--section-background) 100%
);
} }
.calendar { .calendar {

View File

@@ -26,7 +26,8 @@ body {
text-decoration: none; text-decoration: none;
background: none; background: none;
border: none; border: none;
transition: background var(--animSpeed) var(--animStyle), transition:
background var(--animSpeed) var(--animStyle),
box-shadow var(--animSpeed) var(--animStyle), box-shadow var(--animSpeed) var(--animStyle),
border-color var(--animSpeed) var(--animStyle), border-color var(--animSpeed) var(--animStyle),
color var(--animStyle) var(--animSpeed); color var(--animStyle) var(--animSpeed);

View File

@@ -18,7 +18,9 @@ code .line::before {
:root, :root,
.darkTheme { .darkTheme {
&, & .shiki, &.shiki { &,
& .shiki,
&.shiki {
--cardActiveBackground: #163954; --cardActiveBackground: #163954;
--white: black; --white: black;
--textColor: var(--on-dark-emphasis-medium); --textColor: var(--on-dark-emphasis-medium);

View File

@@ -56,9 +56,7 @@ const FilterDialogMobile = ({
return ( return (
<div class={styles.mobileDialogContainer}> <div class={styles.mobileDialogContainer}>
<div class={styles.dialogTitleContainer}> <div class={styles.dialogTitleContainer}>
<h1 class={`text-style-headline-4 ${styles.dialogTitle}`}> <h1 class={`text-style-headline-4 ${styles.dialogTitle}`}>Filter</h1>
Filter
</h1>
</div> </div>
<FilterSection <FilterSection
title={"Tag"} title={"Tag"}
@@ -149,15 +147,18 @@ const FilterDialogSmallTablet = ({
return ( return (
<div class={styles.tabletDialogContainer}> <div class={styles.tabletDialogContainer}>
<div class={styles.dialogTitleContainer}> <div class={styles.dialogTitleContainer}>
<LargeIconOnlyButton tag="button" type="button" onClick={onCancel} class={styles.closeButton}> <LargeIconOnlyButton
tag="button"
type="button"
onClick={onCancel}
class={styles.closeButton}
>
<span <span
class={styles.closeIcon} class={styles.closeIcon}
dangerouslySetInnerHTML={{ __html: close }} dangerouslySetInnerHTML={{ __html: close }}
/> />
</LargeIconOnlyButton> </LargeIconOnlyButton>
<h1 class={`text-style-headline-4 ${styles.dialogTitle}`}> <h1 class={`text-style-headline-4 ${styles.dialogTitle}`}>Filter</h1>
Filter
</h1>
<LargeButton <LargeButton
variant="primary-emphasized" variant="primary-emphasized"
tag="button" tag="button"

View File

@@ -24,15 +24,15 @@ export const FilterSection = ({
const { setEl, size } = useElementSize(); const { setEl, size } = useElementSize();
const onScroll = (e: MouseEvent) => { const onScroll = (e: Event) => {
const target = (e.target as HTMLElement); const target = e.target as HTMLElement;
const scrollAmount = target.scrollTop; const scrollAmount = target.scrollTop;
if (scrollAmount > 0) { if (scrollAmount > 0) {
target.classList.add("scrolled") target.classList.add("scrolled");
return; return;
} }
target.classList.remove("scrolled") target.classList.remove("scrolled");
} };
return ( return (
<div <div
@@ -79,7 +79,11 @@ export const FilterSection = ({
</div> </div>
)} )}
</div> </div>
<div className={styles.sectionContent} aria-hidden={collapsed} onScroll={onScroll}> <div
className={styles.sectionContent}
aria-hidden={collapsed}
onScroll={onScroll}
>
{children} {children}
</div> </div>
</div> </div>