ldc-legaulois/resources/sass/front/pages/health-nutrition/bloc1.scss
Jérémy Munsch 47144bbf7e
Modification Lot 2 page Santé nutrition
- suppression des 4 pages
- ajout de 2 nouvelle pages
- redirection des anciennes pages vers le nouvelles
- Le nouvelle page ne sont plus statiques (basés sur engagement)
- Ajout du Model NutritionPage
- Ajout des Enums NutritionBlocType, NutritionType
- Intégration complete avec responsive des deux nouvelles pages
- modification des composants vu pour créer une instance de Vuejs par composant existant pour ajouter et enlever des dropdowns
- Suppression des balanced menus
- fix login center image
- Modification de l'intégration de CKeditor
- Ajout de UploadController avec methode pour image
- html purifier fix config using ckeditor
- ckeditor set css base style on front and back (for nutrition pages on front)
2021-10-03 12:39:08 +02:00

84 lines
2.5 KiB
SCSS
Vendored

.content.nutrition {
.bloc1 {
display: flex;
flex-direction: row-reverse;
align-items: flex-start;
& > img {
position: absolute;
left: 0;
object-fit: contain;
width: 40%;
border-radius: 0.3rem;
z-index: 1;
}
&.right {
flex-direction: row;
& > img {
position: absolute;
right: 0;
left:inherit;
}
& > .content {
position: relative;
right: inherit;
padding: 4.799rem 6.799rem 3.732rem 3.466rem;
}
}
& > .content {
position: relative;
right: 0;
min-width: 52.794rem;
margin-top: 6.932rem;
border-radius: 0.333rem;
color: $color5;
background-color: #FFF;
padding: 4.799rem 3.466rem 3.732rem 6.799rem;
width: 55%;
@import "./title";
@import "./content";
// content positionning
& > .text {
padding-top: 1.6rem;
padding-bottom: 4.266rem;
}
@import "./dropdowns";
}
}
@include max-width($engagementMajorBreakPoint) {
.bloc1, & .bloc1.right {
flex-direction: column;
position: relative !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: calc(100vw - 1.334rem) !important;
& > img {
position: relative;
right: inherit;
left: 50%;
transform: translateX(-50%);
width: 100%;
// 486 px
max-width: 32.396rem;
z-index: 0;
}
& > .content {
position: relative;
right: inherit;
left: 50%;
margin-top: -2.6rem;
transform: translateX(-50%);
min-width: inherit;
max-width: 46.132rem;
width: calc(100vw - 1.334rem);
border-radius: 0.333rem;
padding: 4.799rem 3.466rem 3.732rem 3.466rem;
@include max-width(32.396rem + 1.334rem*2) {
border-radius: 0 0 0.333rem 0.333rem;
}
@include max-width($mobile) {
padding: 2.466rem;
}
}
}
}
}