diff --git a/orga/app/components/mission/navigation.gjs b/orga/app/components/mission/navigation.gjs index 5afb7816e57..06b14658220 100644 --- a/orga/app/components/mission/navigation.gjs +++ b/orga/app/components/mission/navigation.gjs @@ -2,19 +2,12 @@ import { LinkTo } from '@ember/routing'; import { t } from 'ember-intl'; diff --git a/orga/app/styles/components/campaign/list-header.scss b/orga/app/styles/components/campaign/list-header.scss index cca036bda49..41117d6acbd 100644 --- a/orga/app/styles/components/campaign/list-header.scss +++ b/orga/app/styles/components/campaign/list-header.scss @@ -3,7 +3,7 @@ display: flex; flex-direction: column; align-items: center; - + @include device-is('tablet') { flex-direction: row; margin: 1em 0 2.4em; @@ -18,29 +18,26 @@ } &__tabs { + display: flex; + gap: 8px; + width: fit-content; margin-bottom: 20px; - - ul { - display: flex; - width: 100%; - margin: 0; - padding: 0; - list-style: none; - } - - ul li { - flex-grow: 1; - } + padding: var(--pix-spacing-2x); + background-color: var(--pix-neutral-0); + border-radius: 8px; .navbar-item { - height: 100%; - } + padding: var(--pix-spacing-2x) var(--pix-spacing-4x); + font-weight: var(--pix-font-normal); + border-bottom: none; + border-radius: 8px; - @include device-is('tablet') { - ul li { - flex-grow: inherit; + &.active { + color: inherit; + font-weight: var(--pix-font-medium); + background: var(--pix-orga-50); + border-bottom: none; } } - } } diff --git a/orga/app/styles/pages/authenticated/mission.scss b/orga/app/styles/pages/authenticated/mission.scss index c462b2f4984..64bef7e14a3 100644 --- a/orga/app/styles/pages/authenticated/mission.scss +++ b/orga/app/styles/pages/authenticated/mission.scss @@ -80,8 +80,8 @@ @extend %pix-body-l; display: grid; - gap: var(--pix-spacing-8x); grid-template-columns: 2fr 1fr; + gap: var(--pix-spacing-8x); margin-top: var(--pix-spacing-8x); h2 {