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

fix: adjust LargeTable styling

Browse Source
This commit is contained in:
Arvid Norlin
2024-06-04 14:10:41 +02:00
parent 349c95fbc4
commit af33f18a6a
8 changed files with 178 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
components/Loyalty/Blocks/DynamicContent/OverviewTable/index.tsx
View File

@@ -6,6 +6,7 @@ import { useIntl } from "react-intl"
import { Lang } from "@/constants/languages"
import Image from "@/components/Image"
import Select from "@/components/TempDesignSystem/Form/Select"
import levelsData from "./data/EN.json"
@@ -59,6 +60,16 @@ export default function OverviewTable() {
const [selectedLevelB, setSelectedLevelB] = useState(getLevelByTier(2))
const [selectedLevelC, setSelectedLevelC] = useState(getLevelByTier(3))
const defaultLevelA = levelsData.levels.find(
(level) => level.tier === selectedLevelA.tier
) as ComparisonLevel
const defaultLevelB = levelsData.levels.find(
(level) => level.tier === selectedLevelB.tier
) as ComparisonLevel
const defaultLevelC = levelsData.levels.find(
(level) => level.tier === selectedLevelC.tier
) as ComparisonLevel
function handleSelectChange(
callback: Dispatch<SetStateAction<ComparisonLevel>>
) {
@@ -97,6 +108,14 @@ export default function OverviewTable() {
defaultSelectedKey={selectedLevelA.tier}
onSelect={handleSelectChange(setSelectedLevelA)}
/>
<Image
className={styles.icon}
src={defaultLevelA.icon}
alt={defaultLevelA.name}
height={50}
width={100}
/>
<LevelSummary
level={
levelsData.levels.find(
@@ -113,6 +132,14 @@ export default function OverviewTable() {
defaultSelectedKey={selectedLevelB.tier}
onSelect={handleSelectChange(setSelectedLevelB)}
/>
<Image
className={styles.icon}
src={defaultLevelB.icon}
alt={defaultLevelB.name}
height={50}
width={100}
/>
<LevelSummary
level={
levelsData.levels.find(
@@ -134,6 +161,14 @@ export default function OverviewTable() {
defaultSelectedKey={selectedLevelA.tier}
onSelect={handleSelectChange(setSelectedLevelA)}
/>
<Image
className={styles.icon}
src={defaultLevelA.icon}
alt={defaultLevelA.name}
height={50}
width={100}
/>
<LevelSummary
level={
levelsData.levels.find(
@@ -150,6 +185,14 @@ export default function OverviewTable() {
defaultSelectedKey={selectedLevelB.tier}
onSelect={handleSelectChange(setSelectedLevelB)}
/>
<Image
className={styles.icon}
src={defaultLevelB.icon}
alt={defaultLevelB.name}
height={50}
width={100}
/>
<LevelSummary
level={
levelsData.levels.find(
@@ -166,6 +209,14 @@ export default function OverviewTable() {
defaultSelectedKey={selectedLevelC.tier}
onSelect={handleSelectChange(setSelectedLevelC)}
/>
<Image
className={styles.icon}
src={defaultLevelC.icon}
alt={defaultLevelC.name}
height={50}
width={100}
/>
<LevelSummary
level={
levelsData.levels.find(