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

Change NavBar, add new fonts

Browse source
This commit is contained in:
ossan KASSEGNE 2021-06-22 10:04:17 +02:00
parent c3c3d51b95
commit f1c23d15e1
21 changed files with 346 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
public/assets/fonts/CreamyScript.woff2 Normal file
View file

Binary file not shown.

BIN
public/assets/images/logo_avis.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
public/assets/images/logo_informer.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
public/assets/images/logo_liens.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
public/assets/images/logo_planning.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
public/assets/images/logo_question.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
resources/assets/fonts/CreamyScript.woff2 Normal file
View file

Binary file not shown.

BIN
resources/assets/images/logo_avis.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
resources/assets/images/logo_informer.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
resources/assets/images/logo_liens.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
resources/assets/images/logo_planning.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
resources/assets/images/logo_question.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

13
resources/js/vendor/dropdown.js vendored
View file

@ -1,11 +1,12 @@
dropContent = function dropContent() {
var x = document.getElementById("mainNav");
var y = document.getElementById("loginNav");
if (x.className === "navbar-links") {
x.className += " responsive";
y.className = "dropdown-content-mobile";
var x = document.getElementById("sideNavID");
var y = document.getElementById("menuID");
if (x.className === "dropMenu" && y.className === "sideNavMenu") {
x.className += " active";
y.className += " active";
} else {
x.className = "navbar-links";
x.className = "dropMenu";
y.className = "sideNavMenu";
}
}

12
resources/sass/front/partial/_fonts.sass
View file

@ -19,4 +19,14 @@ $font-mobile-small: 10px
$font-stack2: Times,Century Gothic,Berlin Sans FB, Arial, Helvetica, sans-serif
$font-stack3: Century Gothic,Berlin Sans FB, Arial, Helvetica, sans-serif
$font-stack4: Yu Gothic Bold,Berlin Sans FB, Arial, Helvetica, sans-serif
$font-stackNav: mont,Times,Century Gothic,Berlin Sans FB
$font-stackNav: 'Open Sans', sans-serif
$font-Normal: 'Open Sans', sans-serif
@font-face
font-family: "CreamyScript"
src: url('/assets/fonts/CreamyScript.woff2') format('woff2')
font-weight: normal
font-style: normal

3
resources/sass/front/partial/_footer.sass
View file

@ -13,7 +13,7 @@
img
transform: scale(0.8, 0.8)
&__coordonnees
font-family: $font-stack3
font-family: $font-Normal
&__content
margin-bottom: 10px
text-align: center
@ -35,7 +35,6 @@
img
transform: scale(0.6, 0.6)
&__coordonnees
font-family: $font-stack3
&__content
margin-bottom: 10px
text-align: center

12
resources/sass/front/partial/_header.sass
View file

@ -18,7 +18,7 @@ header
flex-grow: 1
color: $white
font-size: 1.5em
font-size: 2.5em
.navbarLeft
display: flex
justify-content: flex-end
@ -107,7 +107,8 @@ header
height: 52px
.greetings
color: $white
font-size: large
font-size: 1.5em
font-family: 'CreamyScript'
.logo
color: #fff
height: $height_nav
@ -148,9 +149,12 @@ header
//For 4k screen
@media screen and (min-width: map-get($breakpoints,UHD))
header
.surHeader
.greetings
font-size: 2em
nav
.siteName
font-size: 2em
font-size: 3.5em
a
font-size: $font-size_nav4k
.dropdown
@ -262,4 +266,4 @@ header
header
.surHeader
.greetings
font-size: small
font-size: medium

4
resources/sass/front/partial/_planning.sass
View file

@ -13,7 +13,7 @@
margin: 10px
text-align: center
padding: 7px
font-style: $font-stack4
font-style: $font-Normal
font-size: 15px
color: white
cursor: pointer
@ -24,7 +24,7 @@
justify-content: center
width: 100%
height: auto
min-height: 500px
padding: 15px
padding-bottom: 20px

162
resources/sass/front/style.sass
View file

@ -29,14 +29,73 @@ body
font-family: $font-stack2
line-height: 1
a
text-decoration: none
.creamyFont
font-family: CreamyScript
/** Containt **/
.wrapper
display: flex
flex-grow: 1
margin: auto
width: 80%
margin-bottom: 30px
.sideNavMenu
display: none
color: $white
height: 66px
.sideNav //Barre de navigation
display: flex
flex-flow: column nowrap
margin-right: 50px
.dropMenu
background-color: var(--primary-color)
&-logo
position: relative
text-align: center
height: 150px
margin: 20px 0 20px 40px
img
height: 150px
h1
position: absolute
top: 65%
right: 7%
transform: translate(-50%, -50%)
margin: 0px
color: var(--primary-color)
font-size: 2em
letter-spacing: 2px
&-lien
display: flex
width: 315px
height: 80px
border-bottom: 2px solid $white
font-family: 'CreamyScript'
background: var(--primary-color)
&.active
background: var(--secondary-color)
div
display: flex
justify-content: center
align-items: center
margin-left: 10px
margin-right: 50px
img
width: 40px
height: 40px
p
display: flex
justify-content: center
align-items: center
color: $white
.title //les titres
margin: 10px auto
text-align: center
font-size: 20px
color: var(--secondary-color)
font-family: 'CreamyScript'
letter-spacing: 2px
&Normal
text-align: left
color: var(--secondary-color)
@ -88,20 +147,19 @@ body
.container-pageLogo //Logo page
position: relative
text-align: center
height: 100px
height: 150px
img
width: 100px
height: 100px
height: 150px
h1
position: absolute
top: 50%
top: 60%
left: 50%
transform: translate(-50%, -50%)
margin: 0px
font-size: 2em
&-main
margin-top: 20px
padding: 20px
height: 100%
background: lighten( $body-color,6% )
.container-main__bloc //Page Liens Utiles
margin: 0 30px 30px 0px
@ -241,6 +299,10 @@ body
//for 4k screen
@media screen and (min-width: map-get($breakpoints, UHD))
.wrapper
.sideNav-lien
p
font-size: 1.3em
color: $white
.title
font-size: $font-size_4k_title
.container
@ -290,10 +352,100 @@ body
a
font-size: $font-size_4k_normal_plus
//for tablet
@media screen and (max-width: map-get($breakpoints, tablet))
//Navigation Menu
.wrapper
flex-direction: column
.container
.container-pageLogo
height: 120px
img
height: 120px
.dropMenu
visibility: hidden
opacity: 0
height: 0
transition: all 0.7s linear
&.active
visibility: visible
opacity: 1
height: auto
.sideNav-logo
height: 120px
img
height: 120px
h1
left: 47%
right: unset
width: 80%
.sideNav
margin-right: unset
.sideNavMenu
display: block
padding-top: 16px
background-color: var(--primary-color)
text-align: center
font-size: 30px
font-family: "CreamyScript"
&::after
content: ''
display: block
width: 0
height: 0
border-style: solid
border-width: 10px 10px 0 10px
border-color: #ffffff transparent transparent transparent
position: relative
top: -35%
left: 95%
transition: all 0.8s
&.active
border-bottom: 2px solid $white
&::after
transform: rotate(180deg)
transform-origin: 50% 33
.sideNav-lien
width: 100%
height: 66px
div
margin-left: 30px
img
width: 45px
height: 45px
p
flex-grow: 1
margin-right: 18%
font-size: 1.4em
//for mobile-smaller
@media screen and (max-width: map-get($breakpoints, mobile-small))
.wrapper
width: 90%
.container-main
padding: 3px
.container
width: 100%
.container-pageLogo
height: 100px
img
height: 100px
.sideNavMenu
&::after
left: 90%
.sideNav-lien
p
font-size: 1em
.sideNav-logo
height: 100px
img
height: 100px
h1
left: 43%
.wrapper .container .container-main__Sondage form .container__body .container__reponse
margin: 0 5px 7px 5px
.swiper-container

100
resources/views/front/employees/plannings.blade.php
View file

@ -3,37 +3,81 @@
@section("title", 'Mon planning')
@section("content")
<div class="wrapper">
<div class="container">
@include('front.partials.containerPageLogo', ['title' => 'Votre Planning'])
<div class="container-main">
<div class="container-main__tabs">
<div class="container-main__tab active" data-tab="current" onclick="showContent()" id="currentbtn">Semaine en cours</div>
<div class="container-main__tab" data-tab="next" onclick="showContent()" id="nextbtn">Semaine suivante</div>
<div class="wrapper">
<!-- sideNav -->
<div class="sideNav">
<div class="sideNav-logo">
<img src="{{ asset('assets/images/logo_lock.png') }}" alt="logo_access_salariés">
<h1 class=" creamyFont">Accès Salariés</h1>
</div>
<div class="sideNavMenu" onclick="dropContent()" id="menuID">
Menu déroulant
</div>
<div class="dropMenu" id="sideNavID">
<a class="sideNav-lien" href="{{ route('fo.flash.index') }}" @if(request()->route()->getName() == 'fo.flash.index')class="active"@endif>
<div><img src="{{ asset('assets/images/logo_informer_white.png') }}" alt="Logo-vous-informer"></div>
<p>Vous informer</p>
</a>
<a class="sideNav-lien" href="{{ route('fo.avis') }}" @if(request()->route()->getName() == 'fo.avis')class="active"@endif>
<div><img src="{{ asset('assets/images/logo_avis_white.png') }}" alt="Logo-avis"></div>
<p>Donnez votre avis</p>
</a>
<a href="{{ route('fo.employees.planning') }}" @if(request()->route()->getName() == 'fo.employees.planning')class="active"@endif>
<div class="sideNav-lien">
<div><img src="{{ asset('assets/images/logo_planning_white.png') }}" alt="Logo-planning"></div>
<p>Votre planning</p>
</div>
<div class="container-main__content bounceInLeft animated active" id="current">
<div class="description">
@if($plannings->get('now'))
@include('front.employees.planning', [
'planning' => $plannings->get('now')
])
@else
Données indisponibles.
@endif
</div>
</a>
<a class="sideNav-lien" href="{{ route('fo.employees.question') }}" @if(request()->route()->getName() == 'fo.employees.question')class="active"@endif>
<div><img src="{{ asset('assets/images/logo_question_white.png') }}" alt="Logo-question"></div>
<p>Vous avez une question?</p>
</a>
<a class="sideNav-lien" href="{{ route('fo.links') }}" @if(request()->route()->getName() == 'fo.links')class="active"@endif>
<div><img src="{{ asset('assets/images/logo_liens_white.png') }}" alt="Logo-liens-utiles"></div>
<p>Liens utiles</p>
</a>
</div>
</div>
<div class="container">
<div class="container-pageLogo">
<img src="{{ asset('assets/images/logo_planning.png') }}" alt="logo-planning">
<h1 class="title">Votre Planning</h1>
</div>
<div class="container-main">
<div class="container-main__tabs">
<div class="container-main__tab active" data-tab="current" onclick="showContent()" id="currentbtn">Semaine en cours</div>
<div class="container-main__tab" data-tab="next" onclick="showContent()" id="nextbtn">Semaine suivante</div>
</div>
<div class="container-main__content bounceInLeft animated active" id="current">
<div class="description">
@if($plannings->get('now'))
@include('front.employees.planning', [
'planning' => $plannings->get('now')
])
@else
Données indisponibles.
@endif
</div>
<div class="container-main__content bounceInRight animated" id="next">
<div class="description">
@if($plannings->get('next'))
@include('front.employees.planning', [
'planning' => $plannings->get('next')
])
@else
Données indisponibles.
@endif
</div>
</div>
<div class="container-main__content bounceInRight animated" id="next">
<div class="description">
@if($plannings->get('next'))
@include('front.employees.planning', [
'planning' => $plannings->get('next')
])
@else
Données indisponibles.
@endif
</div>
</div>
</div>
</div>
@endsection
</div>
@endsection

136
resources/views/front/liensUtiles.blade.php
View file

@ -3,61 +3,97 @@
@section("title", 'Liens utiles')
@section("content")
<div class="wrapper">
<div class="container">
@include('front.partials.containerPageLogo', ['title' => 'Liens utiles'])
<div class="container-main">
<div class="container-main__bloc">
<h2 class="title titleLeft">Vos projets de formation</h2>
<p>Vous avez des projets de formation... Vous trouverez de nombreuses informations utiles sur ces différents liens:</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://moncompteactivite.gouv.fr" target="_blank">moncompteactivite.gouv.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://fongecif-pdl.fr" target="_blank">fongecif-pdl.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://opcalim.org" target="_blank">opcalim.org</a>
</div>
<div class="wrapper">
<!-- sideNav -->
<div class="sideNav">
<div class="sideNav-logo">
<img src="{{ asset('assets/images/logo_lock.png') }}" alt="logo_access_salariés">
<h1 class=" creamyFont">Accès Salariés</h1>
</div>
<div class="sideNavMenu" onclick="dropContent()" id="menuID">
Menu déroulant
</div>
<div class="dropMenu" id="sideNavID">
<a href="{{ route('fo.flash.index') }}" @if(request()->route()->getName() == 'fo.flash.index')class="sideNav-lien active" @else class="sideNav-lien"@endif>
<div><img src="{{ asset('assets/images/logo_informer_white.png') }}" alt="Logo-vous-informer"></div>
<p>Vous informer</p>
</a>
<a href="{{ route('fo.avis') }}" @if(request()->route()->getName() == 'fo.avis')class="sideNav-lien active" @else class="sideNav-lien"@endif>
<div><img src="{{ asset('assets/images/logo_avis_white.png') }}" alt="Logo-avis"></div>
<p>Donnez votre avis</p>
</a>
<a href="{{ route('fo.employees.planning') }}" @if(request()->route()->getName() == 'fo.employees.planning') class="sideNav-lien active" @else class="sideNav-lien"@endif>
<div><img src="{{ asset('assets/images/logo_planning_white.png') }}" alt="Logo-planning"></div>
<p>Votre planning</p>
</a>
<a href="{{ route('fo.employees.question') }}" @if(request()->route()->getName() == 'fo.employees.question')class="sideNav-lien active" @else class="sideNav-lien"@endif>
<div><img src="{{ asset('assets/images/logo_question_white.png') }}" alt="Logo-question"></div>
<p>Vous avez une question?</p>
</a>
<a href="{{ route('fo.links') }}" @if(request()->route()->getName() == 'fo.links')class="sideNav-lien active" @else class="sideNav-lien"@endif>
<div><img src="{{ asset('assets/images/logo_liens_white.png') }}" alt="Logo-liens-utiles"></div>
<p>Liens utiles</p>
</a>
</div>
</div>
<div class="container">
@include('front.partials.containerPageLogo', ['title' => 'Liens utiles'])
<div class="container-main">
<div class="container-main__bloc">
<h2 class="title titleLeft">Vos projets de formation</h2>
<p>Vous avez des projets de formation... Vous trouverez de nombreuses informations utiles sur ces différents liens:</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://moncompteactivite.gouv.fr" target="_blank">moncompteactivite.gouv.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://fongecif-pdl.fr" target="_blank">fongecif-pdl.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://opcalim.org" target="_blank">opcalim.org</a>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre santé</h2>
<p>Suivez vos frais de santé : sur le site de la Sécurité sociale (Améli), ou sur celui de la mutuelle de l’entreprise (Génération)</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://ameli.fr" target="_blank">ameli.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://generation.fr" target="_blank">generation.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre épargne Entreprise</h2>
<p>Suivez vos versements sur le plan d’épargne groupe sur ce site.</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://cic-epargnesalariale.fr" target="_blank">cic-epargnesalariale.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre logement</h2>
<p>En tant que salarié, cet organisme vous propose des solutions et des accompagnements autour du logement.</p>
<div class="container-main__liens">
<a class="btn" href="http://actionlogement.fr" target="_blank">actionlogement.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Notre groupe</h2>
<p>Allez consulter le site internet de notre Groupe.</p>
<div class="container-main__liens">
<a class="btn " href="http://ldc.fr" target="_blank">ldc.fr</a>
</div>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre santé</h2>
<p>Suivez vos frais de santé : sur le site de la Sécurité sociale (Améli), ou sur celui de la mutuelle de l’entreprise (Génération)</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://ameli.fr" target="_blank">ameli.fr</a>
<a class="btn btn_green cabinet_links__btn" href="http://generation.fr" target="_blank">generation.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre épargne Entreprise</h2>
<p>Suivez vos versements sur le plan d’épargne groupe sur ce site.</p>
<div class="container-main__liens">
<a class="btn btn_green cabinet_links__btn" href="http://cic-epargnesalariale.fr" target="_blank">cic-epargnesalariale.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Votre logement</h2>
<p>En tant que salarié, cet organisme vous propose des solutions et des accompagnements autour du logement.</p>
<div class="container-main__liens">
<a class="btn" href="http://actionlogement.fr" target="_blank">actionlogement.fr</a>
</div>
</div>
<div class="container-main__bloc">
<h2 class="title titleLeft">Notre groupe</h2>
<p>Allez consulter le site internet de notre Groupe.</p>
<div class="container-main__liens">
<a class="btn " href="http://ldc.fr" target="_blank">ldc.fr</a>
</div>
</div>
</div>
</div>
@endsection
</div>
@endsection

4
resources/views/layouts/frontend/header.blade.php
View file

@ -14,12 +14,12 @@
<!--$societe->logo ?? Le logo n'apparait pas-->
</a>
</div>
<div class="siteName CreamyFont">
<div class="siteName creamyFont">
Accès salariés
</div>
<div class="navbar">
<div class="navbar-links" id="mainNav" style="display:none;">
<div class="navbar-links" id="mainNav" style="display:block;">
<!--Doit renvoyer vers le site de la société du salariés-->
<a href="{{ $site->url ?? '#' }}">
Accueil