forge-joniko/ldc-legaulois
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

menu

Browse source
This commit is contained in:
Jérémy Munsch 2024-06-26 12:15:51 +02:00
parent d856332f8e
commit 556b2175a0
No known key found for this signature in database
GPG key ID: 18361AF3BFEC0FEC
7 changed files with 108 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
resources/sass/club/base/_layout.scss
View file

@ -8,12 +8,38 @@ body {
// * HEADER
> header {
top: 0;
left: 0;
width: 100%;
transition: all 0.3s ease;
#main-nav {
position: fixed;
float: left;
bottom: .5rem;
left: 50%;
transform: translateX(-50%);
width: 90vw;
height: 3.0625rem;
@include media-breakpoint-up(ssm) {
width: 21.875rem;
}
// * Menu Logo Nav item
.menu-logo {
position: absolute;
width: 6.75rem;
height: 4.625rem;
bottom: .4rem;
left: 50%;
transform: translateX(-50%);
@include media-breakpoint-up(ssm) {
width: 8.75rem;
}
img {
width: 100%;
object-fit: contain;
}
}
}
}
> main {

11
resources/sass/club/utilities/_bootstrap-variables.scss
View file

@ -43,3 +43,14 @@ $font-size-base: $font-default-size-base;
$line-height-base: $line-default-height-base;
$line-height-sm: $line-default-height-base * 0.85;
$line-height-lg: $line-default-height-base * 1.25;
$grid-breakpoints: map.merge((
xs: 0,
ssm: 320px,
sm: 576px,
md: 768px,
lg: 992px,
xl: 1200px,
xxl: 1400px
), (
xxxl: 1700px,
))

11
resources/views/club/icons/cloche.blade.php Normal file
View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg2" width="24" height="24" viewBox="0 0 24 24" fill="none" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs id="defs2" />
<path id="path1"
d="m 11.731871,21.348142 c -2.5454497,0 -5.0908997,-0.4043 -7.5052597,-1.2127 -0.91767,-0.3168 -1.616852,-0.9614 -1.922743,-1.8026 -0.316815,-0.8412 -0.2075687,-1.7698 0.294967,-2.6 l 1.256336,-2.0866 c 0.26219,-0.437 0.50254,-1.311 0.50254,-1.8245 V 8.6645421 c 0,-4.06398 3.31018,-7.37416 7.3741597,-7.37416 4.06399,0 7.37419,3.31018 7.37419,7.37416 v 3.1571999 c 0,0.5026 0.2403,1.3875 0.5025,1.8354 l 1.2454,2.0757 c 0.4698,0.7865 0.5572,1.737 0.2404,2.6 -0.1547,0.4223 -0.4032,0.8039 -0.7268,1.1161 -0.3236,0.3123 -0.7139,0.547 -1.1414,0.6865 -2.4034,0.8084 -4.9488,1.2127 -7.49429,1.2127 z m 0,-18.4190599 c -3.1572297,0 -5.7354597,2.5673 -5.7354597,5.73546 v 3.1571999 c 0,0.7975 -0.32774,1.9774 -0.73195,2.6657 l -1.25634,2.0866 c -0.24035,0.4042 -0.30589,0.8302 -0.16387,1.1908 0.13109,0.3714 0.45883,0.6554 0.90675,0.8084 4.532,1.5294 9.4406597,1.5294 13.9726597,0 0.3933,-0.1311 0.6992,-0.4261 0.8412,-0.8194 0.142,-0.3932 0.1093,-0.8193 -0.1092,-1.1798 l -1.2564,-2.0866 c -0.4151,-0.7101 -0.7319,-1.8791 -0.7319,-2.6766 V 8.6645421 c 0,-3.16816 -2.5673,-5.73546 -5.73549,-5.73546 z"
fill="currentColor" />
<path id="path2"
d="m 13.765961,3.2218721 c -0.0765,0 -0.153,-0.01092 -0.2295,-0.03277 -0.3168,-0.0874 -0.6227,-0.15295 -0.9176,-0.19665 -0.92862,-0.12017 -1.82445,-0.05462 -2.6656497,0.19665 -0.30589,0.09832 -0.63363,0 -0.8412,-0.22942 -0.10342,-0.11306 -0.17269,-0.25312 -0.19976,-0.40393 -0.02707,-0.15082 -0.01084,-0.30623 0.04681,-0.4482 0.21752,-0.56148 0.60024,-1.043778 1.0976297,-1.38317103 0.49738,-0.339392 1.08603,-0.51991426 1.68817,-0.51771922 1.2454,0 2.3379,0.74287922 2.7858,1.90089025 0.1092,0.29497 0.0546,0.62271 -0.153,0.85213 -0.1638,0.17479 -0.3932,0.26219 -0.6117,0.26219 z m -2.03202,20.6137699 c -1.08155,0 -2.1303197,-0.437 -2.8950497,-1.2017 -0.76472,-0.7647 -1.20171,-1.8135 -1.20171,-2.895 h 1.6387 c 0,0.6445 0.26219,1.2782 0.72103,1.737 0.4588397,0.4588 1.0924697,0.721 1.7370297,0.721 1.35462,0 2.45802,-1.1034 2.45802,-2.458 h 1.6387 c 0,2.2614 -1.8353,4.0967 -4.09672,4.0967 z"
fill="currentColor" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.3 KiB

9
resources/views/club/icons/hamburger.blade.php Normal file
View file

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg2" width="24" height="24" viewBox="0 0 24 24" fill="none" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs id="defs2" />
<line id="line1" x1="2.4927325" y1="8.3859291" x2="21.992733" y2="8.3859291" stroke="currentColor" stroke-width="2.5"
stroke-linecap="round" />
<line id="line2" x1="2.4927325" y1="15.719179" x2="13.926033" y2="15.719179" stroke="currentColor" stroke-width="2.5"
stroke-linecap="round" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 561 B

8
resources/views/club/icons/magnifier.blade.php Normal file
View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg1" width="24" height="24" viewBox="0 0 24 24" fill="none" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs id="defs1" />
<circle id="circle1" cx="11.011889" cy="11.410412" r="6.2222199" stroke="currentColor" stroke-width="2.5" />
<line id="line1" x1="16.334768" y1="15.854892" x2="19.900368" y2="19.420492" stroke="currentColor" stroke-width="2.5"
stroke-linecap="round" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 518 B

10
resources/views/club/icons/ticket.blade.php Normal file
View file

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg2" width="24" height="24" viewBox="0 0 24 24" fill="none" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs id="defs2" />
<path id="path1"
d="m 20.89289,11.656309 c 2.485062,2.131551 2.625668,3.227907 0.702938,5.481688 l -2.884141,3.380763 c -1.92273,2.253781 -3.024747,2.284408 -5.509809,0.152857 L 3.2209271,12.110611 C 0.7358287,9.9789669 0.59524113,8.8827035 2.5179803,6.6288302 L 2.7583285,6.347154 C 3.6156913,7.082482 4.8498876,7.0482353 5.5132327,6.2706792 6.1765778,5.4931231 6.0191175,4.2652563 5.161764,3.5298355 L 5.4021029,3.2481594 C 7.3248512,0.99428597 8.4268128,0.96375177 10.911902,3.0953024 Z"
stroke="currentColor" stroke-width="1.85618" stroke-linecap="round" stroke-linejoin="round" />
<path id="path2" d="M 12.96397,4.2173815 5.1147834,13.571722" stroke="currentColor" stroke-width="1.85618"
stroke-dasharray="3.9, 3.9" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1,005 B

36
resources/views/club/layouts/header.blade.php
View file

@ -1,11 +1,33 @@
<nav class="navbar navbar-expand rounded-pill bg-body py-0 shadow" id="main-nav">
{{-- MENU PHONE & TABLET --}}
<ul class="navbar-nav flex-grow-1 w-100 d-flex d-xl-none">
<nav class="navbar navbar-expand rounded-1 bg-light z-3 py-0" id="main-nav" data-bs-theme="light">
<ul class="navbar-nav flex-grow-1 w-100 d-flex">
{{-- MENU BTN --}}
<li class="nav-item no-wrap ms-3">
<button class="btn btn-link bars text-decoration-none text-secondary" data-bs-toggle="offcanvas"
data-bs-target="#offcanvas-main-menu" title="{{ __('Ouvrir Le menu') }}"
aria-controls="offcanvas-main-menu">&nbsp;&nbsp;</button>
<li class="nav-item ms-1">
<button class="btn btn-link text-tertiary p-1" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-main-menu"
title="{{ __('Ouvrir Le menu') }}" aria-controls="offcanvas-main-menu">@include('club.icons.hamburger')</button>
</li>
{{-- SEARCH BTN --}}
<li class="nav-item">
<button class="btn btn-link text-tertiary p-1" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search-menu"
title="{{ __('Ouvrir Le menu de recherche') }}" aria-controls="offcanvas-search-menu">@include('club.icons.magnifier')</button>
</li>
<li class="nav-item mx-auto">
<a class="btn btn-link menu-logo p-1" href="#FIXME::notifications">
<img src="{{ Vite::asset('resources/assets/images/legaulois-logo.png') }}"
title="{{ __(':appname, Volaille 100% Française', ['appname' => config('app.name')]) }}" alt="{{ config('app.name') }}"
role="img">
</a>
</li>
<li class="nav-item">
<a class="btn btn-link text-tertiary p-1" href="#FIXME::notifications">
@include('club.icons.cloche')
</a>
</li>
<li class="nav-item me-1">
<a class="btn btn-link text-tertiary p-1" href="#FIXME::br">
@include('club.icons.ticket')
</a>
</li>
</ul>
</nav>