Skip to content

Commit

Permalink
fix(ui): make icons filled for contrast
Browse files Browse the repository at this point in the history
  • Loading branch information
adrianflatner committed Oct 30, 2024
1 parent f1e36db commit 627a3bb
Show file tree
Hide file tree
Showing 3 changed files with 13 additions and 11 deletions.
4 changes: 2 additions & 2 deletions tavla/app/(admin)/edit/[id]/components/Footer/index.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
'use client'
import { useToast } from '@entur/alert'
import { Switch, TextField } from '@entur/form'
import { ValidationInfoIcon } from '@entur/icons'
import { ValidationInfoFilledIcon } from '@entur/icons'
import { Heading3 } from '@entur/typography'
import { Tooltip } from 'app/(admin)/components/Tooltip'
import { SubmitButton } from 'components/Form/SubmitButton'
Expand Down Expand Up @@ -42,7 +42,7 @@ function Footer({
content="Skriv en kort tekst som skal vises nederst i tavlen."
placement="top"
>
<ValidationInfoIcon className="mb-3" size={20} />
<ValidationInfoFilledIcon className="mb-3" size={20} />
</Tooltip>
</div>
<div className="h-full">
Expand Down
11 changes: 6 additions & 5 deletions tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import {
DeleteIcon,
DownwardIcon,
EditIcon,
QuestionIcon,
QuestionFilledIcon,
UpwardIcon,
} from '@entur/icons'
import { Modal } from '@entur/modal'
Expand Down Expand Up @@ -367,8 +367,8 @@ function TileCard({
)}
</div>

<div className="flex flex-row items-baseline gap-1">
<Heading4>Kolonner</Heading4>
<div className="flex flex-row items-center gap-1 mt-6">
<Heading4 margin="none">Kolonner</Heading4>
<Tooltip
aria-hidden
placement="top"
Expand All @@ -378,12 +378,13 @@ function TileCard({
type="button"
aria-label="Vis forklaring på kolonner"
onClick={() => setIsColumnModalOpen(true)}
className="!p-0"
>
<QuestionIcon />
<QuestionFilledIcon size="20" />
</IconButton>
</Tooltip>
</div>
<div className="flex flex-row items-center gap-2">
<div className="flex flex-row items-start gap-2">
<SubParagraph>
Her bestemmer du hvilke kolonner som skal vises
i tavlen.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { useFormState } from 'react-dom'
import { saveColumns } from './actions'
import { Tooltip } from '@entur/tooltip'
import { IconButton } from '@entur/button'
import { QuestionIcon } from '@entur/icons'
import { QuestionFilledIcon } from '@entur/icons'
import { ColumnModal } from './ColumnModal'

function DefaultColumns({
Expand Down Expand Up @@ -51,15 +51,16 @@ function DefaultColumns({

return (
<div className="box flex flex-col gap-1">
<div className="flex flex-row items-baseline">
<Heading2>Kolonner</Heading2>
<div className="flex flex-row items-center gap-2">
<Heading2 margin="none">Kolonner</Heading2>
<Tooltip aria-hidden placement="top" content="Vis forklaring">
<IconButton
type="button"
aria-label="Vis forklaring på kolonner"
onClick={() => setIsOpen(true)}
className="!p-0"
>
<QuestionIcon size={24} />
<QuestionFilledIcon size={24} />
</IconButton>
</Tooltip>
</div>
Expand Down

0 comments on commit 627a3bb

Please sign in to comment.