studio-variable/designtopack
4
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

Update Menu component: replace header h2 by p, fix header font-size and sticky gradient z-index

Browse source
This commit is contained in:
Timothée Goguely 2024-09-04 19:12:29 +02:00
parent 209cb06540
commit 4cf00533d0
1 changed files with 3 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/components/Menu.vue
View file

@ -7,7 +7,7 @@
</button> </button>
<div v-if="isExpanded" id="menu" class="flex | rounded-lg"> <div v-if="isExpanded" id="menu" class="flex | rounded-lg">
<header class="w-full | flex"> <header class="w-full | flex">
<h2>Nom du service</h2> <p>Nom du service</p>
</header> </header>
<nav class="w-full | flow"> <nav class="w-full | flow">
<ul class="flex"> <ul class="flex">
@ -105,7 +105,7 @@ button[aria-controls="menu"][aria-expanded="false"] {
padding-left: var(--gap); padding-left: var(--gap);
min-height: var(--space-40); min-height: var(--space-40);
font-family: var(--font-serif); font-family: var(--font-serif);
font-size: var(--text-lg); font-size: var(--text-md);
background: var(--color-background); background: var(--color-background);
position: -webkit-sticky; position: -webkit-sticky;
position: sticky; position: sticky;
@ -120,6 +120,7 @@ button[aria-controls="menu"][aria-expanded="false"] {
left: 0; left: 0;
right: 0; right: 0;
bottom: -2rem; bottom: -2rem;
z-index: -1;
background: linear-gradient(to bottom, var(--color-background) 0%, var(--color-background) 75%, transparent 100%); background: linear-gradient(to bottom, var(--color-background) 0%, var(--color-background) 75%, transparent 100%);
} }