mirror of
https://github.com/MathiasDPX/grainParisArt.git
synced 2025-05-10 07:33:05 +00:00
Push public
This commit is contained in:
Solène
commit
ea9f4d79b0
35 changed files with 3293 additions and 0 deletions
BIN
static/.DS_Store
vendored
Normal file
BIN
static/.DS_Store
vendored
Normal file
Binary file not shown.
519
static/css/main.css
Normal file
519
static/css/main.css
Normal file
|
|
@ -0,0 +1,519 @@
|
|||
@font-face {
|
||||
font-family: 'healTheWebA';
|
||||
src: url("../font/HealTheWebA-Regular.otf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'healTheWebB';
|
||||
src: url("../font/HealTheWebB-Regular.otf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Raleway-Black';
|
||||
src: url("../font/Raleway-Black.ttf");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Montserrat-ExtraBold';
|
||||
src: url("../font/montserrat_extrabold.ttf");
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'healTheWebA', sans-serif;
|
||||
}
|
||||
|
||||
h1 h2 h3 {
|
||||
font-family: 'healTheWebB', sans-serif;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.background_svg {
|
||||
position: fixed;
|
||||
top: -30%;
|
||||
left: -10%;
|
||||
z-index: -2;
|
||||
width: 150vw;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 20;
|
||||
font-family: 'healTheWebA', sans-serif;
|
||||
}
|
||||
|
||||
.divHeader {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#map {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
height: 500px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.custom-marker {
|
||||
background-color: #444cf7;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* 444cf7 */
|
||||
|
||||
.container_titrePlanning,
|
||||
.container_infoFilm {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-image: linear-gradient(90deg, rgba(68, 76, 247, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(2, 0, 36, 1) 100%);
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.container_titrePlanning {
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.affiche {
|
||||
width: 200px;
|
||||
height: 288px;
|
||||
border-radius: 5px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
.container_infoFilm {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.blur-background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
backdrop-filter: blur(20px);
|
||||
z-index: -1;
|
||||
border-radius: 20px;
|
||||
filter: drop-shadow(0 -6mm 4mm rgba(2, 2, 2, 0.2));
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
}
|
||||
|
||||
.info-content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.realisateur,
|
||||
.duree,
|
||||
.casting,
|
||||
.genre {
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-radius: 10px;
|
||||
width: 80px;
|
||||
height: 100px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.date-selectionne {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: #444cf7;
|
||||
color: white;
|
||||
border-radius: 10px;
|
||||
width: 80px;
|
||||
height: 100px;
|
||||
justify-content: center;
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
}
|
||||
|
||||
.mois {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.calendrier {
|
||||
width: 600px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.chiffre {
|
||||
font-family: 'Montserrat-ExtraBold';
|
||||
font-size: 42px;
|
||||
margin-top: -20px;
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.duree {
|
||||
margin-bottom: 45px;
|
||||
}
|
||||
|
||||
.cinema {
|
||||
background-color: #444cf7;
|
||||
border-radius: 5px;
|
||||
height: 40px;
|
||||
width: 200px;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
.horaire_container {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.seance_container {
|
||||
margin-right: 10%;
|
||||
margin-left: 10%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.horaires_container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
max-width: 80% - 200px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.horaire {
|
||||
background-color: white;
|
||||
border-radius: 5px;
|
||||
height: 40px;
|
||||
width: 100px;
|
||||
color: #444cf7;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 10px;
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.container_footer {
|
||||
margin-right: 10%;
|
||||
margin-left: 10%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.contenu_edt {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.txt_edt {
|
||||
position: relative;
|
||||
top: 50px;
|
||||
}
|
||||
|
||||
.synopsis_container {
|
||||
max-width: 800px;
|
||||
margin-right: 10%;
|
||||
}
|
||||
|
||||
.synopsis {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.date:hover {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background-color: #444cf7;
|
||||
color: white;
|
||||
border-radius: 10px;
|
||||
width: 80px;
|
||||
height: 100px;
|
||||
justify-content: center;
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
|
||||
#loader {
|
||||
min-width: 100vw;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#loader div.box {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
position: relative;
|
||||
margin: 0 1rem 0 1rem;
|
||||
}
|
||||
|
||||
#loader div.box::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
background: #444cf7;
|
||||
height: 3rem;
|
||||
;
|
||||
width: 3rem;
|
||||
border-radius: 50%;
|
||||
animation: move 1s ease alternate infinite;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#loader div.box:nth-child(2)::after {
|
||||
animation-delay: 0.25s;
|
||||
}
|
||||
|
||||
#loader div.box:nth-child(3)::after {
|
||||
animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
0% {
|
||||
bottom: -1.5rem;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
bottom: 1.5rem;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.goTop {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background-color: #444cf7;
|
||||
border: #fff solid 5px;
|
||||
border-radius: 50%;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.2));
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.responsive-div {
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.responsive-petite-div {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
.contenu_edt {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
#map {
|
||||
max-width: 100vw;
|
||||
height: 400px;
|
||||
/* width: 350px; */
|
||||
border-radius: 5px;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.divHeader {
|
||||
flex-direction: column;
|
||||
max-width: 80vw;
|
||||
}
|
||||
h1 {
|
||||
margin-block-start: 15px;
|
||||
margin-block-end: 0;
|
||||
}
|
||||
p{
|
||||
font-size: 12px;
|
||||
margin-block-start: -5px;
|
||||
}
|
||||
.date {
|
||||
width: 40px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.date-selectionne {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.mois {
|
||||
margin-bottom: 20px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.calendrier {
|
||||
max-width: 80vw;
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
.chiffre {
|
||||
font-size: 20px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.jour {
|
||||
display: none;
|
||||
}
|
||||
.txt_edt {
|
||||
display: none;
|
||||
}
|
||||
.line {
|
||||
max-width: 80vw;
|
||||
width: 350px;
|
||||
}
|
||||
.affiche {
|
||||
width: 100px;
|
||||
height: 144px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
.titreFilm{
|
||||
font-size: 18px;
|
||||
margin-block-start: 5px;
|
||||
margin-block-end: 5px;
|
||||
}
|
||||
.realisateur,
|
||||
.duree,
|
||||
.casting,
|
||||
.genre {
|
||||
margin-block-start: 0;
|
||||
margin-block-end: 0;
|
||||
font-size: 10px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.synopsis{
|
||||
display: none;
|
||||
}
|
||||
.cinema {
|
||||
height: 30px;
|
||||
width: 100px;
|
||||
color: white;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.horaires_container {
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.horaire {
|
||||
height: 30px;
|
||||
width: 45px;
|
||||
border-radius: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.cinema p,
|
||||
.horaire p{
|
||||
font-size: 10px;
|
||||
margin-block-start: 1em;
|
||||
}
|
||||
.container_titrePlanning,
|
||||
.container_infoFilm {
|
||||
max-width: 80vw;
|
||||
width: 350px;
|
||||
}
|
||||
.responsive-div {
|
||||
height: 30px;
|
||||
}
|
||||
.responsive-petite-div {
|
||||
height: 5px;
|
||||
}
|
||||
.goTop {
|
||||
z-index: 2;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background-color: #444cf7;
|
||||
border: #fff solid 4px;
|
||||
}
|
||||
.goTop p{
|
||||
font-size: 20px;
|
||||
margin-block-start: 1em;
|
||||
margin-block-end: 1em;
|
||||
}
|
||||
.background_svg {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
top: auto;
|
||||
right: 0;
|
||||
z-index: -2;
|
||||
transform: scale(2);
|
||||
}
|
||||
.blur-background {
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
backdrop-filter: blur(20px);
|
||||
z-index: -1;
|
||||
border-radius: 5px;
|
||||
filter: drop-shadow(0 -6mm 4mm rgba(2, 2, 2, 0.2));
|
||||
filter: drop-shadow(2mm 6mm 6mm rgba(2, 2, 2, 0.4));
|
||||
}
|
||||
footer {
|
||||
background-color: white;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.container_footer {
|
||||
max-width: 80vw;
|
||||
}
|
||||
.container_footer p{
|
||||
font-size: 10px;
|
||||
}
|
||||
*:not(.affiche) {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.date:hover {
|
||||
width: 40px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
0
static/firebase/firebase_grainParisArt.json
Normal file
0
static/firebase/firebase_grainParisArt.json
Normal file
BIN
static/font/HealTheWebA-Regular.otf
Normal file
BIN
static/font/HealTheWebA-Regular.otf
Normal file
Binary file not shown.
BIN
static/font/HealTheWebB-Regular.otf
Normal file
BIN
static/font/HealTheWebB-Regular.otf
Normal file
Binary file not shown.
BIN
static/font/Raleway-Black.ttf
Normal file
BIN
static/font/Raleway-Black.ttf
Normal file
Binary file not shown.
BIN
static/font/montserrat_extrabold.ttf
Normal file
BIN
static/font/montserrat_extrabold.ttf
Normal file
Binary file not shown.
BIN
static/images/LaurenceAnyways.jpg
Normal file
BIN
static/images/LaurenceAnyways.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 691 KiB |
BIN
static/images/aftersun.jpeg
Normal file
BIN
static/images/aftersun.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 708 KiB |
BIN
static/images/background.png
Normal file
BIN
static/images/background.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 MiB |
31
static/images/background.svg
Normal file
31
static/images/background.svg
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
<svg class="background_svg" viewBox="0 0 1000 1000" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<filter id="b" x="-500" y="-500" width="2000" height="2000" filterUnits="userSpaceOnUse">
|
||||
<feGaussianBlur in="SourceGraphic" stdDeviation="50" />
|
||||
</filter>
|
||||
<filter id="a" x="-500" y="-500" width="2000" height="2000" filterUnits="userSpaceOnUse">
|
||||
<feFlood flood-color="#fff" result="neutral-gray" />
|
||||
<feTurbulence type="fractalNoise" baseFrequency="2.5" numOctaves="100" stitchTiles="stitch"
|
||||
result="noise" />
|
||||
<feColorMatrix in="noise" type="saturate" values="0" result="destaturatedNoise" />
|
||||
<feComponentTransfer in="desaturatedNoise" result="theNoise">
|
||||
<feFuncA type="table" tableValues="0 0 0.1 0" />
|
||||
</feComponentTransfer>
|
||||
<feBlend in="SourceGraphic" in2="theNoise" mode="soft-light" result="noisy-image" />
|
||||
</filter>
|
||||
<radialGradient id="c" cx="50%" cy="50%" r="50%" fx="20%" fy="40%">
|
||||
<stop offset="0%" stop-color="#444cf7" />
|
||||
<stop offset="100%" stop-color="rgba(194,68,247,0.2)" />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<rect width="100%" height="100%" fill="#fff" />
|
||||
<g filter="url(#a)">
|
||||
<g filter="url(#b)">
|
||||
<svg width="800" height="800" viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg"
|
||||
transform="translate(140.997 117.996)">
|
||||
<path fill="url(#c)"
|
||||
d="M993.5 849.5Q888 1099 622 1061T226.5 811.5Q97 600 220 377t362.5-192q239.5 31 378 223t33 441.5Z" />
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
BIN
static/images/favicon.png
Normal file
BIN
static/images/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
BIN
static/images/julieEn12Chapitre.webp
Normal file
BIN
static/images/julieEn12Chapitre.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
BIN
static/images/old.png
Normal file
BIN
static/images/old.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 974 KiB |
32
static/js/infinite-scroll.js
Normal file
32
static/js/infinite-scroll.js
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
var isLoading = false;
|
||||
var page = 1;
|
||||
|
||||
function fetchCinemaSessions() {
|
||||
if (isLoading) return;
|
||||
|
||||
isLoading = true;
|
||||
var loadingContainer = document.getElementById('loading-container');
|
||||
loadingContainer.innerHTML = '<img src="{{ url_for("static", filename="loading.gif") }}" alt="Loading...">';
|
||||
|
||||
fetch('/?page=' + page)
|
||||
.then(function(response) {
|
||||
return response.text();
|
||||
})
|
||||
.then(function(html) {
|
||||
var cinemaContainer = document.getElementById('cinema-container');
|
||||
cinemaContainer.insertAdjacentHTML('beforeend', html);
|
||||
isLoading = false;
|
||||
page += 1;
|
||||
})
|
||||
.catch(function() {
|
||||
isLoading = false;
|
||||
});
|
||||
}
|
||||
|
||||
window.addEventListener('scroll', function() {
|
||||
if (window.innerHeight + window.scrollY >= document.body.offsetHeight - 100 && !isLoading) {
|
||||
fetchCinemaSessions();
|
||||
}
|
||||
});
|
||||
|
||||
fetchCinemaSessions();
|
||||
Loading…
Add table
Add a link
Reference in a new issue