Closed nkylstad closed 1 month ago
Funksjonelt ser dette veldig bra ut! Men jeg vil gjerne utfordre designet litt, spesielt når det kommer til avstander. Jeg ser at dette i stor grad følger skissene, så jeg tar med @Annikenkbrathen i loopen.
For det første tar ikke fanene hele bredden, slik de gjør for eksempel på datamodelleringssiden. Kodelister: Datamodellering:
Jeg mener at fanene burde gå helt ut til kanten for å gjøre designet mer helhetlig. Alternativt kunne fanene hatt sin egen boks, men jeg tror ikke det er nødvendig siden det ikke er noe annet i denne visningen som vi burde skille dem fra. Uansett hvilken av disse to løsningene vi eventuelt går for, vil begge gjøre det lettere å løse det neste problemet.
Jeg ser også at innholdet i fanepanelene blir plassert enda lengre borte fra kanten:
Andre steder hvor vi har denne typen lister går den blå bakgrunnen helt ut til kanten når brukeren holder musen over:
Ideen med StudioPropertyButton
-komponenten var at padding
-en på sidene skulle være tilstrekkelig for å få en tilfredsstillende avstand mellom innholdet og kantene, slik at vi kunne oppnå denne effekten.
Avstanden i bunnen er større enn det som er normen:
Jeg mener --fds-spacing-5
blir mer riktig her. Det er i hvert fall det vi har i tekstseksjonen over.
Noen av tekstene, f.eks. på fanene, ser større ut enn øvrige tekster. Mangler vi size='small'
?
Funksjonelt ser dette veldig bra ut! Men jeg vil gjerne utfordre designet litt, spesielt når det kommer til avstander. Jeg ser at dette i stor grad følger skissene, så jeg tar med @Annikenkbrathen i loopen.
Fanene går ikke ut til kantene
For det første tar ikke fanene hele bredden, slik de gjør for eksempel på datamodelleringssiden. Kodelister: Datamodellering:
Jeg mener at fanene burde gå helt ut til kanten for å gjøre designet mer helhetlig. Alternativt kunne fanene hatt sin egen boks, men jeg tror ikke det er nødvendig siden det ikke er noe annet i denne visningen som vi burde skille dem fra. Uansett hvilken av disse to løsningene vi eventuelt går for, vil begge gjøre det lettere å løse det neste problemet.
Her fulgte jeg skissene, men ser poenget ditt. Forskjellen mellom denne tab-visningen og den på datamodell-siden er at denne ligger inne i en Accordion, mens den på datamodell-siden ligger på "root". Men jeg vet ikke om det egentlig har noe å si.
Et alternativ her hadde vært å flytte "Valg for kodelister" opp til å ligge under komponent-ID, og alltid synlig, for flervalgskomponenter. Da slipper vi å ha den inne i en accordion, og gjør den kanskje mer tilgjengelig for brukerne og. Med full bredde sånn som det er satt opp i dag:
Øverst på egenskaper-panelet, under komponentID:
Knappene går ikke ut til kantene
Jeg ser også at innholdet i fanepanelene blir plassert enda lengre borte fra kanten:
Andre steder hvor vi har denne typen lister går den blå bakgrunnen helt ut til kanten når brukeren holder musen over: Ideen med
StudioPropertyButton
-komponenten var atpadding
-en på sidene skulle være tilstrekkelig for å få en tilfredsstillende avstand mellom innholdet og kantene, slik at vi kunne oppnå denne effekten.
Jepp, kommer fra paddingen i tab-komponenten. Er for så vidt enig her, skjermbildet over viser og med oppdatert padding (fjernet på sidene) for tabs.
For stor avstand i bunnen
Avstanden i bunnen er større enn det som er normen: Jeg mener
--fds-spacing-5
blir mer riktig her. Det er i hvert fall det vi har i tekstseksjonen over.
Ja, også fra kombinasjonen tabs + accordion. Fjerner den ene paddingen i bunn sånn at det ikke blir dobbelt opp.
Inkonsistente tekststørrelser
Noen av tekstene, f.eks. på fanene, ser større ut enn øvrige tekster. Mangler vi
size='small'
?
Jepp, godt observert!
Et alternativ her hadde vært å flytte "Valg for kodelister" opp til å ligge under komponent-ID, og alltid synlig, for flervalgskomponenter. Da slipper vi å ha den inne i en accordion, og gjør den kanskje mer tilgjengelig for brukerne og.
Dette forslaget likte jeg! Da unngår vi også problemet med at den ligger sammen med tekst, som jeg mener burde være for seg selv.
Ja, her har vi bare fulgt paddingen til designsystemet, så vi må gjerne utfordre det! vi tilpasser de jo vårt bruk og legger det i storybook, så det er ikke noen grunn til at de ikke skal gå ut i kantene. Enig at det ble mer ryddig og vi får i tillegg bedre plass! Da slipper vi også kanskje ha innboksinger noen steder hvor vi har de ti dag også.
Også enig med Nina!👏🏻 Vi hadde et møte i forbindelse med kodelister hvor vi snakket om å flytte alt viktig innhold utenfor accordianen, for at brukeren enklere skal få en oversikt over hva som må/bør legges inn for at komponenten skal fungere optimalt.
Da var det foreslått:
Hva tenker vi at vi gjør med denne PR'en nå da? Mitt forslag:
Så lager vi et issue på å flytte "viktig" konfig ut til å alltid være synlig sammen med komoponent-ID, hvor vi tar alle de konfig'ene beskrevet over.
Enig! "Viktig" konfigurasjon konseptet bør vi kanskje også teste litt Lagde et issue på det!
Nå synes jeg det ser mye bedre ut, men det er fortsatt noen tekster som er større enn resten. Jeg vet ikke om det er meningen, men jeg synes det skurrer litt.
For øvrig er vel "kodelistefil" ett ord uten bindestrek.
Dette er en digresjon, men jeg mener at det er flere grafikkmessige utfordringer med denne fanekomponenten. Jeg har opprettet en sak for Designsystemet med noen forslag til endringer.
Nå synes jeg det ser mye bedre ut, men det er fortsatt noen tekster som er større enn resten. Jeg vet ikke om det er meningen, men jeg synes det skurrer litt. For øvrig er vel "kodelistefil" ett ord uten bindestrek.
Derp. Jeg har oppdatert tekstene du påpekte nå med size='small'
. Godt observert!
Resultat:
Vet ikke hvorfor, men i dev får jeg bare den gamle visningen selv om jeg har rullet ut denne nå. Men jeg kjørte det opp lokalt og der ser det veldig bra ut!
Intro course docs updated in linked PR.
Description
See sketches in figma.
This issue covers setting up the new layout/view for codelists editing.
Out of scope
Making changes to the design/content of the different modes. That will be covered in separate issues.
Note: accidentally created a separate issue in the tasklist for the tab view. Closed the issue, marking the task as complete, but this is the issue that is in the sprint, and have connected PR/code review to this issue.