diff --git a/villerslaville/assets/svg/bg-agenda.jpg b/villerslaville/assets/svg/bg-agenda.jpg new file mode 100644 index 00000000..c41fbdbe Binary files /dev/null and b/villerslaville/assets/svg/bg-agenda.jpg differ diff --git a/villerslaville/assets/svg/bg-une.png b/villerslaville/assets/svg/bg-une.png new file mode 100644 index 00000000..13d17342 Binary files /dev/null and b/villerslaville/assets/svg/bg-une.png differ diff --git a/villerslaville/assets/svg/btn-plus.svg b/villerslaville/assets/svg/btn-plus.svg new file mode 100644 index 00000000..fb0e73b1 --- /dev/null +++ b/villerslaville/assets/svg/btn-plus.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/villerslaville/assets/svg/close.svg b/villerslaville/assets/svg/close.svg new file mode 100644 index 00000000..281ccbcc --- /dev/null +++ b/villerslaville/assets/svg/close.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/villerslaville/assets/svg/logo.png b/villerslaville/assets/svg/logo.png new file mode 100644 index 00000000..e176aff9 Binary files /dev/null and b/villerslaville/assets/svg/logo.png differ diff --git a/villerslaville/assets/svg/placeholder.jpg b/villerslaville/assets/svg/placeholder.jpg new file mode 100644 index 00000000..d276996f Binary files /dev/null and b/villerslaville/assets/svg/placeholder.jpg differ diff --git a/villerslaville/icons/android-chrome-144x144.png b/villerslaville/icons/android-chrome-144x144.png new file mode 100644 index 00000000..23e8075b Binary files /dev/null and b/villerslaville/icons/android-chrome-144x144.png differ diff --git a/villerslaville/icons/android-chrome-192x192.png b/villerslaville/icons/android-chrome-192x192.png new file mode 100644 index 00000000..b99dccd5 Binary files /dev/null and b/villerslaville/icons/android-chrome-192x192.png differ diff --git a/villerslaville/icons/android-chrome-256x256.png b/villerslaville/icons/android-chrome-256x256.png new file mode 100644 index 00000000..46e2a52c Binary files /dev/null and b/villerslaville/icons/android-chrome-256x256.png differ diff --git a/villerslaville/icons/android-chrome-36x36.png b/villerslaville/icons/android-chrome-36x36.png new file mode 100644 index 00000000..b86bb2b2 Binary files /dev/null and b/villerslaville/icons/android-chrome-36x36.png differ diff --git a/villerslaville/icons/android-chrome-384x384.png b/villerslaville/icons/android-chrome-384x384.png new file mode 100644 index 00000000..be847d42 Binary files /dev/null and b/villerslaville/icons/android-chrome-384x384.png differ diff --git a/villerslaville/icons/android-chrome-48x48.png b/villerslaville/icons/android-chrome-48x48.png new file mode 100644 index 00000000..4bdb37c0 Binary files /dev/null and b/villerslaville/icons/android-chrome-48x48.png differ diff --git a/villerslaville/icons/android-chrome-512x512.png b/villerslaville/icons/android-chrome-512x512.png new file mode 100644 index 00000000..36bd7b40 Binary files /dev/null and b/villerslaville/icons/android-chrome-512x512.png differ diff --git a/villerslaville/icons/android-chrome-72x72.png b/villerslaville/icons/android-chrome-72x72.png new file mode 100644 index 00000000..83028f9b Binary files /dev/null and b/villerslaville/icons/android-chrome-72x72.png differ diff --git a/villerslaville/icons/android-chrome-96x96.png b/villerslaville/icons/android-chrome-96x96.png new file mode 100644 index 00000000..54be3f5b Binary files /dev/null and b/villerslaville/icons/android-chrome-96x96.png differ diff --git a/villerslaville/icons/apple-touch-icon-1024x1024.png b/villerslaville/icons/apple-touch-icon-1024x1024.png new file mode 100644 index 00000000..901d8dce Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-1024x1024.png differ diff --git a/villerslaville/icons/apple-touch-icon-114x114.png b/villerslaville/icons/apple-touch-icon-114x114.png new file mode 100644 index 00000000..9ceb8c3f Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-114x114.png differ diff --git a/villerslaville/icons/apple-touch-icon-120x120.png b/villerslaville/icons/apple-touch-icon-120x120.png new file mode 100644 index 00000000..15fe5ae7 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-120x120.png differ diff --git a/villerslaville/icons/apple-touch-icon-144x144.png b/villerslaville/icons/apple-touch-icon-144x144.png new file mode 100644 index 00000000..05e9d334 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-144x144.png differ diff --git a/villerslaville/icons/apple-touch-icon-152x152.png b/villerslaville/icons/apple-touch-icon-152x152.png new file mode 100644 index 00000000..b0d3c3b8 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-152x152.png differ diff --git a/villerslaville/icons/apple-touch-icon-167x167.png b/villerslaville/icons/apple-touch-icon-167x167.png new file mode 100644 index 00000000..26c3208c Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-167x167.png differ diff --git a/villerslaville/icons/apple-touch-icon-180x180.png b/villerslaville/icons/apple-touch-icon-180x180.png new file mode 100644 index 00000000..9feee076 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-180x180.png differ diff --git a/villerslaville/icons/apple-touch-icon-57x57.png b/villerslaville/icons/apple-touch-icon-57x57.png new file mode 100644 index 00000000..df786df9 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-57x57.png differ diff --git a/villerslaville/icons/apple-touch-icon-60x60.png b/villerslaville/icons/apple-touch-icon-60x60.png new file mode 100644 index 00000000..5823c37f Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-60x60.png differ diff --git a/villerslaville/icons/apple-touch-icon-72x72.png b/villerslaville/icons/apple-touch-icon-72x72.png new file mode 100644 index 00000000..ff7b961b Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-72x72.png differ diff --git a/villerslaville/icons/apple-touch-icon-76x76.png b/villerslaville/icons/apple-touch-icon-76x76.png new file mode 100644 index 00000000..61a17565 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-76x76.png differ diff --git a/villerslaville/icons/apple-touch-icon-precomposed.png b/villerslaville/icons/apple-touch-icon-precomposed.png new file mode 100644 index 00000000..9feee076 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon-precomposed.png differ diff --git a/villerslaville/icons/apple-touch-icon.png b/villerslaville/icons/apple-touch-icon.png new file mode 100644 index 00000000..9feee076 Binary files /dev/null and b/villerslaville/icons/apple-touch-icon.png differ diff --git a/villerslaville/icons/favicon-16x16.png b/villerslaville/icons/favicon-16x16.png new file mode 100644 index 00000000..15bd2a51 Binary files /dev/null and b/villerslaville/icons/favicon-16x16.png differ diff --git a/villerslaville/icons/favicon-32x32.png b/villerslaville/icons/favicon-32x32.png new file mode 100644 index 00000000..2e6f32d1 Binary files /dev/null and b/villerslaville/icons/favicon-32x32.png differ diff --git a/villerslaville/icons/favicon-48x48.png b/villerslaville/icons/favicon-48x48.png new file mode 100644 index 00000000..4bdb37c0 Binary files /dev/null and b/villerslaville/icons/favicon-48x48.png differ diff --git a/villerslaville/icons/favicon.ico b/villerslaville/icons/favicon.ico new file mode 100644 index 00000000..430b370a Binary files /dev/null and b/villerslaville/icons/favicon.ico differ diff --git a/villerslaville/icons/logo.png b/villerslaville/icons/logo.png new file mode 100644 index 00000000..f007828a Binary files /dev/null and b/villerslaville/icons/logo.png differ diff --git a/villerslaville/icons/manifest.webmanifest b/villerslaville/icons/manifest.webmanifest new file mode 100644 index 00000000..ec5a3d08 --- /dev/null +++ b/villerslaville/icons/manifest.webmanifest @@ -0,0 +1,65 @@ +{ + "dir": "auto", + "lang": "en-US", + "display": "standalone", + "orientation": "any", + "start_url": "/?homescreen=1", + "background_color": "#fff", + "theme_color": "#fff", + "icons": [ + { + "src": "android-chrome-36x36.png", + "sizes": "36x36", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-48x48.png", + "sizes": "48x48", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-72x72.png", + "sizes": "72x72", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-96x96.png", + "sizes": "96x96", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-144x144.png", + "sizes": "144x144", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-256x256.png", + "sizes": "256x256", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-384x384.png", + "sizes": "384x384", + "type": "image/png", + "purpose": "any" + }, + { + "src": "android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png", + "purpose": "any" + } + ] +} \ No newline at end of file diff --git a/villerslaville/index.html b/villerslaville/index.html new file mode 100755 index 00000000..63031670 --- /dev/null +++ b/villerslaville/index.html @@ -0,0 +1,72 @@ + + + + Villerslaville + + + + + + + + + + + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+ + +
+
+
+ + + diff --git a/villerslaville/manifest.cfg b/villerslaville/manifest.cfg new file mode 100755 index 00000000..29bf2f4d --- /dev/null +++ b/villerslaville/manifest.cfg @@ -0,0 +1,21 @@ +[theme] +title = Template for villerslaville +description = A Diazo based Plone theme +preview = preview.png +rules = /++theme++villerslaville/rules.xml +prefix = /++theme++villerslaville +doctype = + +enabled-bundles = +disabled-bundles = + +production-js = /++theme++villerslaville/dist/js/theme.js +production-css = /++theme++villerslaville/dist/css/theme.css +tinymce-content-css = /++theme++villerslaville/dist/css/theme.css + + +#[theme:overrides] +#directory = template-overrides + +[theme:parameters] +# portal_url = python: portal.absolute_url() diff --git a/villerslaville/package.json b/villerslaville/package.json new file mode 100755 index 00000000..d827974d --- /dev/null +++ b/villerslaville/package.json @@ -0,0 +1,36 @@ +{ + "name": "@imiobe/plonetheme-smartweb-villerslaville", + "description": "iA.Smartweb base theme for Plone", + "private": false, + "publishConfig": { + "access": "public" + }, + "maintainers": [ + { + "name": "Thomas Lambert (iMio)", + "email": "thomas.lambert@imio.be", + "url": "https://imio.be" + } + ], + "homepage": "https://villerslaville.preprod.imio.be", + "keywords": [ + "imio", + "plone", + "smartweb" + ], + "version": "0.0.1", + "license": "GPL version 2", + "scripts": { + "stylelint": "npx stylelint 'src/**/*.{css,less}' 'src/**/*.{css,less}", + "stylelint:fix": "npx stylelint 'src/**/*.{css,less}' --fix", + "prettier": "npx prettier --single-quote --check 'src/**/*.{js,jsx,ts,tsx,json,css,scss,sass}'", + "prettier:fix": "npx prettier --single-quote --write 'src/**/*.{js,jsx,ts,tsx,json,css,scss,sass}'", + "dry-release": "release-it --dry-run", + "release": "release-it" + }, + "devDependencies": { + "@plone/plonetheme-barceloneta-base": "3.0.0", + "@imiobe/plonetheme-smartweb-base": "0.1.0", + "@popperjs/core": "^2.11.6" + } +} diff --git a/villerslaville/preview.png b/villerslaville/preview.png new file mode 100644 index 00000000..497910ae Binary files /dev/null and b/villerslaville/preview.png differ diff --git a/villerslaville/rules.xml b/villerslaville/rules.xml new file mode 100755 index 00000000..0d471ed6 --- /dev/null +++ b/villerslaville/rules.xml @@ -0,0 +1,146 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + col-md-12 + col-md-6 + col-md-4 + col-md-3 + col-md-4 + + +
+ + + + + +

+ + + + +
    + +
  • + + +
    • +     +
+ + + + + + +

+ + + + + + + +
+ + + + + + + + + + + + diff --git a/villerslaville/src/index.js b/villerslaville/src/index.js new file mode 100644 index 00000000..b75508cf --- /dev/null +++ b/villerslaville/src/index.js @@ -0,0 +1,32 @@ +import "./scss/main.scss"; +$(document).ready(function () { + $("#portal-globalnav-collapse").on("show.bs.collapse", function () { + document.body.classList.add("open-nav-overflow"); + document.documentElement.classList.add("open-nav-overflow"); + }); + $("#portal-globalnav-collapse").on("hidden.bs.collapse", function () { + document.body.classList.remove("open-nav-overflow"); + document.documentElement.classList.remove("open-nav-overflow"); + }); + + // For custom slider + if ($(".sectionnews .swiper").length > 0) { + var newsSwiper = $(".sectionnews .swiper")[0].swiper; + newsSwiper.params.spaceBetween = 30; + (newsSwiper.params.speed = 1000), newsSwiper.update(); + } + if ($(".sectionevents .swiper").length > 0) { + var eventsSwiper = $(".sectionevents .swiper")[0].swiper; + eventsSwiper.params.spaceBetween = 30; + (eventsSwiper.params.speed = 1000), eventsSwiper.update(); + } + + // For banner + + let checkBanner = document.querySelector("#portal-header #banner"); + let headerCustom = document.getElementById("portal-header"); + + if (checkBanner != null) { + headerCustom.classList.add("header-custom"); + } +}); diff --git a/villerslaville/src/scss/contact.scss b/villerslaville/src/scss/contact.scss new file mode 100644 index 00000000..61df6864 --- /dev/null +++ b/villerslaville/src/scss/contact.scss @@ -0,0 +1,13 @@ +#portal-column-content .sectioncontact { + .contact-type-organization { + background: $primary-light; + border-radius: 10px !important; + margin: 10px; + } + + h2, + h3, + h4 { + font-family: $font-family-base; + } +} diff --git a/villerslaville/src/scss/home/a-la-une.scss b/villerslaville/src/scss/home/a-la-une.scss new file mode 100644 index 00000000..e5a09ac8 --- /dev/null +++ b/villerslaville/src/scss/home/a-la-une.scss @@ -0,0 +1,122 @@ +// a la une +.a-la-une { + padding-top: 130px; + padding-bottom: 30px; + + .section-title { + position: relative; + color: #fff; + display: inline-block; + padding: 0 50px; + text-transform: uppercase; + font-weight: 500; + font-size: 30px; + + @media screen and (max-width: 991px) { + font-size: 20px !important; + } + + &::before { + background: $primary-blue; + background-position: bottom; + background-repeat: no-repeat; + background-size: contain; + border-radius: 20px; + content: ""; + display: block; + height: 400px; + right: 0; + margin-left: 0; + max-width: 1000px; + position: absolute; + top: -30px; + width: 1000px; + z-index: -2; + + @media screen and (max-width: 991px) { + height: 200px; + } + } + } + + .see_all { + display: none; + } + + .swiper-slide { + .swiper_title { + padding: 150px 100px 20px 80px; + width: 100%; + background: url("../../assets/svg/bg-une.png") top right no-repeat; + + @media screen and (max-width: 991px) { + position: relative; + left: 0; + padding: 80px 20px 60px; + background: none; + } + + h3 { + transition: 0.5s; + font-weight: 700; + color: #000; + font-size: 16px; + text-transform: initial; + text-align: left; + } + } + + .swiper_description { + padding: 0 100px 20px 80px; + width: 100%; + background: none; + + p { + font-size: 16px; + } + } + + .swiper_date { + display: none; + } + } + + .auth_source_container_title { + display: block; + padding: 0.2rem 0.5rem; + margin: 20px 0 0 20px; + color: #fff; + background: $primary-blue; + border-radius: 5px; + font-size: 12px; + font-weight: initial; + position: absolute; + left: calc(60% + 60px); + top: 90px; + + @media screen and (max-width: 991px) { + position: relative; + left: 0; + margin-top: -60px; + } + } + + .swiper-button-prev { + margin-top: -40px; + + @media screen and (max-width: 991px) { + display: none; + } + } + + .swiper-button-next { + //display: none; + margin-top: 10px; + left: 10px; + right: auto; + + @media screen and (max-width: 991px) { + display: none; + } + } +} diff --git a/villerslaville/src/scss/home/actualites.scss b/villerslaville/src/scss/home/actualites.scss new file mode 100644 index 00000000..5b11192d --- /dev/null +++ b/villerslaville/src/scss/home/actualites.scss @@ -0,0 +1,164 @@ +.bloc-actu { + overflow: hidden; + + @media screen and (max-width: 992px) { + padding-top: 60px; + } + + .carousel { + padding: 5px; + } + + @media screen and (max-width: 992px) { + margin: 3.6rem 0; + } + + .section-container { + position: relative; + } + + .container { + padding: 0 40px; + } + + .nb-items-batch-3 { + justify-items: end !important; + } + + .section-title { + position: relative; + color: #fff; + display: inline-block; + padding: 0 50px; + text-transform: uppercase; + font-weight: 500; + font-size: 30px; + + @media screen and (max-width: 991px) { + font-size: 20px !important; + } + + &::before { + background: $primary-blue; + background-position: bottom; + background-repeat: no-repeat; + background-size: contain; + border-radius: 20px; + content: ""; + display: block; + height: 400px; + left: 0; + margin-left: 0; + max-width: 1000px; + position: absolute; + top: -30px; + width: 1000px; + z-index: -2; + + @media screen and (max-width: 991px) { + height: 200px; + } + } + } + + .swiper-wrapper { + .swiper-slide { + border-radius: 50px 0 0; + transition: 0.5s; + + &:hover, + &:focus { + transition: 0.5s; + border-radius: 50px 0; + } + + & > a { + align-items: center; + padding-bottom: 60px; + background: #fff; + border-radius: 40px; + box-shadow: 0 0 10px rgba(0, 0, 0, 10%); + transition: 0.5s; + + .swiper-image { + transition: 0.5s; + } + + .auth_source_container_title { + color: #000; + font-size: 12px; + margin: 1rem 0 0.5rem; + padding: 0 1rem; + text-align: left; + } + + .swiper_date { + font-family: $font-family-base; + } + + .swiper_category { + border-radius: 10px; + } + + .auth_source_container_title { + display: block; + padding: 0.2rem 0.5rem; + margin: 20px 0 0 20px; + color: #fff; + background: $primary-blue; + border-radius: 5px; + font-size: 12px; + font-weight: initial; + } + + .swiper_title { + margin-top: 0; + + h3 { + font-family: $font-family-base; + transition: 0.5s; + font-weight: 700; + } + } + + .swiper_description { + display: none; + + p { + margin: 0; + } + } + + &:hover { + border-radius: 40px 40px 80px; + transition: 0.5s; + + .swiper_title { + h3 { + transition: 0.5s; + color: $primary-blue; + } + } + } + } + } + } +} + +.sectionnews .see_all { + justify-self: center !important; + + a { + background: $primary-blue; + color: #fff; + border: solid 1px $primary-blue; + border-radius: 10px; + + &:hover { + background: #000; + border: solid 1px #000 !important; + color: #fff; + border-radius: 10px; + } + } +} diff --git a/villerslaville/src/scss/home/banner.scss b/villerslaville/src/scss/home/banner.scss new file mode 100644 index 00000000..5187c7d9 --- /dev/null +++ b/villerslaville/src/scss/home/banner.scss @@ -0,0 +1,33 @@ +.smartweb_herobanner + .bannerSwiper + .swiper-slide + .swiper-banner-content-wrapper { + position: relative; + top: 80%; + transform: translateY(-50%); +} + +.smartweb_herobanner + .bannerSwiper + .swiper-slide + .swiper-banner-content-wrapper + .swiper-banner-content { + width: 100%; + max-width: 100%; + padding: 1rem; + margin: 0; + background: none !important; + text-align: center; + + .swiper-banner-title { + color: #fff; + font-weight: 600; + text-transform: uppercase; + font-size: 35px; + line-height: 40px; + } + + .rich_description { + display: none; + } +} diff --git a/villerslaville/src/scss/home/bulletins.scss b/villerslaville/src/scss/home/bulletins.scss new file mode 100644 index 00000000..cb8e2422 --- /dev/null +++ b/villerslaville/src/scss/home/bulletins.scss @@ -0,0 +1,83 @@ +.bloc_news { + .swiper-slide .swiper-image { + padding-bottom: 140%; + } + + overflow: hidden; + position: relative; + margin: 0; + max-width: 100vw; + padding-bottom: 2rem; + padding-top: 0; + width: 100vw; + left: 50%; + transform: translateX(-50%); + + .container { + padding: 0 20px; + } + + .section-title { + margin: 0 0 30px; + width: 100%; + text-align: center; + color: $primary-blue; + font-weight: 500; + } + + .swiper-slide { + background: #fff; + padding-bottom: 20px; + border-radius: 20px; + overflow: hidden; + transition: 0.5s; + box-shadow: 0 0 10px rgba(0, 0, 0, 10%); + + &:hover, + &:focus { + transition: 0.5s; + transform: translateY(10px); + } + + a { + text-decoration: none; + } + } + + .swiper_title h3 { + padding: 20px; + font-family: Roboto, sans-serif; + color: #000; + font-size: 1rem; + font-weight: 600; + } + + .swiper-button-next, + .swiper-button-prev { + display: none; + } + + .see_all { + display: flex; + + a { + background: $primary-blue; + color: #fff; + border: solid 1px $primary-blue; + border-radius: 10px; + padding: 1rem 1.5rem 0.9rem; + text-decoration: none; + text-transform: none; + margin: 30px auto 0; + transition: 0.2s; + + &:hover { + background: #000; + border: solid 1px #000; + color: #fff; + border-radius: 10px; + transition: 0.2s; + } + } + } +} diff --git a/villerslaville/src/scss/home/espace-citoyen.scss b/villerslaville/src/scss/home/espace-citoyen.scss new file mode 100644 index 00000000..f0529d7c --- /dev/null +++ b/villerslaville/src/scss/home/espace-citoyen.scss @@ -0,0 +1,98 @@ +.espace-citoyen { + background: linear-gradient(180deg, #fff 0, #fff 220px, #f2f2f2 221px, #fff); + padding-top: 100px; + padding-bottom: 150px; + margin-bottom: 0; + margin-top: 0; + max-width: 100vw; + position: relative; + width: 100vw; + left: 50%; + transform: translateX(-50%); + + &::before { + content: ""; + display: block; + height: 800px; + position: absolute; + right: 0; + top: 0; + width: 100px; + } + + @media screen and (max-width: 992px) { + padding-top: 0; + background: linear-gradient( + 180deg, + #fff 0, + #fff 120px, + #f2f2f2 121px, + #fff + ); + + &::before { + display: none; + } + } + + .section-title { + position: relative; + text-align: right; + margin-bottom: 2rem; + } + + .body-section { + .row { + max-width: 100%; + margin: 0 auto; + align-items: center; + background: #fff; + border-radius: 20px; + box-shadow: 0 0 10px rgba(0, 0, 0, 10%); + transition: 0.5s; + + li { + padding: 0 !important; + } + + .table_display { + height: 100%; + } + + .table_image { + padding: 1.5rem 1rem; + background: #fff; + border-radius: 15px; + display: flex; + gap: 20px; + align-items: center; + justify-content: center; + text-decoration: none; + height: 100%; + transition: all 0.25s ease; + + .image { + width: auto; + + svg { + height: auto; + width: 40px; + max-height: 40px; + opacity: 50%; + } + } + + &:hover { + transition: all 0.25s ease; + background: $primary-green; + + .image { + svg { + opacity: 100%; + } + } + } + } + } + } +} diff --git a/villerslaville/src/scss/home/events.scss b/villerslaville/src/scss/home/events.scss new file mode 100644 index 00000000..835ee4c7 --- /dev/null +++ b/villerslaville/src/scss/home/events.scss @@ -0,0 +1,142 @@ +.sectionevents { + padding-bottom: 100px; + padding-top: 100px; + margin: 0 0 100px; + max-width: 100vw; + width: 100vw; + left: 50%; + transform: translateX(-50%); + background: url("../../assets/svg/bg-agenda.jpg"); + background-size: cover; + background-position: center; + + .carousel { + padding: 5px; + } + + .container { + padding: 0 40px; + } + + .section-container { + position: relative; + + .swiper-pagination-bullet-active { + background: $primary-blue !important; + } + } + + .section-title { + position: relative; + color: #fff; + display: inline-block; + padding: 0 50px; + text-transform: uppercase; + font-weight: 500; + font-size: 30px; + + @media screen and (max-width: 991px) { + font-size: 20px !important; + } + + &::before { + background: $primary-blue; + background-position: bottom; + background-repeat: no-repeat; + background-size: contain; + border-radius: 20px; + content: ""; + display: block; + height: 400px; + right: 0; + margin-left: 0; + max-width: 1000px; + position: absolute; + top: -30px; + width: 1000px; + z-index: -2; + + @media screen and (max-width: 991px) { + height: 200px; + } + } + } + + .swiper-wrapper { + .swiper-slide { + border-radius: 50px 0 0; + transition: 0.5s; + + & > a { + align-items: center; + padding-bottom: 60px; + background: #fff; + border-radius: 40px; + box-shadow: 0 0 10px rgba(0, 0, 0, 10%); + transition: 0.5s; + + .swiper-image { + transition: 0.5s; + } + + .auth_source_container_title { + display: block; + padding: 0.2rem 0.5rem; + margin: 20px 0 0 20px; + color: #fff; + background: $primary-blue; + border-radius: 5px; + font-size: 12px; + font-weight: initial; + } + + .swiper_title { + margin-top: 0; + + h3 { + font-family: $font-family-base; + transition: 0.5s; + } + } + + .swiper_description { + display: none; + + p { + margin: 0; + } + } + + &:hover { + border-radius: 40px 40px 80px; + transition: 0.5s; + + .swiper_title { + h3 { + transition: 0.5s; + color: $primary-blue; + } + } + } + } + } + } + + .section-container .swiper-pagination-bullet-active { + background: $primary-blue !important; + } +} + +.sectionevents .see_all a { + background: $primary-blue; + color: #fff; + border: solid 1px $primary-blue; + border-radius: 10px; + + &:hover { + background: #fff; + border: solid 1px #fff !important; + color: #000; + border-radius: 10px; + } +} diff --git a/villerslaville/src/scss/home/footer.scss b/villerslaville/src/scss/home/footer.scss new file mode 100644 index 00000000..f298161d --- /dev/null +++ b/villerslaville/src/scss/home/footer.scss @@ -0,0 +1,200 @@ +#portal-footer-wrapper { + text-align: left !important; + margin-top: 60px; + background: transparent; + position: relative; + padding: 0 !important; + + #portal-footer { + background: $primary-blue !important; + padding: 80px 0; + + #smartweb-footer, + #smartweb-minisite-footer { + a, + span, + p, + div, + h2 { + color: #fff; + text-decoration: none; + } + + h2 { + font-size: 22px !important; + font-weight: 500; + margin-top: 0; + + &.section-title { + margin-bottom: 0.5rem; + margin-top: 0; + } + } + + .sectiontext { + figure { + max-width: 100%; + + img { + max-width: 100%; + } + } + } + } + } +} + +#portal-footer-wrapper #portal-footer h2.section-title { + margin-bottom: 0.5rem; +} + +.smartweb-footer .body-section figure img { + border-radius: 0 !important; +} + +#portal-footer-wrapper #portal-footer .sectionlinks .container .body-section { + .row { + li { + .table_display { + .table_image { + .image { + position: absolute; + + svg { + fill: #fff; + } + } + + .table_title { + padding-left: 30px !important; + font-size: 1rem !important; + + span { + transition: all 0.5s ease; + } + + &:hover { + span { + opacity: 50%; + transition: all 0.5s ease; + } + } + } + } + } + } + } +} + +#portal-colophon { + background: #000; + padding: 1rem; + + ul { + display: flex; + flex-wrap: wrap; + margin-bottom: 0; + + /*&:nth-last-child(n+1){ + display: block; + }*/ + li { + color: #fff; + + a, + span, + p, + div { + color: #fff; + } + } + } +} + +#portal-footer-wrapper { + li { + padding-left: calc(var(--bs-gutter-x) * 0.5); + } +} + +footer { + .schedule .opening_informations::after { + content: ""; + width: 9px; + height: 6px; + background-image: url('data:image/svg+xml;utf8,'); + background-size: contain; + background-position: center; + background-repeat: no-repeat; + margin-left: 0.4rem; + display: inline-block; + vertical-align: middle; + } + + .sectiontext ul li::before { + display: none !important; + } +} + +#portal-footer-wrapper #portal-footer .sectionlinks .container .body-section { + .row { + li { + .table_display { + .table_image { + text-decoration: none !important; + + .image { + width: 30px; + position: absolute; + + svg { + fill: #fff !important; + } + } + + .table_title { + padding-left: 30px !important; + font-size: 1rem !important; + color: #fff !important; + text-decoration: none !important; + + span { + transition: all 0.5s ease; + } + + &:hover { + span { + opacity: 50%; + transition: all 0.5s ease; + } + } + } + } + } + } + } +} + +#smartweb-subsite-footer { + padding: 0 0 40px; + margin-bottom: 60px; + background: linear-gradient(180deg, #276577 0, #1f4854 400px, #1f4854); + + .sectiontext .section-text .body-section.figure-left figure img { + width: 100px; + } + + .sectiontext .section-text .body-section a, + .sectiontext .section-text .section-title a.collapsed { + color: #fff !important; + } +} + +.smartweb_footer .contact_informations .work, +.smartweb_footer .contact_informations .fax { + padding-left: 0 !important; +} + +.smartweb_footer .address { + margin-bottom: 0.5rem !important; +} diff --git a/villerslaville/src/scss/home/quick.scss b/villerslaville/src/scss/home/quick.scss new file mode 100644 index 00000000..5169c24c --- /dev/null +++ b/villerslaville/src/scss/home/quick.scss @@ -0,0 +1,117 @@ +#main-container { + .quick-access { + margin: -80px 0 0 !important; + } + + .quick-partenaires { + margin: 0 !important; + } +} + +#main-container .quick-access { + margin: 0 0 2rem; + padding: 0; + + @include media-breakpoint-down(lg) { + margin: 0; + } +} + +.quick-access { + .body-section { + li { + .table_image { + .image.d-block { + border-radius: 20px !important; + width: 120px !important; + height: 120px !important; + margin-bottom: 20px !important; + transition: all 0.5s ease; + position: relative; + background: #fff !important; + box-shadow: 0 0 10px rgba(0, 0, 0, 10%) !important; + + svg { + fill: $primary-blue !important; + } + } + + &:hover, + &:focus { + .image.d-block { + transform: translateY(-10px); + transition: all 0.5s ease; + background: $primary-blue !important; + + svg { + fill: #fff !important; + } + } + } + + .table_title { + span { + line-height: 1; + } + } + } + } + } + + .row { + @include media-breakpoint-down(lg) { + grid-gap: 20px; + display: grid; + grid-auto-rows: 1fr; + grid-template-columns: repeat(auto-fit, minmax(150px, 150px)); + + li { + width: auto !important; + } + } + } + + .section-title { + font-weight: 200; + //font-family:$font-family-roboto; + text-transform: uppercase; + color: $primary !important; + margin: 0 0 2rem; + } +} + +.sectionlinks.quick-access .body-section li a { + display: flex; + flex-direction: column; + justify-content: space-evenly; + padding: 10px; +} + +.sectionlinks.quick-access .body-section ul { + max-width: 100%; + margin-left: auto; + margin-right: auto; +} + +.bloc-territoire { + margin: 80px 0 0 !important; + + .section-title { + font-weight: 600; + margin: 0 0 30px; + width: 100%; + text-align: center !important; + color: #000; + font-size: 40px; + text-transform: uppercase; + } +} + +.bloc-carte { + margin: 80px 0 0 !important; + + figure { + max-width: 350px !important; + width: 100%; + } +} diff --git a/villerslaville/src/scss/home/section-en-image.scss b/villerslaville/src/scss/home/section-en-image.scss new file mode 100644 index 00000000..4b0d9361 --- /dev/null +++ b/villerslaville/src/scss/home/section-en-image.scss @@ -0,0 +1,9 @@ +.section-en-image { + padding-top: 4vw; + padding-bottom: 4vw; + + .section-title { + position: relative; + margin-bottom: 2rem; + } +} diff --git a/villerslaville/src/scss/info-trav.scss b/villerslaville/src/scss/info-trav.scss new file mode 100644 index 00000000..4afc282e --- /dev/null +++ b/villerslaville/src/scss/info-trav.scss @@ -0,0 +1,90 @@ +.template-facetednavigation_view.faceted-map { + background-color: #f8f8f8; + + input, + fieldset { + background-color: #fff !important; + } + + .eea-preview-items { + .faceted-map-item { + box-shadow: none !important; + + & > a { + display: block; + background-color: $primary-light; + border-radius: 10px; + padding: 1rem; + + .items-content { + flex-direction: row-reverse; + gap: 20px; + + @media screen and (max-width: 450px) { + flex-direction: column !important; + } + + @media screen and (min-width: 992px) { + &::before { + content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='20' style='fill:%2327606a'/%3E%3Cpath d='M20 19.62a1.92 1.92 0 1 1 .001-3.841A1.92 1.92 0 0 1 20 19.62m0-7.29c-2.97 0-5.37 2.4-5.37 5.37 0 4.03 5.37 9.97 5.37 9.97s5.37-5.94 5.37-9.97c0-2.97-2.4-5.37-5.37-5.37Z' style='fill:%23fff'/%3E%3C/svg%3E"); + display: block; + order: 1; + flex: 100%; + max-width: 40px; + } + } + + .geo-item-text { + padding: 0; + + .geo-item-title { + color: $primary; + } + + .geo-item-description { + color: $primary; + } + } + } + + &:hover { + background-color: $primary-svg; + + .items-content { + .geo-item-text { + .geo-item-title { + color: #000; + } + + .geo-item-description { + color: #000; + } + } + } + } + } + } + } +} + +// filters +#top---default---widgets { + #search_widget { + #search_button { + font-size: 0; + border-left: 0; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: center; + border-color: transparent; + position: absolute; + right: 13px; + width: auto; + } + } +} + +.template-facetednavigation_view .faceted-top-widgets .faceted_select, +.template-facetednavigation_view .faceted-top-widgets input { + border-radius: 5px; +} diff --git a/villerslaville/src/scss/main.scss b/villerslaville/src/scss/main.scss new file mode 100644 index 00000000..318d12d4 --- /dev/null +++ b/villerslaville/src/scss/main.scss @@ -0,0 +1,389 @@ +//// VARIABLES + +// ... add your variables here + +$enable-roboto-webfont: false; + +@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css"); + +//// IMPORTS + +// Import barceloneta files from node_modules --load-path=node_modules + +// @import "@plone/plonetheme-barceloneta-base/scss/barceloneta"; + +// @import "@imiobe/plonetheme-smartweb-base/src/scss/main"; + +@import "./variables"; +//@import "@imiobe/plonetheme-smartweb-base/src/scss/main"; +@import "../../../base/src/scss/main"; + +//// STYLES + +// ... add your styles here +@import "./home/banner"; +@import "./home/quick"; +@import "./home/a-la-une"; +@import "./home/espace-citoyen"; +@import "./home/actualites"; +@import "./home/events"; +@import "./home/footer"; +@import "./home/section-en-image"; +@import "./info-trav"; +@import "./se-link"; +@import "./se-files"; +@import "./contact"; +@import "./home/bulletins"; + +body { + background: linear-gradient(180deg, #f2f2f2 0, #fff 200px, #fff); +} + +#portal-header #portal-header-top { + padding: 15px 0; +} + +//search +#portal-header #portal-header-top #header-links #search-link a { + width: 40px; + height: 40px; + border: 0; + background: #fff; + transition: all 0.3s ease; +} + +#portal-header #portal-header-top #header-links #search-link a:hover { + opacity: 50%; +} + +h1 { + font-weight: 500; + position: relative; + text-align: left; + margin-bottom: 2rem; +} + +.r-item-img.r-item-img-placeholder { + background: url("../../assets/svg/placeholder.jpg"); + background-size: cover; + background-position: center; +} + +//footer +footer { + #container-section-noussuivre { + .table_title { + display: none; + } + + ul.row { + flex-flow: row wrap; + + li { + width: auto; + } + } + } +} + +.sectiontext .section-text .body-section figure figcaption { + display: block; +} + +.portaltype-imio-smartweb-directoryview, +.portaltype-imio-smartweb-newsview, +.portaltype-imio-smartweb-eventsview { + #content > header { + display: none; + } +} + +// bug z-index + +.pagination { + .page-item.active { + z-index: 0; + } +} + +footer #container-section-noussuivre { + li { + svg { + path { + fill: #fff; + } + } + + &:nth-child(1), + &:nth-child(3) { + svg path:nth-child(2) { + fill: #3f3f3f !important; + } + } + } +} + +#portal-breadcrumbs { + background: transparent !important; + + .container, + .breadcrumb { + padding: 5px 0; + } +} + +#portal-globalnav > li a:hover { + color: $primary-svg; +} + +// footer +.footer-logo { + figure img { + width: 250px !important; + } +} + +.footer-slogan { + .text { + max-width: 204px; + text-align: center; + + p { + font-size: 33px; + font-weight: 200; + } + } +} + +.footer-fb { + .table_image { + display: flex; + align-items: center; + justify-content: center; + flex-direction: row-reverse; + gap: 10px; + text-decoration: none; + + .image { + width: auto; + + svg { + height: 25px; + fill: #fff; + } + } + } +} + +.r-filter div[class*="control"] { + border-radius: 5px; +} + +.procedure a::after { + content: "\F135"; + font-family: Bootstrap-icons; + margin-left: 0.5rem; + position: relative; + top: 3px; +} + +// sub-nav + +.subsite-container { + background: #ebebeb; + z-index: 1; + + #subsite-logo { + font-size: 18px; + background: #353535; + + a { + .subsite-title { + color: #fff !important; + } + } + } +} + +.contact_leadimage { + border-radius: 10px; +} + +.sectiontext .section-text .body-section a { + color: $primary; +} + +.sectiontext figure img { + border-radius: 15px; +} + +#viewlet-above-content-body { + .procedure { + display: none; + } +} + +// header common + +.portaltype-imio-smartweb-page, +.portaltype-imio-smartweb-folder, +.portaltype-imio-smartweb-procedure { + #portal-header { + #banner { + width: 100vw; + left: 50%; + position: relative; + transform: translateX(-50%); + border-radius: 0 0 30px 30px; + z-index: -1; + } + } +} + +.breadcrumb-item { + a { + text-decoration: none; + } +} + +.breadcrumb { + font-size: 13px; +} + +.block-menu-element a .card-title.h2, +.block-menu-element a h2.card-title { + font-size: 1rem; +} + +.template-facetednavigation_view.faceted-map + .eea-preview-items + .faceted-map-item + > a { + background: none; +} + +.template-facetednavigation_view.faceted-map + .eea-preview-items + .faceted-map-item + > a:hover { + background-color: #fff; +} + +#portal-header #portal-header-top #header-links .account { + text-decoration: none; +} + +.swiper-pagination-bullet { + background: #a3a3a3 !important; +} + +.swiper-pagination-bullet-active { + background: $primary-blue !important; +} + +.contact_map { + z-index: 0 !important; +} + +.portaltype-imio-smartweb-page + #main-container + .sectionfiles + .section-container + .table_display + .table_image, +.portaltype-imio-smartweb-procedure + #main-container + .sectionfiles + .section-container + .table_display + .table_image { + border: none; + border-radius: 10px; + background: $primary-light; + color: #000; + display: flow-root; + margin-bottom: 0 !important; + padding: 10px 20px; + text-decoration: none; + transition: all 0.25s ease !important; + + &:hover { + background: $primary-blue; + color: #fff; + transition: all 0.25s ease; + } +} + +.portaltype-imio-smartweb-folder #portal-header #banner, +.portaltype-imio-smartweb-page #portal-header #banner, +.portaltype-imio-smartweb-procedure #portal-header #banner { + border-radius: 0; + left: 50%; + position: relative; + transform: translateX(-50%); + width: 100vw; + z-index: -1; + margin-top: 0; +} + +.sectiontext mark { + margin: 10px 0; +} + +#messagesviewlet .portalMessage.info, +#localmessagesviewlet .portalMessage.info { + background-color: $primary-green; + color: #fff; +} + +#messagesviewlet .portalMessage.error, +#localmessagesviewlet .portalMessage.error { + background-color: $primary-green; + color: #fff; +} + +#messagesviewlet .portalMessage.warning, +#localmessagesviewlet .portalMessage.warning { + background-color: $primary-red; + color: #ffff; +} + +#messagesviewlet .portalMessage.info .messagesviewlet-type, +#localmessagesviewlet .portalMessage.info .messagesviewlet-type { + background-color: $primary-green; + color: #fff; +} + +#messagesviewlet .portalMessage.warning .messagesviewlet-type, +#localmessagesviewlet .portalMessage.warning .messagesviewlet-type { + background-color: $primary-red; + color: #fff; +} + +#portal-column-content + .section-contact + .contact-type-organization + .contact_logo { + max-width: 200px; +} + +.section-contact .contact-type-organization .contact_logo { + width: 200px; + height: 200px; + display: block; + background-size: contain; + background-repeat: no-repeat; + background-color: #fff; + border-radius: 10px; +} + +.sectiontext .section-text .body-section.figure-top .text .h2:first-child, +.sectiontext .section-text .body-section.figure-top .text h2:first-child { + margin-top: 0 !important; +} + +.r-search { + .label input { + margin: 0 !important; + } +} diff --git a/villerslaville/src/scss/se-files.scss b/villerslaville/src/scss/se-files.scss new file mode 100644 index 00000000..8fde45e5 --- /dev/null +++ b/villerslaville/src/scss/se-files.scss @@ -0,0 +1,34 @@ +.sectionfiles { + background: transparent !important; +} + +.portaltype-imio-smartweb-page #main-container .sectionfiles, +.portaltype-imio-smartweb-portalpage #main-container .sectionfiles { + .table_image { + background: #f1f1f1; + display: flow-root; + border-radius: 20px; + padding: 10px 20px; + text-decoration: none; + transition: all 0.25s ease !important; + margin-bottom: 0 !important; + + &:hover { + background: $primary-green !important; + transition: all 0.25s ease !important; + } + } + + .section-title { + color: #000 !important; + } + + .image { + width: 200px; + height: 130px; + display: block; + border-radius: 10px; + float: left; + margin-right: 30px; + } +} diff --git a/villerslaville/src/scss/se-link.scss b/villerslaville/src/scss/se-link.scss new file mode 100644 index 00000000..d8be8f05 --- /dev/null +++ b/villerslaville/src/scss/se-link.scss @@ -0,0 +1,83 @@ +.portaltype-imio-smartweb-page #main-container .sectionlinks { + background-color: white; + + .section-container { + .rich_description { + display: none; + } + + & > div { + .section-title { + font-weight: bold; + display: flex; + align-items: center; + gap: 10px; + margin-bottom: 2vw; + font-family: $font-family-base; + + &::before { + content: ""; + background: url("data:image/svg+xml,%3Csvg id='link' xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath id='Path_751' data-name='Path 751' d='M24,0A24,24,0,1,0,48,24,24,24,0,0,0,24,0Zm0,46.4A22.4,22.4,0,1,1,46.4,24,22.4,22.4,0,0,1,24,46.4Zm0,0'/%3E%3Cpath id='Path_752' data-name='Path 752' d='M145.279,126.465a3.971,3.971,0,0,0-2.828,1.171l-4.526,4.526a4.005,4.005,0,0,0-.508,5.034l-.115.115a4.005,4.005,0,0,0-5.034.508l-4.526,4.526A4,4,0,0,0,133.4,148l4.526-4.526a4.005,4.005,0,0,0,.508-5.034l.115-.115a4.005,4.005,0,0,0,5.034-.508l4.526-4.526a4,4,0,0,0-2.829-6.828Zm-8.485,15.879-4.525,4.525a2.458,2.458,0,0,1-3.394,0,2.4,2.4,0,0,1,0-3.394l4.525-4.525a2.372,2.372,0,0,1,2.724-.462l-1.592,1.593a.8.8,0,1,0,1.131,1.131l1.593-1.593A2.4,2.4,0,0,1,136.794,142.344Zm10.182-10.182-4.525,4.525a2.4,2.4,0,0,1-2.725.462l1.593-1.593a.8.8,0,0,0-1.131-1.131l-1.593,1.593a2.4,2.4,0,0,1,.462-2.725l4.525-4.525a2.4,2.4,0,1,1,3.394,3.394Zm0,0' transform='translate(-113.926 -113.818)'/%3E%3C/svg%3E"); + width: 25px; + height: 25px; + display: block; + background-size: contain; + background-repeat: no-repeat; + background-position: center; + } + } + + .body-section { + .row { + flex-direction: row; + list-style-type: none; + gap: 30px 2%; + + li { + padding: 0; + } + + .table_image { + display: flex; + width: 100%; + gap: 20px; + + .image { + width: auto; + + svg { + max-width: 120px; + background-size: contain; + background-repeat: no-repeat; + border: solid 1px rgb(165, 169, 172); + border-radius: 5px; + width: auto; + height: auto; + padding: 1rem; + } + } + + .table_title { + span { + display: flex; + align-items: first baseline; + gap: 10px; + + &::before { + content: ""; + display: block; + width: 10px; + height: 11px; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.25 6.51'%3E%3Cpath d='M3.96 2.55 1.71.29C1.32-.1.68-.1.29.29s-.39 1.03 0 1.42l1.55 1.55L.29 4.81A.996.996 0 0 0 1 6.51c.26 0 .51-.1.71-.29l2.25-2.25a.996.996 0 0 0 0-1.41Z' style='fill:%23ffb81c'/%3E%3C/svg%3E"); + background-size: contain; + background-repeat: no-repeat; + background-position: center; + } + } + } + } + } + } + } + } +} diff --git a/villerslaville/src/scss/variables.scss b/villerslaville/src/scss/variables.scss new file mode 100644 index 00000000..67a1fb0b --- /dev/null +++ b/villerslaville/src/scss/variables.scss @@ -0,0 +1,413 @@ +//*// COLORS + +$primary: #000; +$primary-svg: #000; +$primary-light: #f1f1f1; +$primary-green: #088391; +$primary-blue: #088391; +$primary-red: #fa0d01; +$primary-yellow: #fdd101; + +//*// TYPOGRAPHY + +@import url("https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=SUSE:wght@100..800&display=swap"); + +$font-family-base: "Montserrat", sans-serif; +$font-family-title: "Montserrat", serif; +$font-title-color: #353535; +$font-title-color-light: #fff !default; +$font-title-color-dark: #353535; +$font-title-weight: 600; + +// $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.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; + +// Include Roboto as webfont + +//*// GLOBAL + +@function url-encoded-color($color) { + @return "%23" + str-slice("#{$color}", 2, -1); +} +$container-max-widths: ( + sm: 100%, + md: 100%, + lg: 960px, + xl: 1140px, + xxl: 1320px, +); +$global-radius: 15px; +$enable-title-uppercase: false !default; +$home-section-title-size: 40px; +$home-section-title-margin: 0 0 2rem 0 !default; +$home-section-title-padding: 0 !default; +$home-section-title-align: center !default; +$section-padding-top: 0 !default; +$to-portal-link-color: #282828 !default; +$img-placeholder: #f2f2f2 !default; + +//swiper +$swiper-icon-color: #fff !default; +$swiper-button-height: 45px !default; +$swiper-button-width: 45px !default; +$swiper-button-top: 26% !default; +$swiper-prev-icon: url('data:image/svg+xml;utf8,') !default; +$swiper-next-icon: url('data:image/svg+xml;utf8,') !default; +$swiper-background-size: 50% !default; +$swiper-background-color: #000; +$swiper-raduis: 50px !default; +$swipper-bullet-color: #fff; + +//*// HEADER +$main-logo-max-width: 180px; +$header-top-padding: 0.7rem 0 0.7rem 0; +$header-top-background: $primary-blue; +$header-center-nav: false !default; +$header-nav-margin: 0 1rem 0 1rem !default; +$header-nav-link-color: #fff; +$header-nav-link-font-size: 16px; +$header-nav-link-font-family: $font-family-base; +$header-links-color: #fff; +$header-links-account-margin: 0 !default; +$header-links-account-padding: 0 !default; +$header-links-account-border: solid 0 #fff !default; +$header-links-account-bg: transparent !default; +$header-links-account-hover-border: solid 0 #fff !default; +$header-links-account-hover-bg: transparent !default; +$header-links-account-hover-color: $primary-svg; +$header-search-icon-color: $primary-blue; +$header-search-icon: url('data:image/svg+xml;utf8,') !default; +$toggler-color: $primary; +$header-toggler-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='#{url-encoded-color($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; + +// sitenav +$navbar-padding-x: 2.5rem !default; +$nav-mask-background: rgb(15 11 11 / 76%) !default; +$nav-title-font-family: $font-family-title; +$nav-link-color: #fff; +$nav-link-open-color: #fff; +$nav-link-active-color: $primary-svg; +$nav-link-font-size: initial !default; +$nav-link-font-weight: 500 !default; +$nav-link-drop-color: #fff; +$nav-link-drop: url('data:image/svg+xml;utf8,') !default; +$nav-link-drop-color-mobile: $primary-svg; +$nav-link-drop-mobile: url('data:image/svg+xml;utf8,') !default; +$nav-first-level-gap: 30px !default; +$nav-first-level-uppercase: false; +$nav-quick-link-color: $primary-blue; +$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; +$nav-overlay-title-color: $primary-blue !default; +$nav-overlay-title-font-size: 24px !default; +$nav-overlay-title-font-weight: bold !default; +$nav-overlay-next-color-hover: $primary-blue; +$nav-overlay-next-icon-color: #000; +$nav-overlay-next-icon-hover-color: $primary-blue; +$nav-overlay-next-icon: url('data:image/svg+xml;utf8,') !default; +$nav-overlay-next-icon-hover: url('data:image/svg+xml;utf8,') !default; + +//sub-header +$subsite-logo-background: $primary-light; +$subsite-logo-color: $primary; +$subsite-navbar-bg: #fff !default; + +//sub-sitenav +$sub-navbar-padding: 1rem 0 !default; +$sub-nav-link-color: #030720 !default; +$sub-nav-link-open-color: #030720 !default; +$sub-nav-link-drop-color: #030720 !default; +$sub-nav-link-drop: url('data:image/svg+xml;utf8,') !default; + +//*// SECTION HOMEPAGE + +// banner +$banner-enable-full-width: true !default; +$banner-heigh: 500px !default; +$banner-content-width: max-content !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; +$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 1.5rem 0.9rem 1.5rem; +$see-all-margin: 2rem 0 0 0 !default; +$see-all-bg: $primary-green; +$see-all-color: #000; +$see-all-radius: 10px; +$see-all-border: solid 1px $primary-green; +$see-all-text-transform: none; +$see-all-font-size: 14px !default; +$see-all-font-weight: 400; +$see-all-transition: all 0.2s ease !default; +$see-all-hover-bg: #fff; +$see-all-hover-color: #000; +$see-all-hover-radius: 10px; +$see-all-hover-border: solid 1px #000 !important; +$see-all-justify-content: center; +$see-all-underline-color: transparent; +$see-all-underline-width: 0; +$see-all-hover-underline-width: 0; + +// Quick access +$quick-access-section-full-width: false !default; +$quick-access-title-color: $primary; + +//$quick-access-title-margin:0; +$quick-access-title-padding: $home-section-title-padding !default; +$quick-access-title-align: center !default; +$quick-access-container-padding: 1rem 0 0 0 !default; +$quick-access-width: 70px; +$quick-access-height: 70px; +$quick-access-background: $primary-svg; +$quick-access-border: solid 0 $primary; +$quick-access-border-radius: 50%; +$quick-access-shadow: none !default; +$quick-access-svg-width: 40px; +$quick-access-svg-color: $primary; +$quick-access-item-title-margin: 0 0 1rem 0; +$quick-access-title-font-size: 15px; +$quick-access-title-color: #000; +$quick-access-title-text-transform: uppercase; +$quick-access-title-weight: 500; +$quick-access-title-font-family: $font-family-base; +$quick-access-enable-full-bg: false !default; +$quick-access-full-bg-color: $primary !default; +$quick-access-full-bg-border: solid 1px green !default; +$quick-access-full-bg-shadow: none; + +// A la une +$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: 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: 16px !default; +$a-la-une-item-title-margin: 0 !default; +$a-la-une-item-title-padding: 0 20px 20px 20px !default; +$a-la-une-item-title-radius: 0 !default; +$a-la-une-item-description-font-size: $font-size-lg !default; +$a-la-une-item-description-color: initial !default; +$a-la-une-item-description-margin: 0 !default; +$a-la-une-item-description-padding: 0 0 !default; +$a-la-une-item-description-radius: 0 !default; +$a-la-une-item-image-radius: 20px !important; + +// Actu +$actu-section-full-width: true !default; +$actu-section-padding-top: 6rem; +$actu-section-padding-bottom: 6rem; +$actu-section-margin: 0 !default; +$actu-title-color: $font-title-color; +$actu-title-align: right; +$actu-title-margin: $home-section-title-margin !default; +$actu-title-padding: $home-section-title-padding !default; +$actu-image-margin-bottom: 0 !default; +$actu-image-border-radius: 20px 20px 0 0; +$actu-item-bg-color: #fff; +$actu-item-bg-radius: 30px 30px 20px 20px; +$actu-category-margin: 20px 0 0 20px !default; +$actu-category-padding: 0.2rem 0.5rem; +$actu-category-color: #fff; +$actu-category-bg-color: $primary-blue; +$actu-category-text-transform: initial; +$actu-category-font-size: 12px; +$actu-category-font-weight: initial !default; +$actu-category-radius: 5px; +$actu-item-title-margin: 0 0 0 0 !default; +$actu-item-title-padding: 0 20px 20px 20px; +$actu-item-title-color: #000; +$actu-item-title-text-transform: initial !default; +$actu-item-title-font-size: 16px; +$actu-item-title-font-weight: 500; +$actu-item-title-align: left; +$actu-item-description-margin: 0 0 0.5rem 0 !default; +$actu-item-description-padding: 0 20px 20px 20px; +$actu-item-description-color: #000; +$actu-item-description-align: left; +$actu-item-description-font-family: $font-family-base !default; +$actu-date-margin: 1rem 0 0.5rem 0 !default; +$actu-date-padding: 0 20px 0 20px; +$actu-date-color: #000; +$actu-date-font-size: 12px; +$actu-date-align: right; +$actu-see-all-justify-content: $see-all-justify-content !default; + +// Event +$event-section-full-width: true !default; +$event-section-padding-top: 6rem; +$event-section-padding-bottom: 6rem; +$event-section-margin: 0 !default; +$event-title-color: $font-title-color; +$event-title-align: left; +$event-title-margin: $home-section-title-margin !default; +$event-title-padding: $home-section-title-padding !default; +$event-image-margin-bottom: 0 !default; +$event-image-border-radius: 20px 20px 0 0; +$event-item-bg-color: #f6f6f6; +$event-item-bg-radius: 30px 30px 20px 20px; +$event-category-margin: 20px 0 0 20px !default; +$event-category-padding: 0.2rem 0.5rem; +$event-category-color: #fff; +$event-category-bg-color: $primary-blue; +$event-category-text-transform: initial; +$event-category-font-size: 12px; +$event-category-font-weight: initial !default; +$event-category-radius: 5px; +$event-item-title-margin: 0 0 0 0 !default; +$event-item-title-padding: 0 20px 20px 20px; +$event-item-title-color: #000; +$event-item-title-text-transform: initial !default; +$event-item-title-font-size: 16px; +$event-item-title-font-weight: 500; +$event-item-title-align: left; +$event-item-description-margin: 0 0 0.5rem 0 !default; +$event-item-description-padding: 0 20px 20px 20px; +$event-item-description-color: #000; +$event-item-description-align: left; +$event-item-description-font-family: $font-family-base !default; +$event-date-margin: 1rem 0 0.5rem 0 !default; +$event-date-padding: 0 20px 0 20px; +$event-date-color: #000; +$event-date-font-size: 12px; +$event-date-align: right; +$event-see-all-justify-content: $see-all-justify-content !default; + +// Album +$album-section-full-width: true !default; +$album-section-bg: #edeae5 !default; +$album-section-padding-top: 2rem !default; +$album-section-padding-bottom: 2rem !default; +$album-section-margin: 0 !default; +$album-title-color: $primary !default; +$album-title-align: $home-section-title-align !default; +$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: 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; +$album-category-color: $primary !default; +$album-category-bg-color: #030720 !default; +$album-category-text-transform: uppercase !default; +$album-category-font-size: 14px !default; +$album-category-font-weight: initial !default; +$album-category-radius: $global-radius !default; +$album-item-title-margin: 1rem 0 !default; +$album-item-title-padding: 0 !default; +$album-item-title-color: initial !default; +$album-item-title-text-transform: initial !default; +$album-item-title-font-size: $h3-font-size !default; +$album-item-title-font-weight: initial !default; +$album-date-margin: 0 !default; +$album-date-padding: 0 !default; +$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; +$mark-background-color: $primary-green !default; +$mark-color: #000; +$mark-padding: 20px 45px 20px 26px !default; +$mark-border: solid 0 $primary !default; +$mark-radius: $global-radius !default; +$mark-weight: 500 !default; +$list-style-color: $primary !default; +$list-style-custom: url('data:image/svg+xml;utf8,') !default; +$section-text-h2-margin-top: 2rem !default; +$section-text-h2-margin-bottom: 1.5rem !default; +$section-text-h3-margin-top: 0 !default; +$section-text-h3-margin-bottom: 0.5rem !default; +$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, + md: 4rem, + lg: 4.3rem, +); + +// section-contact +$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-portrait-ration: calc(4 / 5); +$section-contact-background: #f3f3f3 !default; + +// section-files +$section-file-background-color: $primary-svg; +$enable-full-width-section-files: false; +$enable-light-color-section-files: false; + +// section-link +$section-link-background-color: transparent; +$enable-full-width-section-link: true; +$enable-light-color-section-link: false; + +// section-list-block-img +$section-list-block-img-card-title: 1.25rem; + +//*// LIST + +//Liste Block +$block-full-shadow: 0 20px 40px #030720; +$block-small-shadow: rgba(0, 0, 0, 16%) 0 1px 4px; +$list-group-border-width: 0; +$list-group-item-padding-x: 0; + +// Message Viewlets + +$message-info: #27789c; +$message-warning: #c06d01; +$message-error: #ae2609; + +//SEE ALL +$see-all-font-family: $font-family-base; + +:root { + --bs-card-spacer-x: 1rem; + --bs-card-spacer-y: 1rem; +}