diff --git a/assets/main.scss b/assets/main.scss index 54c8691..45156b9 100644 --- a/assets/main.scss +++ b/assets/main.scss @@ -25,24 +25,44 @@ body { .header { @apply p-2 bg-slate-200; - a:not([target="_blank"]) { - @apply hidden xl:inline-block + .container { + @apply items-center; } } .logo { - @apply text-ioprim font-bold w-20 text-2xl leading-4 py-4 col-span-4 xl:col-span-2; + @apply w-full py-4 col-span-4 xl:col-span-2; + + a { + @apply flex items-center gap-2; + } + + &_text { + @apply leading-4 text-3xl font-semibold; + } + + svg { + @apply text-ioprim inline-block m-0 w-10 h-10; + } } .menu { - @apply col-span-8 flex justify-between; + @apply col-span-10 flex justify-end; a { - @apply underline decoration-0 underline-offset-4 decoration-dotted hover:decoration-transparent transition-all; + @apply hover:text-ioprim-900 transition-colors; + + &:before { + content: ''; + @apply inline-block w-[2px] h-5 mx-4 align-middle bg-gradient-to-t from-transparent via-[#333333] via-50% to-transparent; + } + &:first-child::before { + content: none; + } } a[href^=http] { - @apply relative no-underline; + @apply relative; &:after { content: '↷'; @@ -63,7 +83,7 @@ a[href^="#"] { } .k-logo { - @apply col-span-12 xl:col-span-2 row-span-3 text-9xl text-ioprim; + @apply col-span-12 xl:col-span-2 row-span-3 text-9xl; svg { @apply my-0 mx-auto; @@ -150,9 +170,11 @@ a[href^="#"] { &-status { @apply text-center; + &-icon { @apply text-8xl; } + &-text { @apply text-3xl; } @@ -172,8 +194,9 @@ label { } input { - @apply bg-neutral-200 border border-gray-300 text-gray-900 rounded focus:ring-blue-500 focus:border-blue-500 text-lg p-2.5 disabled:cursor-not-allowed; + @apply bg-neutral-200 border border-gray-300 text-gray-900 rounded focus:ring-blue-500 focus:border-blue-500 text-lg p-2.5 disabled:cursor-not-allowed disabled:text-black; } + input[type=checkbox] { @apply w-4 h-4; } diff --git a/components/header.vue b/components/header.vue index 92b19df..93ef533 100644 --- a/components/header.vue +++ b/components/header.vue @@ -10,12 +10,10 @@ const route = useRoute()