feat: pride 2026 frontend (#6205)

* feat: pride 2026 banner app sidebar

* feat: use ProgressBar component

* feat: pride skins

* feat: pride skins

* feat: blog post

* fix: blogpost

* fix: pride skin condition

* fix: types

* fix: show logic

* fix: qa

* fix: lint

* fix: unused var
This commit is contained in:
Calum H.
2026-05-31 17:43:41 +01:00
committed by GitHub
parent 34b87991bc
commit 325926ad9b
31 changed files with 553 additions and 31 deletions
@@ -49,14 +49,14 @@ watch(
<template>
<div
v-tooltip="tooltip ?? undefined"
class="skin-button group relative flex items-end justify-center overflow-hidden border border-solid transition-[border-color,box-shadow] duration-200 focus-within:outline focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-brand"
class="skin-button group relative flex items-end justify-center overflow-hidden border border-solid transition-[border-color,box-shadow] duration-200"
:class="[
selected ? 'skin-button--selected' : '',
{ 'skin-button--with-actions': $slots['overlay-buttons'] },
]"
>
<button
class="absolute inset-0 z-10 cursor-pointer border-none bg-transparent p-0"
class="absolute inset-0 z-10 cursor-pointer border-none bg-transparent p-0 focus-visible:outline-none"
:aria-label="tooltip ? `Select ${tooltip}` : 'Select skin'"
:aria-pressed="selected"
@click="emit('select')"
@@ -151,6 +151,11 @@ watch(
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(37, 39, 45, 0.2) 100%);
}
.skin-button:has(:focus-visible) {
outline: 2px solid var(--color-brand);
outline-offset: 2px;
}
.skin-button:hover,
.skin-button:focus-within,
.skin-button--with-actions:hover,