diff --git a/resources/assets/images/club/homepage/card-1.png b/resources/assets/images/club/homepage/card-1.png new file mode 100644 index 00000000..1f8dfeb0 Binary files /dev/null and b/resources/assets/images/club/homepage/card-1.png differ diff --git a/resources/assets/images/club/homepage/card-2.png b/resources/assets/images/club/homepage/card-2.png new file mode 100644 index 00000000..82134ce6 Binary files /dev/null and b/resources/assets/images/club/homepage/card-2.png differ diff --git a/resources/assets/images/club/homepage/card-3.png b/resources/assets/images/club/homepage/card-3.png new file mode 100644 index 00000000..6219a912 Binary files /dev/null and b/resources/assets/images/club/homepage/card-3.png differ diff --git a/resources/assets/images/club/homepage/card-4.png b/resources/assets/images/club/homepage/card-4.png new file mode 100644 index 00000000..a3ebeda7 Binary files /dev/null and b/resources/assets/images/club/homepage/card-4.png differ diff --git a/resources/assets/images/club/homepage/title-lines.svg b/resources/assets/images/club/homepage/title-lines.svg new file mode 100644 index 00000000..107db719 --- /dev/null +++ b/resources/assets/images/club/homepage/title-lines.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/resources/assets/images/placeholders/club/homecards/wood.png b/resources/assets/images/placeholders/club/homecards/wood.png deleted file mode 100644 index d57a5def..00000000 Binary files a/resources/assets/images/placeholders/club/homecards/wood.png and /dev/null differ diff --git a/resources/sass/club/base/_bootstrap-overload.scss b/resources/sass/club/base/_bootstrap-overload.scss index 7b6511c0..254a314b 100644 --- a/resources/sass/club/base/_bootstrap-overload.scss +++ b/resources/sass/club/base/_bootstrap-overload.scss @@ -1,108 +1,15 @@ -// .nav-link.active { -// color: $primary; -// font-weight: bold; -// } - -// * Overload colors -// .text-bg-secondary { -// color: $color-hex-dark-blue !important; -// } - -// .text-bg-success { -// color: $color-hex-dark-blue !important; -// } - -// .text-bg-warning { -// color: $color-hex-dark-blue !important; -// } - -// .text-bg-light { -// color: $color-hex-dark-blue !important; -// } - -// .btn-secondary { -// $value: $color-secondary; -// $color: $color-primary; - -// @include button-variant( -// $value, -// $value, -// $color: $color, -// $active-color: $color, -// $hover-color: $color, -// $disabled-color: $color, -// $hover-background: tint-color($value, $btn-hover-bg-tint-amount), -// $hover-border: tint-color($value, $btn-hover-border-tint-amount), -// $active-background: tint-color($value, $btn-active-bg-tint-amount), -// $active-border: tint-color($value, $btn-active-border-tint-amount) -// ); -// } - -// .btn-warning { -// $value: $color-warning; -// $color: $color-primary; - -// @include button-variant( -// $value, -// $value, -// $color: $color, -// $active-color: $color, -// $hover-color: $color, -// $disabled-color: $color, -// $hover-background: tint-color($value, $btn-hover-bg-tint-amount), -// $hover-border: tint-color($value, $btn-hover-border-tint-amount), -// $active-background: tint-color($value, $btn-active-bg-tint-amount), -// $active-border: tint-color($value, $btn-active-border-tint-amount) -// ); -// } - -// .btn-light { -// $value: $color-light; -// $color: $color-primary; - -// @include button-variant( -// $value, -// $value, -// $color: $color, -// $active-color: $color, -// $hover-color: $color, -// $disabled-color: $color, -// $hover-background: tint-color($value, $btn-hover-bg-tint-amount), -// $hover-border: tint-color($value, $btn-hover-border-tint-amount), -// $active-background: tint-color($value, $btn-active-bg-tint-amount), -// $active-border: tint-color($value, $btn-active-border-tint-amount) -// ); -// } - .dropdown-menu { overflow: hidden; } -// .link-light { -// $enable-important-utilities: true; +.overflow-md-0 { + @include media-breakpoint-up(md) { + overflow: visible !important; + } +} -// color: RGB(var(--#{$prefix}light-rgb) var(--#{$prefix}link-opacity, 1)) if($enable-important-utilities, !important, null); -// text-decoration-color: RGB(var(--#{$prefix}light-rgb) var(--#{$prefix}link-underline-opacity, 1)) if($enable-important-utilities, !important, null); - -// @if $link-shade-percentage != 0 { -// $value: $color-light; -// $link-shade-percentage: 60%; - -// &:hover, -// &:focus { -// $hover-color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage)); - -// color: RGBA(#{to-rgb($hover-color)}, var(--#{$prefix}link-opacity, 1)) if($enable-important-utilities, !important, null); -// text-decoration-color: RGBA(to-rgb($hover-color), var(--#{$prefix}link-underline-opacity, 1)) if($enable-important-utilities, !important, null); -// } -// } -// } - -// .form-select, -// .form-select:hover, -// .form-select:focus-visible, { -// > option:hover, -// > option:focus-visible { -// background-color: #f00 !important; -// } -// } +.overflow-xl-0 { + @include media-breakpoint-up(xl) { + overflow: visible !important; + } +} diff --git a/resources/sass/club/base/_common.scss b/resources/sass/club/base/_common.scss index 384b4f80..cd93df8c 100644 --- a/resources/sass/club/base/_common.scss +++ b/resources/sass/club/base/_common.scss @@ -19,6 +19,47 @@ } } +.title-red { + position: absolute; + top: -2.5rem; + left: -2rem; + padding: .3rem; + background-color: $color-danger; + transform: rotate(-3deg); +} + +.title-yellow { + position: absolute; + right: -2rem; + bottom: -2.5rem; + padding: .3rem; + background-color: $color-warning; + transform: rotate(-3deg); + + &::before, + &::after { + position: absolute; + width: 2rem; + height: 2rem; + background-image: url('@/images/club/homepage/title-lines.svg'); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + content: ''; + } + + &::before { + bottom: -1rem; + left: -2rem; + transform: rotate(180deg); + } + + &::after { + top: -1rem; + right: -2rem; + } +} + // Common sections .section-page-header { .header-icon { diff --git a/resources/sass/club/club.scss b/resources/sass/club/club.scss index a9497818..7a7c3617 100644 --- a/resources/sass/club/club.scss +++ b/resources/sass/club/club.scss @@ -16,7 +16,7 @@ @import "./base/layout"; // * PAGES -@import "./pages/auth/login"; +@import "./pages/auth"; @import "./pages/home"; @import "./pages/account"; diff --git a/resources/sass/club/pages/auth/_login.scss b/resources/sass/club/pages/_auth.scss similarity index 89% rename from resources/sass/club/pages/auth/_login.scss rename to resources/sass/club/pages/_auth.scss index 0a625818..90fc2ae8 100644 --- a/resources/sass/club/pages/auth/_login.scss +++ b/resources/sass/club/pages/_auth.scss @@ -1,4 +1,6 @@ -.page.login { +.page.login, +.page.register, +.page.email { background-image: url('@/images/club/auth/bg-bottom-left.svg'); background-position: left bottom; background-repeat: no-repeat; diff --git a/resources/sass/club/pages/home.scss b/resources/sass/club/pages/_home.scss similarity index 100% rename from resources/sass/club/pages/home.scss rename to resources/sass/club/pages/_home.scss diff --git a/resources/sass/club/partials/_card-club-info.scss b/resources/sass/club/partials/_card-club-info.scss index 2751ba82..5e318e10 100644 --- a/resources/sass/club/partials/_card-club-info.scss +++ b/resources/sass/club/partials/_card-club-info.scss @@ -1,52 +1,79 @@ -.card-club-info { - width: 16.881rem; - height: 19.694rem; - flex-shrink: 0; +.cards-wrapper { + padding-top: 1rem; + padding-bottom: 6rem; - &:nth-child(2n) { - transform: rotate(2deg); - } + .card-club-info { + width: 16.881rem; + height: 19.694rem; + flex-shrink: 0; + transition: .3s; - &:nth-child(2n+1) { - transform: rotate(-1deg); - } - - @include media-breakpoint-up(sm) { - width: 15.536rem; - height: 18.469rem; - } - - @include media-breakpoint-up(md) { - width: 22.5rem; - height: 26.25rem; - } - - .card-img-top { - width: 100%; - height: 100%; - object-fit: cover; - } - - .card-body { - position: relative; - - - .info-tag { - position: absolute; - top: -1rem; - left: 0; + @include media-breakpoint-up(sm) { + width: 15.536rem; + height: 18.469rem; } - .card-text { - /* stylelint-disable-next-line value-no-vendor-prefix */ - display: -webkit-box; - overflow: hidden; - margin: 1.85rem .92rem; - -webkit-box-orient: vertical; - -webkit-line-clamp: 3; - text-align: center; - text-overflow: ellipsis; - white-space: normal; + @include media-breakpoint-up(md) { + width: 22.5rem; + height: 26.25rem; + } + + @include media-breakpoint-up(xl) { + &:hover { + z-index: 1; + margin-top: -2rem !important; + opacity: 1 !important; + } + } + + .card-img-top { + width: 100%; + height: 100%; + object-fit: cover; + } + + .card-body { + position: relative; + + + .info-tag { + position: absolute; + top: -1rem; + left: 1rem; + } + + .card-text { + /* stylelint-disable-next-line value-no-vendor-prefix */ + display: -webkit-box; + overflow: hidden; + margin: 1.85rem .92rem; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + text-align: center; + text-overflow: ellipsis; + white-space: normal; + } + } + } + + a:nth-child(2n+1) .card-club-info { + transform: rotate(-2deg); + } + + a:nth-child(2n+2) .card-club-info { + transform: translateY(4rem) rotate(2deg); + } + + a:nth-child(2n+3) .card-club-info { + transform: translateY(2rem) rotate(-2deg); + } + + @include media-breakpoint-up(xl) { + width: fit-content; + margin: auto; + + &:hover .card-club-info { + opacity: .5; } } } diff --git a/resources/views/club/auth/login.blade.php b/resources/views/club/auth/login.blade.php index c90f77ac..6266d745 100644 --- a/resources/views/club/auth/login.blade.php +++ b/resources/views/club/auth/login.blade.php @@ -1,10 +1,9 @@ @extends('club.layout') @section('title', __('Connexion')) -@section('description', - __('Formulaire de connexion au club :appname', [ +@section('description', __('Formulaire de connexion au club :appname', [ 'appname' => config('app.name'), - ])) +])) @section('breadcrumb', request()->route()->getName()) @section('container-fluid', true) @@ -15,7 +14,6 @@ @section('backbtn-txt', __('Retour sur le club')) @section('content') -

{{ __('Je me connecte') }}

@@ -24,14 +22,14 @@
@csrf
- - + {{-- Force next columns to break to new line --}}
-
- + @error('email') {{ $message }} @@ -40,10 +38,12 @@
- +
- + @error('password') {{ $message }} @@ -55,7 +55,7 @@
@if (Route::has('club.password.request')) {!! clean( - __('Oups j\'ai oublié :startSpan mon mot de passe:endSpan', [ + __('Oups j’ai oublié :startSpan mon mot de passe:endSpan', [ 'startSpan' => '
-
- @endsection diff --git a/resources/views/club/auth/passwords/confirm.blade.php b/resources/views/club/auth/passwords/confirm.blade.php index f872b126..047544dc 100644 --- a/resources/views/club/auth/passwords/confirm.blade.php +++ b/resources/views/club/auth/passwords/confirm.blade.php @@ -12,7 +12,6 @@ @section('backbtn-txt', __('Retour')) @section('content') -

{{ __('Confirm Password') }}

@@ -21,20 +20,19 @@
{{ __('Please confirm your password before continuing.') }}
-
@csrf - {{-- PASSWORD --}}
- - + {{-- Force next columns to break to new line --}}
-
- + @php $dataPassword = ['id' => 'password']; @endphp
@@ -42,7 +40,6 @@
{{ $message }}
@endforeach
-
@@ -54,8 +51,6 @@
-
- @endsection diff --git a/resources/views/club/auth/passwords/email.blade.php b/resources/views/club/auth/passwords/email.blade.php index 5d81895e..76891d1e 100644 --- a/resources/views/club/auth/passwords/email.blade.php +++ b/resources/views/club/auth/passwords/email.blade.php @@ -1,10 +1,9 @@ @extends('club.layout') @section('title', __('Réinitialisation')) -@section('description', - __('Changement de votre mot de passe d\'accès au Club :appname', [ +@section('description', __('Changement de votre mot de passe d\'accès au Club :appname', [ 'appname' => config('app.name'), - ])) +])) @section('breadcrumb', request()->route()->getName()) @section('container-fluid', true) @@ -15,23 +14,22 @@ @section('backbtn-txt', __('Retour')) @section('content') -

{{ __('Mot de passe oublié ?') }}

-
+
@csrf
- - + {{-- Force next columns to break to new line --}}
-
- + @error('email') {{ $message }} @@ -46,8 +44,8 @@

- {{ __('Après avoir appuyé sur "Envoyer", rendez-vous dans votre boîte mail pour cliquer sur le lien.') }}

+ {{ __('Après avoir appuyé sur "Envoyer", rendez-vous dans votre boîte mail pour cliquer sur le lien.') }} +

- @endsection diff --git a/resources/views/club/auth/passwords/reset.blade.php b/resources/views/club/auth/passwords/reset.blade.php index f0ec14ff..19c0874a 100644 --- a/resources/views/club/auth/passwords/reset.blade.php +++ b/resources/views/club/auth/passwords/reset.blade.php @@ -1,10 +1,9 @@ @extends('club.layout') @section('title', __('Changement de mot de passe')) -@section('description', - __('Formulaire de changement de mot de passe du club :appname', [ +@section('description', __('Formulaire de changement de mot de passe du club :appname', [ 'appname' => config('app.name'), - ])) +])) @section('breadcrumb', request()->route()->getName()) @section('container-fluid', true) @@ -13,7 +12,6 @@ @section('page-class', 'auth reset') @section('content') -

{{ __('Réinitialiser votre mot de passe') }}

@@ -21,19 +19,17 @@
@csrf - - {{-- EMAIL --}}
- - + {{-- Force next columns to break to new line --}}
-
- + @error('email') {{ $message }} @@ -41,17 +37,17 @@ @enderror
- {{-- PASSWORD --}}
- - + {{-- Force next columns to break to new line --}}
-
- + @php $dataPassword = ['id' => 'password']; @endphp
@@ -59,18 +55,17 @@
{{ $message }}
@endforeach
- {{-- Confirm Password --}}
- - + {{-- Force next columns to break to new line --}}
-
- + @php $dataPassword = ['id' => 'password-confirmation']; @endphp
@@ -78,7 +73,6 @@
{{ $message }}
@endforeach
-
@@ -98,5 +92,4 @@
- @endsection diff --git a/resources/views/club/auth/register.blade.php b/resources/views/club/auth/register.blade.php index 0ed7f1e2..0830b690 100644 --- a/resources/views/club/auth/register.blade.php +++ b/resources/views/club/auth/register.blade.php @@ -1,10 +1,9 @@ @extends('club.layout') @section('title', __('Inscription')) -@section('description', - __('Formulaire d\'inscription au club :appname', [ +@section('description', __('Formulaire d’inscription au club :appname', [ 'appname' => config('app.name'), - ])) +])) @section('breadcrumb', request()->route()->getName()) @section('container-fluid', true) @@ -15,32 +14,27 @@ @section('backbtn-txt', __('Retour')) @section('content') -
-

{{ __('Je m\'inscris') }}

+

{{ __('Je m’inscris') }}

-
@csrf -
- @include('club.pages.customers.partials.customer-form') -
- +
@foreach ($errors->get('opt_in') as $message) @@ -51,8 +45,8 @@
- +
-
- {{-- Force next columns to break to new line --}}
-
{{ __('J\'ai déjà un compte') }} + title="{{ __('Aller sur la page de connexion') }}"> + {{ __('J’ai déjà un compte') }} +
- {{-- Force next columns to break to new line --}}
-
{!! clean( __( @@ -110,14 +99,11 @@ __('Go to page :page', [ 'page' => __('Charte de confidentialité'), ]) . - '" href="' . - route('club.password.request') . - '">', + '" href="FIXME: privacy policy route">', 'endA' => '', ], ), ) !!}
- @endsection diff --git a/resources/views/club/auth/verify.blade.php b/resources/views/club/auth/verify.blade.php index 6c2f6ce3..bb597d92 100644 --- a/resources/views/club/auth/verify.blade.php +++ b/resources/views/club/auth/verify.blade.php @@ -1,10 +1,9 @@ @extends('club.layout') @section('title', __('Vérification')) -@section('description', - __('Veuillez vérifier votre adresse email pour profiter des avantage du club :appname', [ +@section('description', __('Veuillez vérifier votre adresse email pour profiter des avantage du club :appname', [ 'appname' => config('app.name'), - ])) +])) @section('breadcrumb', request()->route()->getName()) @section('container-fluid', true) @@ -15,27 +14,24 @@ @section('backbtn-txt', __('Retour')) @section('content') -

{{ __('Verify Your Email Address') }}

-
@if (session('resent')) @endif - {{ __('Before proceeding, please check your email for a verification link.') }} {{ __('If you did not receive the email') }},
@csrf - . + .
- @endsection diff --git a/resources/views/club/icons/chevron-left.blade.php b/resources/views/club/icons/chevron-left.blade.php index 48b9ae0b..1bac5d84 100644 --- a/resources/views/club/icons/chevron-left.blade.php +++ b/resources/views/club/icons/chevron-left.blade.php @@ -1,6 +1,6 @@ -Facebook + title="{{ __('Go to page :page :appname', ['page' => 'Facebook', 'appname' => config('app.name')]) }}" + target="_blank"> + Facebook - Instagram + title="{{ __('Go to page :page :appname', ['page' => 'Instagram', 'appname' => config('app.name')]) }}" + target="_blank"> + Instagram - LinkedIn + title="{{ __('Go to page :page :appname', ['page' => 'LinkedIn', 'appname' => config('app.name')]) }}" + target="_blank"> + LinkedIn - Youtube + title="{{ __('Go to page :page :appname', ['page' => 'Youtube', 'appname' => config('app.name')]) }}" + target="_blank"> + Youtube diff --git a/resources/views/club/layouts/header.blade.php b/resources/views/club/layouts/header.blade.php index 2e08c337..e884a294 100644 --- a/resources/views/club/layouts/header.blade.php +++ b/resources/views/club/layouts/header.blade.php @@ -21,7 +21,6 @@ @endif - - {{-- LOGIN & REGISTER BTNS --}} @if (auth('club')->guest() and empty($__env->yieldContent('no-auth-btns')))
- {{ __('Je m\'inscris') }} - {{ __('Je me connecte') }} + + {{ __('Je m\'inscris') }} + + + {{ __('Je me connecte') }} +
@endif - {{-- CUSTOMER POINTS --}} @auth('club')
@@ -54,22 +55,22 @@
- {{-- NAVBAR --}} @auth('club') - @include('club.layouts.main-menu.offcanvas-menu', ['id' => 'offcanvas-main-menu']) @include('club.layouts.main-menu.offcanvas-search', ['id' => 'offcanvas-search-menu']) @endauth diff --git a/resources/views/club/layouts/main-menu/offcanvas-menu.blade.php b/resources/views/club/layouts/main-menu/offcanvas-menu.blade.php index deffb431..e46a61ee 100644 --- a/resources/views/club/layouts/main-menu/offcanvas-menu.blade.php +++ b/resources/views/club/layouts/main-menu/offcanvas-menu.blade.php @@ -1,4 +1,5 @@ -
+
@@ -6,10 +7,13 @@