diff --git a/assets/components/atoms/button/button-tertiary-states.twig b/assets/components/atoms/button/button-tertiary-states.twig new file mode 100644 index 000000000..f18ad545f --- /dev/null +++ b/assets/components/atoms/button/button-tertiary-states.twig @@ -0,0 +1,4 @@ + + + + diff --git a/assets/components/atoms/button/button-tertiary.twig b/assets/components/atoms/button/button-tertiary.twig new file mode 100644 index 000000000..12e7af205 --- /dev/null +++ b/assets/components/atoms/button/button-tertiary.twig @@ -0,0 +1 @@ + diff --git a/assets/components/atoms/button/button.scss b/assets/components/atoms/button/button.scss index 87ce98b97..75acefae2 100644 --- a/assets/components/atoms/button/button.scss +++ b/assets/components/atoms/button/button.scss @@ -123,6 +123,47 @@ input[type="button"] { } } +.btn-tertiary { + background: $canard; + font-weight: $font-weight-bold; + color: $white; + + &:hover, + &.hover { + background: $canard-dark; + border-color: $canard-dark; + color: $white; + } + + &:focus, + &:focus-visible, + &.focus { + outline-color: $canard-dark !important; + color: $white; + } + + &:not(:disabled):not(.disabled):active, + &:not(:disabled):not(.disabled).active { + // ugly ↓ + // background: linear-gradient(to bottom, $canard-dark 0%, $red 100%); + background: color.adjust($canard-dark, $lightness: -10%); + border-color: color.adjust($canard-dark, $lightness: -10%); + } + + &:disabled, + &.disabled { + background: $gray-100; + border-color: $gray-300; + color: $gray-300; + + .bg-dark & { + background: $black; + border-color: $gray-600; + color: $gray-600; + } + } +} + .btn-light { &, &:hover { diff --git a/assets/components/atoms/button/button.yml b/assets/components/atoms/button/button.yml index e3ec2e736..0cf882fc3 100644 --- a/assets/components/atoms/button/button.yml +++ b/assets/components/atoms/button/button.yml @@ -22,6 +22,14 @@ variants: title: Secondary states preview notes: | *For previewing purposes only. **Do not use in production!*** + - name: tertiary + title: Button tertiary + notes: | + For less aggressive buttons that are still in line with the EPFL graphic charter. + - name: tertiary-states + title: Tertiary states preview + notes: | + *For previewing purposes only. **Do not use in production!*** notes: | Button is your interaction friend when you want people to complete an action. By clicking a button, people expect to trigger an event, confirm a form or load a new page. Don't put many buttons on one single page. The primary action should be obvious for people. diff --git a/assets/components/atoms/picture/picture-avatar.twig b/assets/components/atoms/picture/picture-avatar.twig index 126735946..ab052c1dc 100644 --- a/assets/components/atoms/picture/picture-avatar.twig +++ b/assets/components/atoms/picture/picture-avatar.twig @@ -1,18 +1,19 @@ +{% set avatar_path = avatar_path|default("./images/styleguide/people/avatar-") %} + srcset="{{avatar_path}}120x120.jpg 1x, {{avatar_path}}256x256.jpg 2x"> + srcset="{{avatar_path}}95x95.jpg 1x, {{avatar_path}}180x180.jpg 2x"> + srcset="{{avatar_path}}80x80.jpg 1x, {{avatar_path}}160x160.jpg 2x"> + srcset="{{avatar_path}}60x60.jpg 1x, {{avatar_path}}120x120.jpg 2x"> - ALT + srcset="{{avatar_path}}95x95.jpg 1x, {{avatar_path}}180x180.jpg 2x"> + ALT diff --git a/assets/components/atoms/picture/picture-cover.twig b/assets/components/atoms/picture/picture-cover.twig index c168291f5..f20eb691e 100644 --- a/assets/components/atoms/picture/picture-cover.twig +++ b/assets/components/atoms/picture/picture-cover.twig @@ -1,19 +1,19 @@ -{% set cover_path = cover_path|default("https://via.placeholder.com/") %} +{% set cover_path = cover_path|default("./images/styleguide/teaser/news-teaser-") %} + srcset="{{cover_path}}1920x1080.jpg 1x,{{cover_path}}2240x1260.jpg 2x"> + srcset="{{cover_path}}1140x641.jpg 1x,{{cover_path}}2240x1260.jpg 2x"> + srcset="{{cover_path}}928x520.jpg 1x,{{cover_path}}1920x1080.jpg 2x"> + srcset="{{cover_path}}768x432.jpg 1x,{{cover_path}}1440x810.jpg 2x"> + srcset="{{cover_path}}576x324.jpg 1x,{{cover_path}}1080x608.jpg 2x"> Cover description diff --git a/assets/components/atoms/picture/picture-fullwidth-teaser.twig b/assets/components/atoms/picture/picture-fullwidth-teaser.twig index fba00c147..c8f5fa635 100644 --- a/assets/components/atoms/picture/picture-fullwidth-teaser.twig +++ b/assets/components/atoms/picture/picture-fullwidth-teaser.twig @@ -1,21 +1,19 @@ -{% if not img %} -{% set img %}./images/styleguide/teaser/news-teaser{% endset %} -{% endif %} +{% set cover_path = cover_path|default("./images/styleguide/teaser/news-teaser-") %} + srcset="{{cover_path}}1920x1080.jpg 1x, {{cover_path}}2240x1260.jpg 2x"> + srcset="{{cover_path}}1440x810.jpg 1x, {{cover_path}}1920x1080.jpg 2x"> + srcset="{{cover_path}}1294x728.jpg 1x, {{cover_path}}1600x900.jpg 2x"> + srcset="{{cover_path}}768x432.jpg 1x, {{cover_path}}1440x810.jpg 2x"> - image description + srcset="{{cover_path}}576x324.jpg 1x, {{cover_path}}1140x641.jpg 2x"> + image description diff --git a/assets/components/atoms/picture/picture-one-third-square.twig b/assets/components/atoms/picture/picture-one-third-square.twig index 3ee256d30..c26eea0fc 100644 --- a/assets/components/atoms/picture/picture-one-third-square.twig +++ b/assets/components/atoms/picture/picture-one-third-square.twig @@ -1,18 +1,19 @@ +{% set img_path = img_path|default("./images/styleguide/teaser/news-teaser-") %} + srcset="{{img_path}}480x480.jpg 1x, {{img_path}}780x780.jpg 2x"> + srcset="{{img_path}}360x360.jpg 1x, {{img_path}}780x780.jpg 2x"> + srcset="{{img_path}}360x360.jpg 1x, {{img_path}}640x640.jpg 2x"> + srcset="{{img_path}}780x780.jpg 1x, {{img_path}}1440x1440.jpg 2x"> - ALT + srcset="{{img_path}}640x640.jpg 1x, {{img_path}}1080x1080.jpg 2x"> + ALT diff --git a/assets/components/atoms/picture/picture-one-third.twig b/assets/components/atoms/picture/picture-one-third.twig index 67d86edf1..be621fbf5 100644 --- a/assets/components/atoms/picture/picture-one-third.twig +++ b/assets/components/atoms/picture/picture-one-third.twig @@ -1,18 +1,19 @@ +{% set img_path = img_path|default("./images/styleguide/teaser/news-teaser-") %} + srcset="{{img_path}}380x214.jpg 1x, {{img_path}}768x432.jpg 2x"> + srcset="{{img_path}}380x214.jpg 1x, {{img_path}}768x432.jpg 2x"> + srcset="{{img_path}}320x180.jpg 1x, {{img_path}}640x360.jpg 2x"> + srcset="{{img_path}}768x432.jpg 1x, {{img_path}}1440x810.jpg 2x"> - ALT + srcset="{{img_path}}576x324.jpg 1x, {{img_path}}1080x608.jpg 2x"> + ALT diff --git a/assets/components/atoms/picture/picture-portrait.twig b/assets/components/atoms/picture/picture-portrait.twig index e8a0905d2..c645442c9 100644 --- a/assets/components/atoms/picture/picture-portrait.twig +++ b/assets/components/atoms/picture/picture-portrait.twig @@ -1,18 +1,19 @@ +{% set portrait_path = portrait_path|default("./images/styleguide/people/portrait-") %} + srcset="{{portrait_path}}253x360.jpg 1x, {{portrait_path}}506x720.jpg 2x"> + srcset="{{portrait_path}}211x300.jpg 1x, {{portrait_path}}422x600.jpg 2x"> + srcset="{{portrait_path}}253x360.jpg 1x, {{portrait_path}}506x720.jpg 2x"> + srcset="{{portrait_path}}253x360.jpg 1x, {{portrait_path}}506x720.jpg 2x"> - ALT + srcset="{{portrait_path}}211x300.jpg 1x, {{portrait_path}}422x600.jpg 2x"> + ALT diff --git a/assets/components/atoms/picture/picture-question.twig b/assets/components/atoms/picture/picture-question.twig index d2b6bddc3..6e7b58c49 100644 --- a/assets/components/atoms/picture/picture-question.twig +++ b/assets/components/atoms/picture/picture-question.twig @@ -1,18 +1,19 @@ +{% set img_path = img_path|default("./images/styleguide/homepage/7-science-question/science-question-") %} + srcset="{{img_path}}540x304.jpg 1x, {{img_path}}1080x608.jpg 2x"> + srcset="{{img_path}}960x540.jpg 1x, {{img_path}}1440x810.jpg 2x"> + srcset="{{img_path}}720x405.jpg 1x, {{img_path}}1080x608.jpg 2x"> + srcset="{{img_path}}540x304.jpg 1x, {{img_path}}1080x608.jpg 2x"> - ALT + srcset="{{img_path}}540x304.jpg 1x, {{img_path}}1080x608.jpg 2x"> + ALT diff --git a/assets/components/atoms/picture/picture-thumb-square.twig b/assets/components/atoms/picture/picture-thumb-square.twig index 7c36681d5..f3d86d8bc 100644 --- a/assets/components/atoms/picture/picture-thumb-square.twig +++ b/assets/components/atoms/picture/picture-thumb-square.twig @@ -1,8 +1,19 @@ +{% set thumb_path = thumb_path|default("./images/styleguide/news-thumbs/news_thumb-") %} - - - - - - ALT + + + + + + ALT diff --git a/assets/components/atoms/picture/picture.twig b/assets/components/atoms/picture/picture.twig index 13130313b..a1236974d 100644 --- a/assets/components/atoms/picture/picture.twig +++ b/assets/components/atoms/picture/picture.twig @@ -1,18 +1,19 @@ +{% set img_path = img_path|default("./images/styleguide/teaser/news-teaser-") %} + srcset="{{img_path}}576x324.jpg 1x, {{img_path}}1140x641.jpg 2x"> + srcset="{{img_path}}576x324.jpg 1x, {{img_path}}1140x641.jpg 2x"> + srcset="{{img_path}}508x286.jpg 1x, {{img_path}}928x520.jpg 2x"> + srcset="{{img_path}}768x432.jpg 1x, {{img_path}}1440x810.jpg 2x"> - image description + srcset="{{img_path}}576x324.jpg 1x, {{img_path}}1080x608.jpg 2x"> + image description diff --git a/assets/components/atoms/picture/picture.yml b/assets/components/atoms/picture/picture.yml index 043ed8694..269749504 100644 --- a/assets/components/atoms/picture/picture.yml +++ b/assets/components/atoms/picture/picture.yml @@ -12,7 +12,7 @@ variants: Picture used in 'Organism > Fullwidth teaser' and 'News > Highlighted'. - name: avatar title: Avatar - wrapper: col-sm-4 col-md-2 col-lg-1 + wrapper: col-sm-4 col-md-2 notes: | Avatar picture need an equal height and width in order to be displayed as a circle - name: portrait @@ -25,6 +25,7 @@ variants: wrapper: col-md-4 - name: one-third-square title: One third Square picture + wrapper: col-md-4 - name: news-thumb title: News Listing Thumbnail wrapper: col-3 col-md-2 diff --git a/assets/components/content-types/study-plan/study-plan-bachelor.twig b/assets/components/content-types/study-plan/study-plan-bachelor.twig index ab2f8858b..e8ea51ef5 100644 --- a/assets/components/content-types/study-plan/study-plan-bachelor.twig +++ b/assets/components/content-types/study-plan/study-plan-bachelor.twig @@ -13,11 +13,6 @@
Bachelor 1 
-
-
c
-
e
-
p
-
Examens
@@ -49,10 +44,13 @@
-
-
Cours: 1h 
-
Exercices: 2h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • Labo: 2h
    • +
  • CP: 2h
    • +
@@ -94,10 +92,12 @@
-
-
Cours: 1h 
-
Exercices: 3h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • IP: 2h
    • +
@@ -139,10 +139,12 @@
-
-
Cours: 2h 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -180,19 +182,9 @@
Bachelor 1 
-
-
c
-
e
-
p
-
Bachelor 2 
-
-
c
-
e
-
p
-
Examens
@@ -224,19 +216,16 @@
-
-
Cours: 1h 
-
Exercices: 2h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
@@ -277,18 +266,16 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 1h 
-
Exercices: 3h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -330,19 +317,16 @@
-
-
Cours: 2h 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
@@ -383,18 +367,16 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -432,27 +414,12 @@
Bachelor 1 
-
-
c
-
e
-
p
-
Bachelor 2 
-
-
c
-
e
-
p
-
Bachelor 3 
-
-
c
-
e
-
p
-
Examens
@@ -484,27 +451,21 @@
-
-
Cours: 1h 
-
Exercices: 2h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
@@ -545,26 +506,20 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 1h 
-
Exercices: 3h 
-
– 
-
+
-
-
– 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -606,27 +561,21 @@
-
-
Cours: 2h 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
@@ -667,27 +616,21 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
@@ -724,35 +667,15 @@
Bachelor 3 
-
-
c
-
e
-
p
-
Bachelor 4 
-
-
c
-
e
-
p
-
Bachelor 5 
-
-
c
-
e
-
p
-
Bachelor 6 
-
-
c
-
e
-
p
-
Examens
@@ -784,34 +707,30 @@
-
-
– 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
Exercices: 2h 
-
– 
-
+
-
-
– 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -853,34 +772,24 @@
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
Exercices: 2h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
@@ -922,35 +831,25 @@
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
Cours: 2h 
-
Exercices: 2h 
-
– 
-
+
@@ -990,35 +889,25 @@
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
  • TP: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
Exercices: 2h 
-
– 
-
+
diff --git a/assets/components/content-types/study-plan/study-plan-master.twig b/assets/components/content-types/study-plan/study-plan-master.twig index 648e5558b..ab19a8ebe 100644 --- a/assets/components/content-types/study-plan/study-plan-master.twig +++ b/assets/components/content-types/study-plan/study-plan-master.twig @@ -13,35 +13,15 @@
Master 1 
-
-
c
-
e
-
p
-
Master 2 
-
-
c
-
e
-
p
-
PDM automne
-
-
c
-
e
-
p
-
PDM printemps
-
-
c
-
e
-
p
-
Examens
@@ -73,34 +53,26 @@
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
– 
-
+
-
-
– 
-
– 
-
Pratique: 900h 
+
+
    +
  • Pratique: 900h
    • +
-
-
– 
-
– 
-
Pratique: 900h 
+
+
    +
  • Pratique: 900h
    • +
@@ -142,34 +114,34 @@
-
-
– 
-
– 
-
Pratique: 320h  
+
+
    +
  • Pratique: 320h
    • +
-
-
– 
-
– 
-
Pratique: 320h 
+
+
    +
  • Pratique: 320h
    • +
-
-
– 
-
– 
-
Pratique: 320h 
+
+
    +
  • Pratique: 320h
    • +
-
-
– 
-
– 
-
Pratique: 320h 
+
+
    +
  • Pratique: 320h
    • +
@@ -207,19 +179,9 @@
Master 1 
-
-
c
-
e
-
p
-
Master 2 
-
-
c
-
e
-
p
-
Spécialisation
@@ -254,18 +216,15 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 4h 
-
Exercices: 3h 
-
– 
+
+
    +
  • Cours: 4h
    • +
  • Exercices: 3h
    • +
@@ -319,18 +278,15 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
– 
-
Pratique: 2h 
+
+
    +
  • Cours: 2h
    • +
  • TP: 2h
    • +
@@ -382,18 +338,15 @@
-
-
– 
-
– 
-
– 
-
+
-
-
Cours: 2h 
-
Exercices: 1h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
@@ -443,19 +396,16 @@
-
-
Cours: 4h 
-
Exercices: 2h 
-
– 
+
+
    +
  • Cours: 2h
    • +
  • Exercices: 2h
    • +
-
-
– 
-
– 
-
– 
-
+
diff --git a/assets/components/content-types/study-plan/study-plan.scss b/assets/components/content-types/study-plan/study-plan.scss index 9a7b1d33f..dea9a9664 100644 --- a/assets/components/content-types/study-plan/study-plan.scss +++ b/assets/components/content-types/study-plan/study-plan.scss @@ -34,6 +34,23 @@ $study-plan-master-pdm: minmax(250px, 3fr) 1fr 2fr 2fr 2fr 2fr minmax(140px, 3fr font-weight: $font-weight-bold; } + ul { + margin: 0; + padding: 0; + + li { + line-height: 1.3; + + &:before { + top: 0.45em; + } + } + + li + li { + margin-top: 0.25em; + } + } + // Lines // Grid properties are overridden on browsers supporting "display: contents". .line, @@ -171,6 +188,14 @@ $study-plan-master-pdm: minmax(250px, 3fr) 1fr 2fr 2fr 2fr 2fr minmax(140px, 3fr padding: 0 !important; } + .schedule-text.no-course { + display: flex; + justify-content: center; + align-items: center; + height: 100%; + color: $gray-500; + } + // Stripes .bachlor-text { height: 100%; @@ -512,6 +537,8 @@ $study-plan-master-pdm: minmax(250px, 3fr) 1fr 2fr 2fr 2fr 2fr minmax(140px, 3fr height: auto; } } + + } } diff --git a/assets/components/molecules/key-number/key-number-hn-link.twig b/assets/components/molecules/key-number/key-number-hn-link.twig index fb78b3271..f535382e1 100644 --- a/assets/components/molecules/key-number/key-number-hn-link.twig +++ b/assets/components/molecules/key-number/key-number-hn-link.twig @@ -1,4 +1,3 @@ -{% set icon = icon|default("https://via.placeholder.com/") %}
diff --git a/assets/components/molecules/key-number/key-number-hn.twig b/assets/components/molecules/key-number/key-number-hn.twig index ad8a82a14..655e403f9 100644 --- a/assets/components/molecules/key-number/key-number-hn.twig +++ b/assets/components/molecules/key-number/key-number-hn.twig @@ -1,4 +1,3 @@ -{% set icon = icon|default("https://via.placeholder.com/") %}
diff --git a/assets/components/molecules/key-number/key-number-large.twig b/assets/components/molecules/key-number/key-number-large.twig index be74e2d90..3381ca00b 100644 --- a/assets/components/molecules/key-number/key-number-large.twig +++ b/assets/components/molecules/key-number/key-number-large.twig @@ -1,4 +1,3 @@ -{% set icon = icon|default("https://via.placeholder.com/") %}
diff --git a/assets/components/molecules/key-number/key-number.twig b/assets/components/molecules/key-number/key-number.twig index b8d831414..168f0cf6a 100644 --- a/assets/components/molecules/key-number/key-number.twig +++ b/assets/components/molecules/key-number/key-number.twig @@ -1,4 +1,3 @@ -{% set icon = icon|default("https://via.placeholder.com/") %}
diff --git a/assets/components/molecules/sponsor/sponsor-link.twig b/assets/components/molecules/sponsor/sponsor-link.twig new file mode 100644 index 000000000..adfa603f3 --- /dev/null +++ b/assets/components/molecules/sponsor/sponsor-link.twig @@ -0,0 +1,8 @@ +
+ + EPFL + +
+
Lorem ipsum dolor sit amet.
+
+
\ No newline at end of file diff --git a/assets/components/molecules/sponsor/sponsor.twig b/assets/components/molecules/sponsor/sponsor.twig index d8e0b3ecb..3a73e576c 100644 --- a/assets/components/molecules/sponsor/sponsor.twig +++ b/assets/components/molecules/sponsor/sponsor.twig @@ -1,5 +1,5 @@
- Sponsor + EPFL
Lorem ipsum dolor sit amet.
diff --git a/assets/components/molecules/sponsor/sponsor.yml b/assets/components/molecules/sponsor/sponsor.yml index d9f1187bf..1d3fb214d 100644 --- a/assets/components/molecules/sponsor/sponsor.yml +++ b/assets/components/molecules/sponsor/sponsor.yml @@ -1,2 +1,5 @@ title: Sponsor name: sponsor +variants: + - name: link + title: Sponsor with link \ No newline at end of file diff --git a/assets/components/organisms/hero/hero.scss b/assets/components/organisms/hero/hero.scss index cec6ba1ac..22fa16a6a 100644 --- a/assets/components/organisms/hero/hero.scss +++ b/assets/components/organisms/hero/hero.scss @@ -75,6 +75,14 @@ height: 100%; } + img.top-center { + object-position: top center; + } + + img.bottom-center { + object-position: bottom center; + } + @include media-breakpoint-up(xxl) { picture { height: 80vh; diff --git a/assets/components/organisms/hero/hero.yml b/assets/components/organisms/hero/hero.yml index fe3f52a62..9ce23d324 100644 --- a/assets/components/organisms/hero/hero.yml +++ b/assets/components/organisms/hero/hero.yml @@ -3,6 +3,8 @@ title: Hero notes: | The hero component is used as intro to basic pages. + You can add the `.top-center` class to the `` tag if you want the background picture to be centred from the top of the image, or the `bottom-center` class to the `` tag if you want the background picture to be centred from the bottom of the image. + variants: - name: legend title: Hero with image legend diff --git a/assets/components/organisms/sponsor-list/sponsor-list-link.twig b/assets/components/organisms/sponsor-list/sponsor-list-link.twig new file mode 100644 index 000000000..fb4997fb3 --- /dev/null +++ b/assets/components/organisms/sponsor-list/sponsor-list-link.twig @@ -0,0 +1,11 @@ +
+
+ {% include '@molecules/sponsor/sponsor-link.twig' %} +
+
+ {% include '@molecules/sponsor/sponsor-link.twig' %} +
+
+ {% include '@molecules/sponsor/sponsor-link.twig' %} +
+
\ No newline at end of file diff --git a/assets/components/organisms/sponsor-list/sponsor-list.twig b/assets/components/organisms/sponsor-list/sponsor-list.twig new file mode 100644 index 000000000..46620186c --- /dev/null +++ b/assets/components/organisms/sponsor-list/sponsor-list.twig @@ -0,0 +1,11 @@ +
+
+ {% include '@molecules/sponsor/sponsor.twig' %} +
+
+ {% include '@molecules/sponsor/sponsor.twig' %} +
+
+ {% include '@molecules/sponsor/sponsor.twig' %} +
+
\ No newline at end of file diff --git a/assets/components/organisms/sponsor-list/sponsor-list.yml b/assets/components/organisms/sponsor-list/sponsor-list.yml new file mode 100644 index 000000000..7315e4b9b --- /dev/null +++ b/assets/components/organisms/sponsor-list/sponsor-list.yml @@ -0,0 +1,5 @@ +title: Sponsor List +name: sponsor-list +variants: + - name: link + title: Sponsor List with link \ No newline at end of file diff --git a/assets/config/bootstrap-variables.scss b/assets/config/bootstrap-variables.scss index 12e4f1951..6b7848f97 100644 --- a/assets/config/bootstrap-variables.scss +++ b/assets/config/bootstrap-variables.scss @@ -10,13 +10,16 @@ // // stylelint-disable -$white: #fff !default; -$gray-100: #e6e6e6 !default; -$gray-200: #d5d5d5 !default; -$gray-300: #c1c1c1 !default; -$gray-500: #8e8e8e !default; -$gray-600: #707070 !default; -$black: #212121 !default; +$white: #fff !default; +$gray-100: #e6e6e6 !default; +$gray-200: #d5d5d5 !default; +$gray-300: #c1c1c1 !default; +$gray-500: #8e8e8e !default; +$gray-600: #707070 !default; +$black: #212121 !default; +$leman: #00A79F !default; +$canard: #007480 !default; +$canard-dark: #004248 !default; $grays: () !default; $grays: map-merge(( diff --git a/assets/config/colors.json b/assets/config/colors.json index 540933f64..eb48761e6 100644 --- a/assets/config/colors.json +++ b/assets/config/colors.json @@ -9,5 +9,6 @@ "$gray-600": "#707070", "$black": "#212121", "$leman": "#00A79F", - "$canard": "#007480" + "$canard": "#007480", + "$canard-dark": "#004248" } diff --git a/assets/images/styleguide/homepage/7-science-question/science-question-1080x608.jpg b/assets/images/styleguide/homepage/7-science-question/science-question-1080x608.jpg new file mode 100644 index 000000000..d709e0835 Binary files /dev/null and b/assets/images/styleguide/homepage/7-science-question/science-question-1080x608.jpg differ diff --git a/assets/images/styleguide/homepage/7-science-question/science-question-1440x810.jpg b/assets/images/styleguide/homepage/7-science-question/science-question-1440x810.jpg new file mode 100644 index 000000000..2e67e0a90 Binary files /dev/null and b/assets/images/styleguide/homepage/7-science-question/science-question-1440x810.jpg differ diff --git a/assets/images/styleguide/homepage/7-science-question/science-question-540x304.jpg b/assets/images/styleguide/homepage/7-science-question/science-question-540x304.jpg new file mode 100644 index 000000000..f0c2ee5ee Binary files /dev/null and b/assets/images/styleguide/homepage/7-science-question/science-question-540x304.jpg differ diff --git a/assets/images/styleguide/homepage/7-science-question/science-question-720x405.jpg b/assets/images/styleguide/homepage/7-science-question/science-question-720x405.jpg new file mode 100644 index 000000000..4e106eea5 Binary files /dev/null and b/assets/images/styleguide/homepage/7-science-question/science-question-720x405.jpg differ diff --git a/assets/images/styleguide/homepage/7-science-question/science-question-960x540.jpg b/assets/images/styleguide/homepage/7-science-question/science-question-960x540.jpg new file mode 100644 index 000000000..dd5da1af4 Binary files /dev/null and b/assets/images/styleguide/homepage/7-science-question/science-question-960x540.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-1080x1080.jpg b/assets/images/styleguide/news-thumbs/news_thumb-1080x1080.jpg new file mode 100644 index 000000000..ce2b6e0b7 Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-1080x1080.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-120x120.jpg b/assets/images/styleguide/news-thumbs/news_thumb-120x120.jpg new file mode 100644 index 000000000..7c626816a Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-120x120.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-160x160.jpg b/assets/images/styleguide/news-thumbs/news_thumb-160x160.jpg new file mode 100644 index 000000000..fed2ead7f Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-160x160.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-240x240.jpg b/assets/images/styleguide/news-thumbs/news_thumb-240x240.jpg new file mode 100644 index 000000000..21bb10051 Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-240x240.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-540x540.jpg b/assets/images/styleguide/news-thumbs/news_thumb-540x540.jpg new file mode 100644 index 000000000..0410f138e Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-540x540.jpg differ diff --git a/assets/images/styleguide/news-thumbs/news_thumb-80x80.jpg b/assets/images/styleguide/news-thumbs/news_thumb-80x80.jpg new file mode 100644 index 000000000..2895d79df Binary files /dev/null and b/assets/images/styleguide/news-thumbs/news_thumb-80x80.jpg differ diff --git a/assets/images/styleguide/people/avatar-120x120.jpg b/assets/images/styleguide/people/avatar-120x120.jpg new file mode 100644 index 000000000..9c88a9ba5 Binary files /dev/null and b/assets/images/styleguide/people/avatar-120x120.jpg differ diff --git a/assets/images/styleguide/people/avatar-160x160.jpg b/assets/images/styleguide/people/avatar-160x160.jpg new file mode 100644 index 000000000..e46580c00 Binary files /dev/null and b/assets/images/styleguide/people/avatar-160x160.jpg differ diff --git a/assets/images/styleguide/people/avatar-180x180.jpg b/assets/images/styleguide/people/avatar-180x180.jpg new file mode 100644 index 000000000..454d51d1e Binary files /dev/null and b/assets/images/styleguide/people/avatar-180x180.jpg differ diff --git a/assets/images/styleguide/people/avatar-256x256.jpg b/assets/images/styleguide/people/avatar-256x256.jpg new file mode 100644 index 000000000..6063e7581 Binary files /dev/null and b/assets/images/styleguide/people/avatar-256x256.jpg differ diff --git a/assets/images/styleguide/people/avatar-60x60.jpg b/assets/images/styleguide/people/avatar-60x60.jpg new file mode 100644 index 000000000..ce7d6fa27 Binary files /dev/null and b/assets/images/styleguide/people/avatar-60x60.jpg differ diff --git a/assets/images/styleguide/people/avatar-80x80.jpg b/assets/images/styleguide/people/avatar-80x80.jpg new file mode 100644 index 000000000..7502a87e6 Binary files /dev/null and b/assets/images/styleguide/people/avatar-80x80.jpg differ diff --git a/assets/images/styleguide/people/avatar-95x95.jpg b/assets/images/styleguide/people/avatar-95x95.jpg new file mode 100644 index 000000000..125b3c372 Binary files /dev/null and b/assets/images/styleguide/people/avatar-95x95.jpg differ diff --git a/assets/images/styleguide/people/portrait-211x300.jpg b/assets/images/styleguide/people/portrait-211x300.jpg new file mode 100644 index 000000000..4ad5499cd Binary files /dev/null and b/assets/images/styleguide/people/portrait-211x300.jpg differ diff --git a/assets/images/styleguide/people/portrait-422x600.jpg b/assets/images/styleguide/people/portrait-422x600.jpg new file mode 100644 index 000000000..e4aff4d2e Binary files /dev/null and b/assets/images/styleguide/people/portrait-422x600.jpg differ diff --git a/assets/images/styleguide/people/portrait-506x720.jpg b/assets/images/styleguide/people/portrait-506x720.jpg new file mode 100644 index 000000000..03e278734 Binary files /dev/null and b/assets/images/styleguide/people/portrait-506x720.jpg differ diff --git a/assets/images/styleguide/people/portrait-535x360.jpg b/assets/images/styleguide/people/portrait-535x360.jpg new file mode 100644 index 000000000..a855eeae6 Binary files /dev/null and b/assets/images/styleguide/people/portrait-535x360.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-1080x1080.jpg b/assets/images/styleguide/teaser/news-teaser-1080x1080.jpg new file mode 100644 index 000000000..c8d895709 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-1080x1080.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-1080x608.jpg b/assets/images/styleguide/teaser/news-teaser-1080x608.jpg new file mode 100644 index 000000000..44883bff4 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-1080x608.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-1140x1140.jpg b/assets/images/styleguide/teaser/news-teaser-1140x1140.jpg new file mode 100644 index 000000000..a6de44377 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-1140x1140.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-280x280.jpg b/assets/images/styleguide/teaser/news-teaser-280x280.jpg new file mode 100644 index 000000000..5a1925383 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-280x280.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-320x180.jpg b/assets/images/styleguide/teaser/news-teaser-320x180.jpg new file mode 100644 index 000000000..37607bcdd Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-320x180.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-360x360.jpg b/assets/images/styleguide/teaser/news-teaser-360x360.jpg new file mode 100644 index 000000000..ec515a935 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-360x360.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-380x214.jpg b/assets/images/styleguide/teaser/news-teaser-380x214.jpg new file mode 100644 index 000000000..f75b2d294 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-380x214.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-480x480.jpg b/assets/images/styleguide/teaser/news-teaser-480x480.jpg new file mode 100644 index 000000000..cb7b3e8e2 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-480x480.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-640x360.jpg b/assets/images/styleguide/teaser/news-teaser-640x360.jpg new file mode 100644 index 000000000..eeb6f2254 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-640x360.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-640x640.jpg b/assets/images/styleguide/teaser/news-teaser-640x640.jpg new file mode 100644 index 000000000..35574c465 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-640x640.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-780x780.jpg b/assets/images/styleguide/teaser/news-teaser-780x780.jpg new file mode 100644 index 000000000..e44e54f15 Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-780x780.jpg differ diff --git a/assets/images/styleguide/teaser/news-teaser-960x960.jpg b/assets/images/styleguide/teaser/news-teaser-960x960.jpg new file mode 100644 index 000000000..d81cbcfda Binary files /dev/null and b/assets/images/styleguide/teaser/news-teaser-960x960.jpg differ diff --git a/package.json b/package.json index b0d200406..2b68ad3c4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "epfl-elements", - "version": "5.0.2", + "version": "5.1.0", "license": "MIT", "repository": { "type": "git", diff --git a/yarn.lock b/yarn.lock index 1f8e6edfd..ff2f96b5c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3532,9 +3532,9 @@ cross-fetch@3.1.5: node-fetch "2.6.7" cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3: - version "7.0.3" - resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" - integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w== + version "7.0.6" + resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.6.tgz#8a58fe78f00dcd70c370451759dfbfaf03e8ee9f" + integrity sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA== dependencies: path-key "^3.1.0" shebang-command "^2.0.0" @@ -4130,9 +4130,9 @@ electron-to-chromium@^1.4.668: integrity sha512-6FApLtsYhDCY0Vglq3AptsdxQ+PJLc6AxlAM0HjEihUAiOPPbkASEsq9gtxUeZY9o0sJIEa3WnF0vVH4VT4iug== elliptic@^6.5.3, elliptic@^6.5.4: - version "6.5.7" - resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.7.tgz#8ec4da2cb2939926a1b9a73619d768207e647c8b" - integrity sha512-ESVCtTwiA+XhY3wyh24QqRGBoP3rEdDUl3EDUUo9tft074fi19IrdpH7hLCMMP3CIj7jb3W96rn8lt/BqIlt5Q== + version "6.6.0" + resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.6.0.tgz#5919ec723286c1edf28685aa89261d4761afa210" + integrity sha512-dpwoQcLc/2WLQvJvLRHKZ+f9FgOdjnq11rurqwekGQygGPsYSK29OMMD2WalatiqQ+XGFDglTNixpPfI+lpaAA== dependencies: bn.js "^4.11.9" brorand "^1.1.0"