From 1e65ca2f72cf40c0d5b03d78241bd0cf3db1f6c3 Mon Sep 17 00:00:00 2001 From: evlist Date: Wed, 30 Nov 2022 18:08:45 +0100 Subject: [PATCH] More dialog, I can't stand suid/mui :( ! --- src/components/infos/Infos.module.css | 12 +++--- src/components/infos/Infos.tsx | 58 ++++++++++++++++++++++----- src/i18n/en.ts | 4 +- src/i18n/fr.ts | 4 +- 4 files changed, 58 insertions(+), 20 deletions(-) diff --git a/src/components/infos/Infos.module.css b/src/components/infos/Infos.module.css index 41b200c..d4c6c07 100644 --- a/src/components/infos/Infos.module.css +++ b/src/components/infos/Infos.module.css @@ -6,18 +6,20 @@ z-index: 1; } +.dialog { + min-width: 500px; +} + .title { background-color: rgba(14, 116, 144, 0.7); color: white; clear: both; } -.title-text { - float: left; -} - .close { - float: right; + align-self: right; + margin-right: 2px; + padding-top: 16px; } .body { diff --git a/src/components/infos/Infos.tsx b/src/components/infos/Infos.tsx index b0424ca..2b3b3b7 100644 --- a/src/components/infos/Infos.tsx +++ b/src/components/infos/Infos.tsx @@ -1,4 +1,12 @@ -import { Dialog, DialogTitle, IconButton } from '@suid/material'; +import { + Box, + Dialog, + DialogContent, + DialogTitle, + Grid, + IconButton, + Typography, +} from '@suid/material'; import { Feature } from 'ol'; import { Geometry } from 'ol/geom'; import { Component, createSignal, For } from 'solid-js'; @@ -63,18 +71,46 @@ const Infos: Component<{}> = (props) => { }; return ( - + -
{t('nearby')}
- - - + + +
{t('nearby')}
+
+ + + + + +
- - - {(feature) => {t(feature.get('type'))}} - - + + + + {(feature) => ( + + + + {feature.get('name') + ? `${feature.get('name')} (${t(feature.get('type'))})` + : t(feature.get('type'))} + + + + + + + + + )} + + +
); }; diff --git a/src/i18n/en.ts b/src/i18n/en.ts index a933aa3..ba3b6b1 100644 --- a/src/i18n/en.ts +++ b/src/i18n/en.ts @@ -8,8 +8,8 @@ const dict = { wpt: 'place', trk: 'track', trkseg: 'track segment', - 'trkseg-start': 'start', - 'trkseg-finish': 'end', + 'trkseg-start': 'start of track segment', + 'trkseg-finish': 'end of track segment', }; export default dict; diff --git a/src/i18n/fr.ts b/src/i18n/fr.ts index c3ebd13..7126341 100644 --- a/src/i18n/fr.ts +++ b/src/i18n/fr.ts @@ -11,8 +11,8 @@ const dict = { wpt: 'lieu', trk: 'trace', trkseg: 'segment de trace', - 'trkseg-start': 'début', - 'trkseg-finish': 'fin', + 'trkseg-start': 'début de segment de trace', + 'trkseg-finish': 'fin de segment de trace', }; export default dict;