Calendar changes
This commit is contained in:
parent
427e9e44ec
commit
d973410c0d
1 changed files with 85 additions and 18 deletions
|
|
@ -80,7 +80,7 @@ a:visited {
|
|||
|
||||
@media only screen and (max-width: 480px) {
|
||||
html, body {
|
||||
font-size: 16px;
|
||||
font-size: 12px;
|
||||
line-height: 160%;
|
||||
}
|
||||
}
|
||||
|
|
@ -191,7 +191,7 @@ section:nth-child(2) {
|
|||
background-color: #fbfbfb;
|
||||
background-image: url(../img/theme/paint/paint-yellow.svg) , url(../img/theme/elements/chenille.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:auto, 50%;
|
||||
background-size:auto, 60%;
|
||||
background-position: 0% 100%, 0% 0%;
|
||||
|
||||
}
|
||||
|
|
@ -199,7 +199,7 @@ section:nth-child(3) {
|
|||
background-color: #fbfbfb;
|
||||
background-image: url(../img/theme/paint/paint-orange.svg), url(../img/theme/elements/cocon.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:auto, 50%;
|
||||
background-size:auto, 60%;
|
||||
background-position: 0% 100%, top right;
|
||||
}
|
||||
|
||||
|
|
@ -207,7 +207,7 @@ section:nth-child(4) {
|
|||
background-color: #fbfbfb;
|
||||
background-image: url(../img/theme/paint/paint-magenta.svg), url(../img/theme/elements/cocon_sortie.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:auto, 50%;
|
||||
background-size:auto, 60%;
|
||||
background-position: 0% 100%, center left;
|
||||
}
|
||||
|
||||
|
|
@ -216,7 +216,7 @@ section:nth-child(5) {
|
|||
background-color: #fbfbfb;
|
||||
background-image: url(../img/theme/paint/paint-violet.svg), url(../img/theme/elements/early_papillon.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:auto, 50%;
|
||||
background-size:auto, 60%;
|
||||
background-position: 0% 100%, center right;
|
||||
}
|
||||
|
||||
|
|
@ -224,7 +224,7 @@ section:nth-child(6) {
|
|||
background-color: #fbfbfb;
|
||||
background-image: url(../img/theme/elements/papillon.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 50%;
|
||||
background-size: 60%;
|
||||
background-position: top left;
|
||||
}
|
||||
|
||||
|
|
@ -267,6 +267,10 @@ section p a:active {
|
|||
padding-right: 40px;
|
||||
}
|
||||
|
||||
section > img {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
section h2 {
|
||||
font-size: 2.6rem;
|
||||
}
|
||||
|
|
@ -278,6 +282,10 @@ section p a:active {
|
|||
font-size: 2.4rem;
|
||||
}
|
||||
|
||||
section > img {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
section {
|
||||
background-image: none
|
||||
}
|
||||
|
|
@ -436,34 +444,93 @@ section p a:active {
|
|||
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
/* PRICE TABLE
|
||||
/* CALENDARS
|
||||
/*--------------------------------------------------------*/
|
||||
|
||||
#calendar {
|
||||
width: 100%;
|
||||
.calendars {
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
padding: 0 0 20%;
|
||||
overflow-x: scroll;
|
||||
overflow-y: visible;
|
||||
|
||||
--calendar-hour-width: 60px;
|
||||
--calendar-max-daily-hours: 19;
|
||||
}
|
||||
|
||||
/* .calendar {
|
||||
max-width: 100%;
|
||||
margin: 0 20px;
|
||||
padding: 0;
|
||||
} */
|
||||
|
||||
.calendar {
|
||||
width: calc(var(--calendar-hour-width) * var(--calendar-max-daily-hours));
|
||||
margin: 0 auto;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.calendar h2 {
|
||||
padding: 0;
|
||||
margin: 2em 0 1em 0;
|
||||
}
|
||||
|
||||
#cal-container-1 {
|
||||
width: calc(var(--calendar-hour-width) * 9);
|
||||
margin-left: calc(var(--calendar-hour-width) * 9);
|
||||
}
|
||||
|
||||
#cal-container-2 {
|
||||
width: calc(var(--calendar-hour-width) * 19);
|
||||
}
|
||||
|
||||
#cal-container-3 {
|
||||
width: calc(var(--calendar-hour-width) * 7);
|
||||
}
|
||||
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
|
||||
|
||||
@media only screen and (max-width: 880px) {
|
||||
#calendar {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
#cal-container {
|
||||
min-width: 1800px;
|
||||
margin: 0 0 40px 0; /* Fix the weird y-overflow of the calendar root */
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.calendars {
|
||||
width: max(
|
||||
calc(var(--calendar-hour-width) * var(--calendar-max-daily-hours),
|
||||
100vw)
|
||||
);
|
||||
padding: 0 40px 20%;
|
||||
--calendar-hour-width: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 880px) {
|
||||
.calendar h2 {
|
||||
text-align: left;
|
||||
padding: 0 40px;
|
||||
}
|
||||
#cal-container-1 {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 640px) {
|
||||
.cal-details-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cal-container .cal-event-details {
|
||||
min-width: 90% !important;
|
||||
left: 5vw !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 380px) {
|
||||
.calendar h2 {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
/* LOCATION
|
||||
|
|
@ -763,7 +830,7 @@ section p a:active {
|
|||
}
|
||||
|
||||
.team-group figure img {
|
||||
width: 260px;
|
||||
width: 190px;
|
||||
}
|
||||
|
||||
.team-group figcaption {
|
||||
|
|
|
|||
Loading…
Reference in a new issue