From: Jérémy Fabre Date: Wed, 8 Feb 2017 11:15:55 +0000 (+0100) Subject: Custompage and event list first implementation X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=6321299afaa1d2fc884bd1d90a93b2f56b385e3f;p=mezzo.git Custompage and event list first implementation --- diff --git a/app/static/src/sass/global/_buttons.scss b/app/static/src/sass/global/_buttons.scss index 56c1c88c..896a45d4 100755 --- a/app/static/src/sass/global/_buttons.scss +++ b/app/static/src/sass/global/_buttons.scss @@ -80,6 +80,20 @@ $module: ".button"; } + &--accent { + + background-color: $color-accent; + color: white; + border: 1px solid $color-accent; + + &:hover { + background-color: white; + color: $color-accent; + border: 1px solid white; + } + + } + &--small { @include font-size(m); @include padding(.18 1); diff --git a/app/static/src/sass/modules/_page.scss b/app/static/src/sass/modules/_page.scss index 37289e2d..b99f1da0 100644 --- a/app/static/src/sass/modules/_page.scss +++ b/app/static/src/sass/modules/_page.scss @@ -23,6 +23,7 @@ $module: ".page"; #{$module} { min-height: 500px; + @include margin-top(5); @include mq($until: sm) { min-height: 0; @@ -134,7 +135,6 @@ $module: ".page"; &__block { @include padding-bottom(1); - background-color: white; &--yellow { diff --git a/app/static/src/sass/modules/_section-title.scss b/app/static/src/sass/modules/_section-title.scss index 1dcd1c85..4c59094d 100644 --- a/app/static/src/sass/modules/_section-title.scss +++ b/app/static/src/sass/modules/_section-title.scss @@ -9,6 +9,7 @@ $module: ".section-title"; text-align: center; color: white; display: inline-block; + line-height: 1.5em; @include margin-bottom(4); @include margin-top(0); @@ -31,7 +32,7 @@ $module: ".section-title"; color: $color-accent; } } - + &--main { border-color: $color-main; &:before { diff --git a/app/static/src/sass/modules/boxes/_article-box.scss b/app/static/src/sass/modules/boxes/_article-box.scss index 277a4143..057d3c20 100644 --- a/app/static/src/sass/modules/boxes/_article-box.scss +++ b/app/static/src/sass/modules/boxes/_article-box.scss @@ -25,9 +25,9 @@ $module: ".article-box"; position: relative; display: block; @include margin-bottom(1); - @include transition(all 0.25s ease-in-out); + @include transition(all 0.5s ease-in-out); - border: 1px solid $color-main; + border: 1px solid rgba($color-main, 0.35); @include padding(1); .slider-home & { @@ -37,6 +37,7 @@ $module: ".article-box"; &:hover { + border: 1px solid rgba($color-main, 1); background: $color-main; .article-box__image-container { diff --git a/app/static/src/sass/modules/boxes/_event-line-box.scss b/app/static/src/sass/modules/boxes/_event-line-box.scss index f8cea2a7..a2f993e2 100644 --- a/app/static/src/sass/modules/boxes/_event-line-box.scss +++ b/app/static/src/sass/modules/boxes/_event-line-box.scss @@ -22,26 +22,51 @@ $module: ".event-line-box"; #{$module} { - &__content { + position: relative; + display: block; - &:after { + border: 1px solid rgba($color-main, 0.35); - content: ""; - display: block; - width: 100%; - height: 1px; - background: rgba(0, 0, 0, 0.25); + background: $color-background; + @include transition(all 0.5s ease-in-out); + @include margin-bottom(5); - @include margin(1 0 1 0); + &:hover { - @include mq($until: sm) { - @include margin(1 0 1 0); - } + border: 1px solid rgba($color-main, 1); + background: black; + + .event-line-box__image { + + -webkit-filter: grayscale(0); + filter: grayscale(0); + + } + + .event-line-box__category { + + background: $color-main; + + } + + .event-line-box__date { + + color: $color-main; } } + &__content { + + position: absolute; + top: 0; + left: 0; + height: 390px; + width: 100%; + + } + &__month { @include font-size(l); @@ -56,7 +81,22 @@ $module: ".event-line-box"; &__image { - @include fluid-aspect(200 140); + @include fluid-aspect(1030 400); + + @include transition(all 0.5s ease-in-out); + + -webkit-filter: grayscale(1); + filter: grayscale(1); + mix-blend-mode: screen; + + } + + &__button { + + position: absolute; + top: 50%; + right: 1rem; + @include transform(translateY(-50%)); } @@ -66,18 +106,50 @@ $module: ".event-line-box"; } + &__category { + + position: absolute; + top: 50%; + left: 0; + background: white; + color: $color-background; + text-align: right; + text-transform: uppercase; + @include font-size(s); + @include line-height(1.25); + @include typeface(sans-serif); + font-weight: weight(regular); + + @include padding(0.1 .5 0.1 .5); + @include transform(translateY(-50%)); + @include transition(all 0.5s ease-in-out); + width: 10rem; + + } + + &__body { + + position: absolute; + top: 50%; + left: 12rem; + @include transform(translateY(-50%)); + + } + &__title { - @include font-size(xxl); + font-size: 36px; @include line-height(1.25); @include typeface(sans-serif); - font-weight: weight(bold); + font-weight: weight(regular); + + color: $color-main; - margin-top: 0; - @include margin-bottom(1); + margin: 0; a:not(.button) { + color: $color-main; border: 0; &:hover { @@ -88,6 +160,29 @@ $module: ".event-line-box"; } + &__location { + + @include font-size(s); + @include line-height(1.25); + @include typeface(sans-serif); + font-weight: weight(regular); + color: $color-main; + + } + + &__date { + + @include font-size(l); + @include line-height(1.25); + @include typeface(sans-serif); + font-weight: weight(regular); + color: white; + @include transition(all 0.5s ease-in-out); + + @include margin-top(1); + + } + &__desc { @include font-size(m); @@ -95,6 +190,8 @@ $module: ".event-line-box"; @include typeface(serif); font-weight: weight(light); + color: $color-main; + } } diff --git a/app/templates/agenda/event_list.html b/app/templates/agenda/event_list.html index f64ee271..e0386e28 100644 --- a/app/templates/agenda/event_list.html +++ b/app/templates/agenda/event_list.html @@ -5,7 +5,7 @@ {% if page %} {{ page.title }} {% else %} - {% trans "Rendez-vous in Paris" %} + {% trans "Events" %} {% endif %} {% endblock %} @@ -33,125 +33,23 @@
-
-

- {% if tag and tag|tag_is_excluded %} - {% trans "On tour" %} - {% elif is_archive %} - {% trans 'Archives' %} - {% else %} - {{ page.title }} - {% endif %} -

+
+

{% trans "Events" %}

-
-
- {% if tag and not tag|tag_is_excluded or not tag and not is_archive %} - - {% endif %} -
- {% if not tag and not is_archive %} - {% page_menu "pages/menus/current_tree_event.html" %} - {% else %} - - {% endif %} - - {% if tag and not tag|tag_is_excluded or not tag and not is_archive %} - - {% endif %} -
-
-
- -
+
{% for event in events.object_list %} {% include 'agenda/includes/event_linecard.html' %} {% endfor %} - {% if tag and not tag|tag_is_excluded or not tag and not is_archive %} - - {% endif %}
+
diff --git a/app/templates/agenda/includes/event_linecard.html b/app/templates/agenda/includes/event_linecard.html index 2d729f22..803218b4 100644 --- a/app/templates/agenda/includes/event_linecard.html +++ b/app/templates/agenda/includes/event_linecard.html @@ -1,56 +1,75 @@ {% load i18n future mezzanine_tags event_tags keyword_tags disqus_tags organization_tags %} -
- {% ifchanged event.start.month %} -
-

{{ event.start|date:'F' }}

-
- {% endifchanged %} -
-
-
- {% with True as unit_booking %} - {% include 'agenda/includes/event_metainfo_line.html' %} - {% endwith %} -
-
- {% with event.images.all|get_type:'card' as images %} - {% if images %} - +
+ +
+ + + + {% with event.images.all|get_type:'card' as images %} + {% if images %} +
+ +
+ {% else %} + {% with event.parent.images.all|get_type:'card' as images %} + {% if images %}
- +
- - {% else %} - {% with event.parent.images.all|get_type:'card' as images %} - {% if images %} - -
- -
- + {% else %} +
+ +
+ {% endif %} + {% endwith %} + {% endif %} + {% endwith %} + +
+ + {% if event.prices.all and not is_archive %} + {% if event.trainings.all|length %} + {% with event.links.all as links %} + {% if links %} + + + {% trans "Reserve" %} + + {% endif %} {% endwith %} + {% else %} + + + {% trans "Reserve" %} + + {% endif %} - {% endwith %} -
-
+ {% endif %} + {% keywords_for event as tags %} -
-
- {% if event.departments.all %}{{ event.departments.all.0.department.name }}{% else %}{{ event.parent.departments.all.0.department.name }}{% endif %} -
-
- {% if event.category %}{{ event.category }}{% else %}{{ event.parent.category }}{% endif %} -
+ +
+ {% if event.category %}{{ event.category }}{% else %}{{ event.parent.category }}{% endif %}
-

- {{ event.title }} -

-
- {% if event.description %}{{ event.description|slice:":100" }}{% else %}{{ event.parent.description|slice:":100" }}{% endif %} + +
+ {% if event.location %} +
{{ event.location }}
+ {% endif %} +

+ {{ event.title }} +

+
+ {% include 'agenda/includes/event_date_line.html' with object=event %} +
+
-
+ + +
+
diff --git a/app/templates/core/inc/block.html b/app/templates/core/inc/block.html index bdc2f697..0cda6024 100644 --- a/app/templates/core/inc/block.html +++ b/app/templates/core/inc/block.html @@ -1,6 +1,6 @@ {% load i18n mezzanine_tags keyword_tags pages_tags organization_tags %} {% if blocks %} -
+
{% if blocks.first %}
{% endif %} @@ -12,7 +12,7 @@
-
+
{% editable block.title %}

{{ block.title }}

{% endeditable %} diff --git a/app/templates/core/inc/related_content.html b/app/templates/core/inc/related_content.html index ff4b14e2..e8f61a9a 100644 --- a/app/templates/core/inc/related_content.html +++ b/app/templates/core/inc/related_content.html @@ -1,10 +1,10 @@ {% load i18n mezzanine_tags keyword_tags organization_tags pages_tags %} {% if dynamic_content.first.content_object %}
-
+
-
+

{% if object.related_title.title %}{{ object.related_title.title }}{% else %}{% trans "Also discover" %}{% endif %}

diff --git a/app/templates/pages/custompage.html b/app/templates/pages/custompage.html index b9cf1ab7..6e324e11 100644 --- a/app/templates/pages/custompage.html +++ b/app/templates/pages/custompage.html @@ -16,7 +16,7 @@ {% block page_title %} {% editable page.custompage.title %} -

{{ page.custompage.title }}

+

{{ page.custompage.title }}

{% endeditable %} {% endblock %} diff --git a/app/templates/pages/page.html b/app/templates/pages/page.html index 5ef745fb..bd585525 100644 --- a/app/templates/pages/page.html +++ b/app/templates/pages/page.html @@ -22,16 +22,7 @@
-
- {% block page_tags %} - {% endblock %} -
- -
- -
- -
+
{% block page_title %} {{ page.title }} {% endblock %} @@ -41,19 +32,7 @@
-
-
- {% block page_sidebar %} - {% if page.get_ascendants|length < 2 %} - {% page_menu "pages/menus/current_tree_primary.html" %} - {% endif %} - {% if page.get_ascendants|length == 2 %} - {% page_menu "pages/menus/current_tree_secondary.html" %} - {% endif %} - {% endblock %} -
-
-
+
{% block page_content %} {{ page.content }} {% endblock %} @@ -104,7 +83,7 @@ {% endfor %} {% endblock %} -
+
{% block page_person_list %} {% endblock %} @@ -152,7 +131,7 @@
-
+
    {% include 'core/inc/logo.html' %}
@@ -169,7 +148,7 @@
-
+
{% block page_related_content %} {% with dynamic_content=page.dynamic_content_pages.all object=page %}