Created
January 9, 2023 12:41
-
-
Save annelyse/8c976f3ddb8a8863687623e5dfbd9d1b to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .heroHome { | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| background: #fff; | |
| position: relative; | |
| flex-direction: column; | |
| padding-top: rfs-value(60px); | |
| @include media-breakpoint-up(md) { | |
| flex-direction: row; | |
| } | |
| @include media-breakpoint-down(md) { | |
| min-height: auto !important; | |
| } | |
| .btn-toolbar{ | |
| @include media-breakpoint-down(sm) { | |
| flex-direction: column; | |
| } | |
| } | |
| .hero-illustration{ | |
| position: relative; | |
| padding: rfs-value(40px) rfs-value(16px); | |
| z-index: 0; | |
| width: 100%; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| margin-top: rfs-value(60px); | |
| margin-bottom: rfs-value(60px); | |
| @include media-breakpoint-up(md) { | |
| height: 100%; | |
| position: absolute; | |
| right: 0; | |
| width: 45%; | |
| justify-content: start; | |
| top: 0; | |
| margin: 0; | |
| } | |
| &:after{ | |
| content:''; | |
| background: linear-gradient(153.95deg, $primary 0.79%, $secondary 48.73%, $bonus 103.39%); | |
| position: absolute; | |
| height: 100%; | |
| top:0; | |
| right:0; | |
| z-index: -1; | |
| width: 63%; | |
| } | |
| img{ | |
| max-width: 90%; | |
| height: auto; | |
| } | |
| } | |
| .scroll-indicator{ | |
| color: #939393; | |
| font-weight: 600; | |
| font-size: rfs-value(16px); | |
| width: 100%; | |
| text-align: center; | |
| padding: 0; | |
| margin-bottom: rfs-value(23px); | |
| margin-top: rfs-value(23px); | |
| @include media-breakpoint-up(md) { | |
| position: absolute; | |
| left: 0; | |
| bottom: 0 | |
| } | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [ | |
| { | |
| "key": "group_63b2f4794e91f", | |
| "title": "En tête", | |
| "fields": [ | |
| { | |
| "key": "field_63b44e7baa55a", | |
| "label": "En tête de page", | |
| "name": "hero", | |
| "aria-label": "", | |
| "type": "group", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "layout": "block", | |
| "sub_fields": [ | |
| { | |
| "key": "field_63b2f47904191", | |
| "label": "Titre", | |
| "name": "title", | |
| "aria-label": "", | |
| "type": "text", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "default_value": "", | |
| "maxlength": "", | |
| "placeholder": "", | |
| "prepend": "", | |
| "append": "" | |
| }, | |
| { | |
| "key": "field_63b2f49004192", | |
| "label": "Introduction", | |
| "name": "intro", | |
| "aria-label": "", | |
| "type": "textarea", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "default_value": "", | |
| "maxlength": "", | |
| "rows": 2, | |
| "placeholder": "", | |
| "new_lines": "" | |
| }, | |
| { | |
| "key": "field_63b6f47459b6e", | |
| "label": "Illustration", | |
| "name": "illustration", | |
| "aria-label": "", | |
| "type": "image_aspect_ratio_crop", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "crop_type": "free_crop", | |
| "return_format": "id", | |
| "preview_size": "medium", | |
| "library": "all", | |
| "min_width": "", | |
| "min_height": "", | |
| "min_size": "", | |
| "max_width": "", | |
| "max_height": "", | |
| "max_size": "", | |
| "mime_types": "" | |
| }, | |
| { | |
| "key": "field_63b2f49c04193", | |
| "label": "Boutons", | |
| "name": "buttons", | |
| "aria-label": "", | |
| "type": "repeater", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "layout": "row", | |
| "pagination": 0, | |
| "min": 0, | |
| "max": 0, | |
| "collapsed": "", | |
| "button_label": "Ajouter un élément", | |
| "rows_per_page": 20, | |
| "sub_fields": [ | |
| { | |
| "key": "field_63b2f82d5c4e9", | |
| "label": "Boutons", | |
| "name": "buttons", | |
| "aria-label": "", | |
| "type": "clone", | |
| "instructions": "", | |
| "required": 0, | |
| "conditional_logic": 0, | |
| "wrapper": { | |
| "width": "", | |
| "class": "", | |
| "id": "" | |
| }, | |
| "clone": [ | |
| "group_63b2d05e0d423" | |
| ], | |
| "display": "seamless", | |
| "layout": "block", | |
| "prefix_label": 0, | |
| "prefix_name": 0, | |
| "parent_repeater": "field_63b2f49c04193" | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| ], | |
| "location": [ | |
| [ | |
| { | |
| "param": "page", | |
| "operator": "==", | |
| "value": "2" | |
| } | |
| ] | |
| ], | |
| "menu_order": 0, | |
| "position": "normal", | |
| "style": "default", | |
| "label_placement": "top", | |
| "instruction_placement": "label", | |
| "hide_on_screen": [ | |
| "the_content" | |
| ], | |
| "active": true, | |
| "description": "", | |
| "show_in_rest": 0 | |
| } | |
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="heroHome full-minheight"> | |
| <div class="container"> | |
| <div class="row"> | |
| <div class="col-md-6"> | |
| <h1 class="display-1"> | |
| {{ hero.title }} | |
| </h1> | |
| {% if hero.intro %} | |
| <div class="lead"> | |
| <p> | |
| {{ hero.intro }} | |
| </p> | |
| </div> | |
| {% endif %} | |
| {% set buttonsArray = hero.buttons %} | |
| {% include 'partial/buttons.twig' %} | |
| </div> | |
| </div> | |
| </div> | |
| <div class="hero-illustration"> | |
| {% set image = Image(hero.illustration) %} | |
| <img src="{{ image.src() }}" | |
| alt="{{ image.alt }}" | |
| loading="lazy" | |
| width="{{ image.sizes.slideServices.width }}" | |
| height="{{ image.sizes.slideServices.height }}" | |
| srcset="{{ image.srcset }}" | |
| sizes="{{ image.img_sizes }}" /> | |
| </div> | |
| <a href="#start" class="scroll-indicator icon-on-right"> | |
| Scroller pour continuer<svg class="icon"> | |
| <use xlink:href="#icon-scroll-down"></use> | |
| </svg> | |
| </a> | |
| </div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment