From c44c92b7a248211e9676ff09abe232c5e0af7c11 Mon Sep 17 00:00:00 2001 From: Mathias Oppedal Heggelund <98742460+mheggelund@users.noreply.github.com> Date: Mon, 10 Jun 2024 13:26:39 +0200 Subject: [PATCH] fix: Missing Architectural Element in table. Architectural Element multiselect. Small styling changes. (#294) --- .../GdeSelect/GdeSelect.tsx | 3 +- .../GrossDepositionEnviromentGroup.styled.ts | 11 ++++++- .../GrossDepositionEnviromentGroup.tsx | 20 +++++++++---- .../StratigrapicGroups.styled.ts | 10 +++++++ .../StratigrapicGroups/StratigrapicGroups.tsx | 30 +++++++++++++++---- 5 files changed, 61 insertions(+), 13 deletions(-) diff --git a/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx b/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx index dbf85134..b76131e6 100644 --- a/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx +++ b/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx @@ -34,7 +34,7 @@ export const GdeSelect = ({ ); const ArchitecturalElement = GdeData.data.data.filter( - (g) => g.geologyGroup === 'Subenvironment', + (g) => g.geologyGroup === 'ArchitecturalElement', ); return ( @@ -82,6 +82,7 @@ export const GdeSelect = ({ option.identifier} onOptionsChange={(e: AutocompleteChanges) => { diff --git a/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.styled.ts b/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.styled.ts index ac5b62cd..484f1c6b 100644 --- a/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.styled.ts +++ b/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.styled.ts @@ -1,9 +1,18 @@ import styled from 'styled-components'; import { spacings } from '../../../tokens/spacings'; - export const Wrapper = styled.div` display: flex; flex-direction: column; row-gap: ${spacings.MEDIUM}; `; + +export const ArcElCell = styled.div` + display: flex; + flex-direction: row; + white-space: nowrap; + + > p { + padding-right: ${spacings.X_SMALL}; + } +`; diff --git a/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.tsx b/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.tsx index dfb95046..f28c8202 100644 --- a/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.tsx +++ b/src/components/GrossDepositionEnviroment/GrossDepositionEnviromentGroup/GrossDepositionEnviromentGroup.tsx @@ -128,15 +128,23 @@ export const GrossDepositionEnviromentGroup = ({ /> - {row.grossDepEnv.identifier} - {row.depEnv.identifier} - {row.subenv.identifier} -
+ + {row.grossDepEnv.identifier} + + + + {row.depEnv.identifier} + + + {row.subenv.identifier} + + + {row.architecturalElements.map((a) => ( -

{a.identifier}

+

{a.identifier},

))} -
+
))} diff --git a/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.styled.ts b/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.styled.ts index ac5b62cd..bf95f702 100644 --- a/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.styled.ts +++ b/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.styled.ts @@ -7,3 +7,13 @@ export const Wrapper = styled.div` row-gap: ${spacings.MEDIUM}; `; + +export const StratColCell = styled.div` + display: flex; + flex-direction: row; + white-space: nowrap; + + > p { + padding-right: ${spacings.X_SMALL}; + } +`; diff --git a/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.tsx b/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.tsx index 37312060..d4d6d02d 100644 --- a/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.tsx +++ b/src/components/StrategraphicColumn/StratigrapicGroups/StratigrapicGroups.tsx @@ -50,20 +50,40 @@ export const StratigrapicGroups = ({ {row.country.identifier} - {row.field.identifier} - {row.stratColumn.identifier} + + + {row.field.identifier} + + + + + {row.stratColumn.identifier} + + {filterUnitLevel(row, 1).length > 0 ? ( - {filterUnitLevel(row, 1)[0].identifier} + + + {filterUnitLevel(row, 1)[0].identifier} + + ) : ( --- )} {filterUnitLevel(row, 2).length > 0 ? ( - {filterUnitLevel(row, 2)[0].identifier} + + + {filterUnitLevel(row, 2)[0].identifier} + + ) : ( --- )} {filterUnitLevel(row, 3).length > 0 ? ( - {filterUnitLevel(row, 3)[0].identifier} + + + {filterUnitLevel(row, 3)[0].identifier} + + ) : ( --- )}