@imiobe/plonetheme-smartweb-base 0.0.4 → 0.0.6

package/src/scss/variables.scss

@@ -1,39 +1,25 @@
 //*// COLORS
-$primary: #109165 !default;
+$primary: #222831 !default;
+$primary-svg: #235789 !default;
 
 //*// TYPOGRAPHY
-@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&display=swap");
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500&display=swap');
 
-$font-family-base: "Raleway",
-system-ui,
--apple-system,
-"Segoe UI",
-"Helvetica Neue",
-"Noto Sans",
-"Liberation Sans",
-arial,
-sans-serif,
-"Apple Color Emoji",
-"Segoe UI Emoji",
-"Segoe UI Symbol",
-"Noto Color Emoji" !default;
-$font-family-title: "Playfair Display",
-system-ui,
--apple-system,
-"Segoe UI" !default;
+$font-family-base:'Roboto', sans-serif!default;
+$font-family-title:'Nunito', sans-serif!default;
 $font-title-color: $primary !default;
 $font-title-color-light: #fff !default;
 $font-title-color-dark: #000 !default;
-$font-title-weight: 400 !default;
+$font-title-weight: 700 !default;
 // $font-size-base affects the font size of the body text
 $font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
 $font-size-sm: $font-size-base * 0.875 !default;
 $font-size-lg: $font-size-base * 1.25 !default;
 $h1-font-size: $font-size-base * 2.5 !default;
 $h2-font-size: $font-size-base * 2 !default;
-$h3-font-size: $font-size-base * 1.75 !default;
-$h4-font-size: $font-size-base * 1.5 !default;
+$h3-font-size: $font-size-base * 1.5 !default;
+$h4-font-size: $font-size-base * 1.25 !default;
 $h5-font-size: $font-size-base * 1.25 !default;
 $h6-font-size: $font-size-base !default;
 
@@ -43,16 +29,24 @@ $h6-font-size: $font-size-base !default;
 @function url-encoded-color($color) {
   @return "%23"+str-slice("#{$color}", 2, -1);
 }
-
-$global-radius: 10px !default;
+$container-max-widths: (
+  sm: 100%,
+  md: 100%,
+  lg: 960px,
+  xl: 1140px,
+  xxl: 1320px
+);
+$global-radius: 0 !default;
 $enable-title-uppercase: false !default;
+$home-section-title-size:3.25rem!default;
 $home-section-title-margin:0 0 2rem 0 !default;
 $home-section-title-padding:0 !default;
 $home-section-title-align:left !default;
-
 $section-padding-top:0 !default;
+$to-portal-link-color:#282828!default;
+$img-placeholder:#F2F2F2!default;
 //swiper
-$swiper-icon-color: #000 !default;
+$swiper-icon-color: $primary-svg !default;
 $swiper-button-height: 45px !default;
 $swiper-button-width: 45px !default;
 $swiper-button-top: 26% !default;
@@ -61,14 +55,14 @@ $swiper-next-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/20
 $swiper-background-size: 50% !default;
 $swiper-background-color: #fff !default;
 $swiper-raduis: 50px !default;
-
+$swipper-bullet-color:$primary-svg!default;
 //*// HEADER
 $main-logo-max-width: 115px !default;
 $header-top-padding: 1rem 0 !default;
-$header-top-background: transparent !default;
+$header-top-background: #fff !default;
 $header-center-nav: false !default;
 $header-nav-margin: 0 1rem 0 1rem !default;
-$header-links-color:#000 !default;
+$header-links-color:$primary !default;
 $header-links-account-margin:0 !default;
 $header-links-account-padding:0 !default;
 $header-links-account-border:solid 0px #000 !default;
@@ -78,6 +72,8 @@ $header-links-account-hover-bg:transparent !default;
 $header-links-account-hover-color:#000 !default;
 $header-search-icon-color:#000 !default;
 $header-search-icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"  width="16" height="16"><path fill="#{url-encoded-color($header-search-icon-color)}" d="M11.08,6.77a4.31,4.31,0,1,0-4.31,4.31h0A4.32,4.32,0,0,0,11.08,6.77Zm4.92,8A1.24,1.24,0,0,1,14.77,16a1.17,1.17,0,0,1-.86-.37l-3.3-3.28a6.77,6.77,0,1,1,1.74-1.74l3.3,3.3A1.25,1.25,0,0,1,16,14.77Z"/></svg>') !default;
+$toggler-color:white !default;
+$header-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='#{$toggler-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !default;
 //bredcrumb
 $breadcrumb-bg: #d6d6d6 !default;
 $enable-full-width-breacrumb: false !default;
@@ -85,14 +81,21 @@ $enable-full-width-breacrumb: false !default;
 // sitenav
 $navbar-padding-x: 2.5rem !default;
 $nav-mask-background: rgb(15 11 11 / 76%) !default;
-$nav-link-color: #000 !default;
-$nav-link-open-color: #fff !default;
+$nav-link-color: $primary!default;
+$nav-link-open-color: $primary !default;
+$nav-link-active-color: $primary-svg !default;
 $nav-link-font-size: initial !default;
 $nav-link-font-weight: 500 !default;
-$nav-link-drop-color:#000 !default;
-$nav-link-drop: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"  width="8.444" height="5.2"><path fill="black" d="M.247.254a.831.831 0 0 1 1.2 0l2.78 2.854L7.011.254A.831.831 0 0 1 8.2.264a.882.882 0 0 1 .01 1.215L4.825 4.946a.835.835 0 0 1-.6.254 1.529 1.529 0 0 1-.6-.254L.247 1.479a.882.882 0 0 1 0-1.226Z" fill="#{url-encoded-color($nav-link-drop-color)}"/></svg>') !default;
+$nav-link-drop-color:$primary!default;
+$nav-link-drop: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"  width="8.444" height="5.2"><path d="M.247.254a.831.831 0 0 1 1.2 0l2.78 2.854L7.011.254A.831.831 0 0 1 8.2.264a.882.882 0 0 1 .01 1.215L4.825 4.946a.835.835 0 0 1-.6.254 1.529 1.529 0 0 1-.6-.254L.247 1.479a.882.882 0 0 1 0-1.226Z" fill="#{url-encoded-color($nav-link-drop-color)}"/></svg>') !default;
+$nav-link-drop-color-mobile:#000 !default;
+$nav-link-drop-mobile:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" version=\"1.1\" width=\"6\" height=\"9\"><path fill=\"%23000\" d=\"M0.256056 8.20064C0.175109 8.12308 0.110695 8.02993 0.0666899 7.92682C0.0226851 7.82371 -3.21599e-08 7.71275 -3.70604e-08 7.60064C-4.19609e-08 7.48853 0.0226851 7.37758 0.0666899 7.27447C0.110695 7.17135 0.175109 7.07821 0.256056 7.00064L3.11006 4.22064L0.256055 1.43664C0.177451 1.35858 0.11525 1.26558 0.0731093 1.16312C0.030969 1.06067 0.00974056 0.950818 0.0106723 0.840037C0.011604 0.729257 0.034677 0.619781 0.0785346 0.518048C0.122392 0.416314 0.186149 0.324378 0.266055 0.247643C0.428692 0.0905508 0.64545 0.00192103 0.871559 6.00434e-05C1.09767 -0.00180095 1.31586 0.0832488 1.48106 0.237643L4.94806 3.62264C5.02845 3.70052 5.09236 3.79377 5.13599 3.89685C5.17963 3.99992 5.20209 4.11071 5.20206 4.22264C5.16148 4.43857 5.07485 4.64321 4.94806 4.82264L1.48106 8.20064C1.31659 8.35962 1.0968 8.44849 0.868056 8.44849C0.639315 8.44849 0.41952 8.35962 0.255056 8.20064L0.256056 8.20064Z\" /></svg>")!default;
 $nav-first-level-gap: 30px !default;
-$nav-first-level-uppercase: true !default;
+$nav-first-level-uppercase: false !default;
+$nav-quick-link-color:$primary-svg;
+$nav-quick-link-size:18px!default;
+$nav-quick-link-weight: bold!default;
+$nav-quick-link-padding:0!default;
 $nav-sub-link-font-size: $nav-link-font-size !default;
 $nav-sub-link-font-weight: $nav-link-font-weight !default;
 $nav-overlay-radius:$global-radius !default;
@@ -121,7 +124,7 @@ $sub-nav-link-drop: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2
 $banner-enable-full-width: true !default;
 $banner-heigh: 500px !default;
 $banner-content-width: max-content !default;
-$banner-content-max-width: auto !default;
+$banner-content-max-width: 100% !default;
 $banner-content-margin: 0 !default;
 $banner-content-padding: 1rem !default;
 $banner-content-background: rgb(256 256 256 / 50%) !default;
@@ -129,24 +132,29 @@ $banner-content-is-vertical-center: true !default;
 $banner-content-title-font-size: 50px !default;
 $banner-content-title-color: black !default;
 $banner-content-title-text-transform: initial !default;
+$banner-content-text-align:left!default;
 $banner-content-description-font-size: 18px !default;
 $banner-content-description-color: black !default;
 
 // see_all
-$see-all-padding:1rem !default;
-$see-all-margin:2rem 0 0 0 !default;
-$see-all-bg:$primary !default;
-$see-all-color:#000 !default;
+$see-all-padding:0 !default;
+$see-all-margin: 2rem 0 0 0 !default;
+$see-all-bg:transparent !default;
+$see-all-color:$primary !default;
 $see-all-radius:$global-radius !default;
-$see-all-border:solid 1px $primary !default;
+$see-all-border:solid 0px $primary !default;
 $see-all-text-transform:none !default;
 $see-all-font-size:16px !default;
+$see-all-font-weight:700!default;
 $see-all-transition:all .2s ease !default;
-$see-all-hover-bg:#000 !default;
-$see-all-hover-color:#fff !default;
+$see-all-hover-bg:transparent !default;
+$see-all-hover-color:$primary-svg !default;
 $see-all-hover-radius:$global-radius !default;
-$see-all-hover-border:solid 1px $primary !default;
-$see-all-justify-content: center !default;
+$see-all-hover-border:solid 0px $primary !default;
+$see-all-justify-content: right !default;
+$see-all-underline-color: $primary-svg!default;
+$see-all-underline-width: 25%!default;
+$see-all-hover-underline-width:50%!default;
 
 
 // Quick access
@@ -161,12 +169,7 @@ $quick-access-height: 100px !default;
 $quick-access-background:#fff !default;
 $quick-access-border: solid 1px $primary !default;
 $quick-access-border-radius:100px !default;
-$quick-access-shadow: 0 0 2.2px rgb(0 0 0 / 2%),
-0 0 5.3px rgb(0 0 0 / 2.8%),
-0 0 10px rgb(0 0 0 / 3.5%),
-0 0 17.9px rgb(0 0 0 / 4.2%),
-0 0 33.4px rgb(0 0 0 / 5%),
-0 0 80px rgb(0 0 0 / 7%) !default;
+$quick-access-shadow: none !default;
 $quick-access-svg-width:40px !default;
 $quick-access-svg-color:$primary !default;
 $quick-access-item-title-margin: 1rem 0 0 0 !default;
@@ -185,7 +188,7 @@ $a-la-une-title-color: $font-title-color !default;
 $a-la-une-title-align:$home-section-title-align !default;
 $a-la-une-title-margin: $home-section-title-margin !default;
 $a-la-une-title-padding: $home-section-title-padding !default;
-$a-la-une-text-bg: #c1c1c1 !default;
+$a-la-une-text-bg: rgb(244, 244, 244) !default;
 $a-la-une-item-image-margin:0 !default;
 $a-la-une-item-title-color:$primary !default;
 $a-la-une-item-title-font-size:$h3-font-size !default;
@@ -208,30 +211,38 @@ $actu-title-color:$primary !default;
 $actu-title-align:$home-section-title-align !default;
 $actu-title-margin: $home-section-title-margin !default;
 $actu-title-padding: $home-section-title-padding !default;
-$actu-image-margin-bottom: 0.7rem !default;
+$actu-image-margin-bottom: 0 !default;
 $actu-image-border-radius: $global-radius !default;
-$actu-item-bg-color:red !default;
+$actu-item-bg-color:rgb(244, 244, 244) !default;
 $actu-item-bg-radius:$global-radius+2 !default;
-$actu-category-margin: 0 0 0.3rem 0 !default;
-$actu-category-padding: 0 !default;
-$actu-category-color: $primary !default;
-$actu-category-bg-color: #000 !default;
+$actu-category-margin: 0 0 .5rem 0 !default;
+$actu-category-padding: .5rem 1rem !default;
+$actu-category-color: #fff !default;
+$actu-category-bg-color: $primary-svg !default;
 $actu-category-text-transform: uppurcase !default;
 $actu-category-font-size: 14px !default;
 $actu-category-font-weight: initial !default;
 $actu-category-radius: $global-radius !default;
-$actu-item-title-margin: 1rem 0 !default;
-$actu-item-title-padding: 0 !default;
+$actu-item-title-margin: 0 0 0 0 !default;
+$actu-item-title-padding: 0 1rem !default;
 $actu-item-title-color: initial !default;
 $actu-item-title-text-transform: initial !default;
 $actu-item-title-font-size: $h3-font-size !default;
 $actu-item-title-font-weight: initial !default;
-$actu-date-margin: 0 !default;
-$actu-date-padding: 0 !default;
+$actu-item-title-align: left !default;
+$actu-item-description-margin: 0 0 .5rem 0 !default;
+$actu-item-description-padding: 0 1rem !default;
+$actu-item-description-color: initial !default;
+$actu-item-description-align: left !default;
+$actu-item-description-font-family: $font-family-base !default;
+$actu-date-margin: 0 0 .5rem 0!default;
+$actu-date-padding: 0 1rem !default;
 $actu-date-color: $primary !default;
 $actu-date-font-size: 14px !default;
+$actu-date-align: left !default;
 $actu-see-all-justify-content: $see-all-justify-content !default;
 
+
 // Event
 $event-section-full-width: true !default;
 $event-section-padding-top: 2rem !default;
@@ -241,26 +252,31 @@ $event-title-color:$primary !default;
 $event-title-align:$home-section-title-align !default;
 $event-title-margin: $home-section-title-margin !default;
 $event-title-padding: $home-section-title-padding !default;
-$event-image-margin-bottom: 0.7rem !default;
+$event-image-margin-bottom: 0rem !default;
 $event-image-border-radius: $global-radius !default;
-$event-item-bg-color:red !default;
+$event-item-bg-color:rgb(244, 244, 244) !default;
 $event-item-bg-radius:$global-radius+2 !default;
-$event-category-margin: 0 0 0.3rem 0 !default;
-$event-category-padding: 0 !default;
-$event-category-color: $primary !default;
-$event-category-bg-color: #000 !default;
+$event-category-margin: 0 0 0.5rem 0 !default;
+$event-category-padding: .5rem 1rem !default;
+$event-category-color: #fff !default;
+$event-category-bg-color: $primary-svg !default;
 $event-category-text-transform: uppurcase !default;
 $event-category-font-size: 14px !default;
 $event-category-font-weight: initial !default;
 $event-category-radius: $global-radius !default;
-$event-item-title-margin: 1rem 0 !default;
-$event-item-title-padding: 0 !default;
+$event-item-title-margin: 0 !default;
+$event-item-title-padding: 0 1rem !default;
 $event-item-title-color: initial !default;
 $event-item-title-text-transform: initial !default;
 $event-item-title-font-size: $h3-font-size !default;
 $event-item-title-font-weight: initial !default;
-$event-date-margin: 0 !default;
-$event-date-padding: 0 !default;
+$event-item-description-margin: 0 0 .5rem 0 !default;
+$event-item-description-padding: 0 1rem !default;
+$event-item-description-color: initial !default;
+$event-item-description-align: left !default;
+$event-item-description-font-family: $font-family-base !default;
+$event-date-margin: 0 0 .5rem 0 !default;
+$event-date-padding: 0 1rem !default;
 $event-date-color: $primary !default;
 $event-date-font-size: 14px !default;
 $event-see-all-justify-content: $see-all-justify-content !default;
@@ -278,7 +294,7 @@ $album-title-margin: $home-section-title-margin !default;
 $album-title-padding: $home-section-title-padding !default;
 $album-image-margin-bottom: 0.7rem !default;
 $album-image-border-radius: $global-radius !default;
-$album-item-bg-color:red !default;
+$album-item-bg-color:rgb(244, 244, 244) !default;
 $album-item-bg-radius:$global-radius+2 !default;
 $album-category-margin: 0 0 0.3rem 0 !default;
 $album-category-padding: 0 !default;
@@ -300,21 +316,14 @@ $album-date-color: $primary !default;
 $album-date-font-size: 14px !default;
 $album-see-all-justify-content: $see-all-justify-content !default;
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+// Newsletter
+$newsletter-bg-color:$primary-svg!default;
+$newsletter-align: center!default;
+$newsletter-padding-top:2rem!default;
+$newsletter-padding-bottom:2rem!default;
+$newsletter-margin:3rem 0!default;
+$newsletter-text-color:#fff!default;
+/////////////// interne ///////////////
 
 //*// SECTION TEXTE
 $font-size-texte: $font-size-base !default;
@@ -334,7 +343,6 @@ $section-text-link-color: $primary !default;
 $section-text-link-hover-decoration: solid 1px $primary !default;
 $section-text-max-width: 760px !default;
 
-
 // Section
 $section-padding-y: 5.31rem;
 $section-padding: (sm: 3rem,
@@ -346,12 +354,13 @@ $section-contact-title-size:$h2-font-size;
 $section-contact-sub-title-size:$font-size-lg;
 $section-contact-title-color:$primary;
 $section-contact-p-margin:1rem 0;
-$section-contact-width: 260px;
+$section-contact-portrait-ration:calc(4 / 5);
+$section-contact-background:#f3f3f3!default;
 
 // section-files
-$section-file-background-color: $primary;
-$enable-full-width-section-files: true;
-$enable-light-color-section-files: true;
+$section-file-background-color: $primary !default;
+$enable-full-width-section-files: true !default;
+$enable-light-color-section-files: true !default;
 
 // section-link
 $section-link-background-color: #F8F8F8;
@@ -373,4 +382,14 @@ $list-group-item-padding-x : 0px;
 
 $message-info:#27789c;
 $message-warning:#c06d01;
-$message-error:#ae2609;
+$message-error:#ae2609;
+
+//QUICK ACCESS
+$quick-access-title-font-family: $font-family-title !default;
+
+//SEE ALL
+$see-all-font-family: $font-family-title !default;
+:root {
+--bs-card-spacer-x:1rem;
+--bs-card-spacer-y:1rem;
+}