scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(SW-634): add logic to avoid double borders

Browse Source
This commit is contained in:
Fredrik Thorsson
2024-10-17 13:22:19 +02:00
parent 2fab1fd917
commit ae87b64cd5
2 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
components/Blocks/ShortcutsList/index.tsx
View File

@@ -18,7 +18,8 @@ export default function ShortcutsList({
const leftColumn = shortcuts.slice(0, middleIndex) const leftColumn = shortcuts.slice(0, middleIndex)
const rightColumn = shortcuts.slice(middleIndex) const rightColumn = shortcuts.slice(middleIndex)
const classNames = hasTwoColumns const classNames =
hasTwoColumns && shortcuts.length > 1
? { ? {
section: styles.twoColumnSection, section: styles.twoColumnSection,
leftColumn: styles.leftColumn, leftColumn: styles.leftColumn,
@@ -26,8 +27,10 @@ export default function ShortcutsList({
} }
: { : {
section: styles.oneColumnSection, section: styles.oneColumnSection,
leftColumn: styles.leftColumnBottomBorder, leftColumn:
rightColumn: "", shortcuts.length === 1
? styles.leftColumnBorderBottomNone
: styles.leftColumnBorderBottom,
} }
return ( return (

6
components/Blocks/ShortcutsList/shortcutsList.module.css
View File

@@ -7,10 +7,14 @@
} }
.leftColumn, .leftColumn,
.leftColumnBottomBorder { .leftColumnBorderBottom {
border-bottom: 1px solid var(--Base-Border-Subtle); border-bottom: 1px solid var(--Base-Border-Subtle);
} }
.leftColumnBorderBottomNone {
border-bottom: none;
}
@media screen and (min-width: 1367px) { @media screen and (min-width: 1367px) {
.twoColumnSection { .twoColumnSection {
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;