diff --git a/public/css/fonts.css b/public/css/fonts.css index 6e3a00d..48818ce 100644 --- a/public/css/fonts.css +++ b/public/css/fonts.css @@ -1,168 +1,161 @@ @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-thin.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-thin.woff') format('woff'), - url('/public/fonts/Poppins/poppins-thin.otf') format('otf'); + url('/public/fonts/Poppins/poppins-thin.woff') format('woff'), + url('/public/fonts/Poppins/poppins-thin.otf') format('otf'); font-weight: 100; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-thin-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-thin-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-thin-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-thin-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-thin-italic.otf') format('otf'); font-weight: 100; font-style: italic; - } - +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-extralight.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-extralight.woff') format('woff'), - url('/public/fonts/Poppins/poppins-extralight.otf') format('otf'); + url('/public/fonts/Poppins/poppins-extralight.woff') format('woff'), + url('/public/fonts/Poppins/poppins-extralight.otf') format('otf'); font-weight: 200; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-extralight-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-extralight-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-extralight-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-extralight-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-extralight-italic.otf') format('otf'); font-weight: 200; font-style: italic; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-light.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-light.woff') format('woff'), - url('/public/fonts/Poppins/poppins-light.otf') format('otf'); + url('/public/fonts/Poppins/poppins-light.woff') format('woff'), + url('/public/fonts/Poppins/poppins-light.otf') format('otf'); font-weight: 300; font-style: normal; - } - +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-light-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-light-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-light-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-light-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-light-italic.otf') format('otf'); font-weight: 300; font-style: italic; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-regular.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-regular.woff') format('woff'), - url('/public/fonts/Poppins/poppins-regular.otf') format('otf'); + url('/public/fonts/Poppins/poppins-regular.woff') format('woff'), + url('/public/fonts/Poppins/poppins-regular.otf') format('otf'); font-weight: 400; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-regular-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-regular-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-regular-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-regular-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-regular-italic.otf') format('otf'); font-weight: 400; font-style: italic; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-medium.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-medium.woff') format('woff'), - url('/public/fonts/Poppins/poppins-medium.otf') format('otf'); + url('/public/fonts/Poppins/poppins-medium.woff') format('woff'), + url('/public/fonts/Poppins/poppins-medium.otf') format('otf'); font-weight: 500; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-medium-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-medium-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-medium-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-medium-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-medium-italic.otf') format('otf'); font-weight: 500; font-style: italic; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-semibold.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-semibold.woff') format('woff'), - url('/public/fonts/Poppins/poppins-semibold.otf') format('otf'); + url('/public/fonts/Poppins/poppins-semibold.woff') format('woff'), + url('/public/fonts/Poppins/poppins-semibold.otf') format('otf'); font-weight: 600; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-semibold-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-semibold-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-semibold-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-semibold-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-semibold-italic.otf') format('otf'); font-weight: 600; font-style: italic; - } @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-bold.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-bold.woff') format('woff'), - url('/public/fonts/Poppins/poppins-bold.otf') format('otf'); + url('/public/fonts/Poppins/poppins-bold.woff') format('woff'), + url('/public/fonts/Poppins/poppins-bold.otf') format('otf'); font-weight: 700; font-style: normal; - } @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-bold-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-bold-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-bold-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-bold-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-bold-italic.otf') format('otf'); font-weight: 700; font-style: italic; - } @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-extrabold.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-extrabold.woff') format('woff'), - url('/public/fonts/Poppins/poppins-extrabold.otf') format('otf'); + url('/public/fonts/Poppins/poppins-extrabold.woff') format('woff'), + url('/public/fonts/Poppins/poppins-extrabold.otf') format('otf'); font-weight: 800; font-style: normal; - } - @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-extrabold-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-extrabold-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-extrabold-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-extrabold-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-extrabold-italic.otf') format('otf'); font-weight: 800; font-style: italic; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-black.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-black.woff') format('woff'), - url('/public/fonts/Poppins/poppins-black.otf') format('otf'); + url('/public/fonts/Poppins/poppins-black.woff') format('woff'), + url('/public/fonts/Poppins/poppins-black.otf') format('otf'); font-weight: 900; font-style: normal; - } +} @font-face { font-family: "Poppins"; src: url('/public/fonts/Poppins/poppins-black-italic.woff2') format('woff2'), - url('/public/fonts/Poppins/poppins-black-italic.woff') format('woff'), - url('/public/fonts/Poppins/poppins-black-italic.otf') format('otf'); + url('/public/fonts/Poppins/poppins-black-italic.woff') format('woff'), + url('/public/fonts/Poppins/poppins-black-italic.otf') format('otf'); font-weight: 900; font-style: italic; - } +} \ No newline at end of file diff --git a/public/css/general.css b/public/css/general.css index 8474153..c933b55 100644 --- a/public/css/general.css +++ b/public/css/general.css @@ -1,35 +1,74 @@ -.header { - width: 100%; - } +html { + box-sizing: border-box; +} -.headerMenu { - font-family: "Poppins"; - font-weight: 400; /*regular*/ - font-size: 1.25rem; /*20px*/ - color: #000; /*Noir pur*/ - display: flex; - flex-flow: row; - justify-content: space-around; - align-items: center; - } +*, +*:before, +*:after { + box-sizing: inherit; +} -.headerMenuElement:hover { - border-bottom: 5px #FF563C solid; /*Orange Highlight*/ - cursor: pointer; - } +img { + max-width: 100%; +} + +body { + margin: 0; + padding-top: 60px; +} + +ul { + margin: 0; +} + +.wrapper { + max-width: 375px; + width: calc(100% - var(5px)); + margin: 0 auto; +} .heading1 { font-family: "Poppins"; - font-weight: 600; /*semi-bold*/ - font-size: 6rem; /*96px*/ - color: #394596; /*Bleu AGECEM*/ + font-weight: 600; + /*semi-bold*/ + font-size: 3rem; + /*48px*/ + color: #394596; + /*Bleu AGECEM*/ text-align: center; - } +} .heading2 { font-family: "Poppins"; - font-weight: 600; /*semi-bold*/ - font-size: 1.5rem; /*24px*/ - color: #394596; /*Bleu AGECEM*/ + font-weight: 300; + /*light*/ + font-size: 1rem; + /*16px*/ + color: #394596; + /*Bleu AGECEM*/ text-align: center; - } \ No newline at end of file +} + +@media screen and (min-width: 768px) { + .wrapper { + max-width: 768px; + width: calc(100% - var(15px)); + } + + .heading1 { + font-size: 4rem; + /*64px*/ + } + + .heading2 { + font-size: 1.5rem; + /*24px*/ + } +} + +@media screen and (min-width: 1140px) { + .wrapper { + max-width: 1140px; + width: calc(100% - var(30px)); + } +} \ No newline at end of file diff --git a/public/css/header.css b/public/css/header.css new file mode 100644 index 0000000..7521bc2 --- /dev/null +++ b/public/css/header.css @@ -0,0 +1,107 @@ +.header { + position: fixed; + z-index: 20; + width: 100%; + top: 0; + background-color: #fff; + height: 60px; +} + +.headerWrapper { + display: flex; + flex-flow: row; + align-items: center; + justify-content: space-between; + padding: 5px; +} + +a { + color: #000; + text-decoration: none; +} + +a:visited { + color: #000; + text-decoration: none; +} + +.headerMenu { + background-color: #fff; + font-family: "Poppins"; + font-weight: 400; + /*regular*/ + font-size: 1.25rem; + /*20px*/ + list-style: none; + display: none; + width: 100%; +} + +.headerMenuElement { + padding-bottom: 5px; + margin: 0; +} + +.headerMenuElement:hover { + border-bottom: 5px #FF563C solid; + /*Orange Highlight*/ + cursor: pointer; + padding-bottom: 0; +} + +.headerMenuHamburger { + height: 50px; + width: 50px; + cursor: pointer; +} + +.headerMenuMobile { + font-family: "Poppins"; + font-weight: 400; + /*regular*/ + font-size: 2rem; + /*32px*/ + list-style: none; + display: none; +} + +.nav-is-active { + background-color: #fff; + display: flex; + flex-flow: column; + justify-content: center; + align-items: center; + text-align: left; + position: fixed; + top: 75px; + width: 100%; + height: 90%; + margin: 0; + padding: auto; +} + +/* Le header s'affiche en menu hamburger pour les breakpoints téléphone et tablette */ +@media screen and (min-width: 778px) { + .nav-is-active { + font-size: 2rem; + /*32px*/ + } +} + +/* Les éléments du header s'affichent pour le breakpoint ordinateur */ +@media screen and (min-width: 1140px) { + .headerMenu { + display: flex; + flex-flow: row; + justify-content: space-around; + align-items: center; + } + + .headerMenuHamburger { + display: none; + } + + .nav-is-active { + display: none; + } +} \ No newline at end of file diff --git a/public/icones/agecem-logo.svg b/public/icones/agecem-logo.svg new file mode 100644 index 0000000..f6bc9ee --- /dev/null +++ b/public/icones/agecem-logo.svg @@ -0,0 +1,9 @@ + diff --git a/public/icones/hamburger-menu.svg b/public/icones/hamburger-menu.svg new file mode 100644 index 0000000..2fc43ca --- /dev/null +++ b/public/icones/hamburger-menu.svg @@ -0,0 +1,10 @@ + diff --git a/public/js/header.js b/public/js/header.js new file mode 100644 index 0000000..e69de29 diff --git a/public/public.go b/public/public.go index 524b521..585aafd 100644 --- a/public/public.go +++ b/public/public.go @@ -10,7 +10,7 @@ package public import "embed" -//go:embed css/*.css js/*.js fonts/* +//go:embed css/*.css js/*.js fonts/* icones/* var publicFS embed.FS func GetPublicFS() embed.FS { diff --git a/templates/html/admin-upload.gohtml b/templates/html/admin-upload.gohtml index 9200b03..c7afd53 100644 --- a/templates/html/admin-upload.gohtml +++ b/templates/html/admin-upload.gohtml @@ -1,17 +1,16 @@ {{ define "admin-upload-html" }} - - -
- -{{ .Message }}
- - + +{{ .Message }}
+ + {{ end }} diff --git a/templates/html/admin.gohtml b/templates/html/admin.gohtml index 8308583..edcf8c4 100644 --- a/templates/html/admin.gohtml +++ b/templates/html/admin.gohtml @@ -1,17 +1,17 @@ {{ define "admin-html" }} - - - - -- {{ range . }} + + +
+ +
+ {{ range . }}
{{ $bucket_name := .Name }}
{{ $bucket_display_name := .DisplayName }}