From f03ead6210098c7412c5c10ec3179c1ddf2d79b5 Mon Sep 17 00:00:00 2001 From: Arthur Vakorin Date: Sat, 4 Aug 2018 22:33:25 +0300 Subject: [PATCH] issue #1068: Adds image style to views and less-code for events pages --- profiles/drupalru/themes/druru/css/style.css | 37 ++++++++++++-- .../druru/less/drupal/components/_event.less | 15 +++--- .../druru/less/drupal/components/_pages.less | 48 +++++++++++++++++++ .../druru/less/drupal/modules/_views.less | 9 +++- .../includes/views/events-past-page.inc | 2 +- .../includes/views/events-upcoming-block.inc | 2 +- .../includes/views/events-upcoming-page.inc | 2 +- 7 files changed, 101 insertions(+), 14 deletions(-) diff --git a/profiles/drupalru/themes/druru/css/style.css b/profiles/drupalru/themes/druru/css/style.css index cb96f085..718255bc 100644 --- a/profiles/drupalru/themes/druru/css/style.css +++ b/profiles/drupalru/themes/druru/css/style.css @@ -8733,6 +8733,39 @@ body .frontpage-list .list-group .list-group-item:hover, body .alttracker.list-group .list-group-item:hover { background: rgba(0, 0, 0, 0.1); } +body.page-events .node-event img { + max-width: 100%; + height: auto; +} +body.page-events .node-event iframe { + max-width: 100%; +} +@media screen and (min-width: 748px) { + body.page-events #block-system-main { + padding-left: 60px; + margin-left: 96px; + border-left: 1px solid #6ab7dd; + } + body.page-events .event-date { + position: absolute; + left: -165.25px; + line-height: 1.3em; + font-size: 0.5em; + color: #df9b10; + } + body.page-events .event-date:after { + display: block; + content: ''; + position: absolute; + width: 13px; + height: 13px; + border-radius: 50%; + border: 1px solid; + right: -35px; + top: 0.3em; + background: #fafafa; + } +} .pager-wrapper { clear: left; } @@ -9921,10 +9954,6 @@ fieldset[disabled] #block-advanced-sphinx-searchbox .search-sphinx:focus + butto .node-event .details { margin-left: 0; } -.node-event .image img { - max-width: 100%; - height: auto; -} .node-event .event-type { margin-top: 5px; } diff --git a/profiles/drupalru/themes/druru/less/drupal/components/_event.less b/profiles/drupalru/themes/druru/less/drupal/components/_event.less index 3fee4bdb..3c026363 100644 --- a/profiles/drupalru/themes/druru/less/drupal/components/_event.less +++ b/profiles/drupalru/themes/druru/less/drupal/components/_event.less @@ -14,6 +14,7 @@ .image { margin-bottom: @padding-base-vertical; } + > * { margin-bottom: @padding-small-vertical; @@ -36,15 +37,19 @@ float: left; } } + &.image { margin-bottom: @padding-large-vertical; } + &.website:before { content: "\f0c1"; } + &.address:before { content: "\f041"; } + &.event-type { &:before { content: "\f05a"; @@ -53,10 +58,12 @@ display: inline; } } + &.date_time { &:before { content: "\f073"; } + a > * { margin-right: @padding-small-horizontal; display: inline; @@ -64,15 +71,11 @@ } } } + .details { margin-left: 0; } - .image { - img { - max-width: 100%; - height: auto; - } - } + .event-type { margin-top: 5px; } diff --git a/profiles/drupalru/themes/druru/less/drupal/components/_pages.less b/profiles/drupalru/themes/druru/less/drupal/components/_pages.less index f58d45a3..99ad41cd 100644 --- a/profiles/drupalru/themes/druru/less/drupal/components/_pages.less +++ b/profiles/drupalru/themes/druru/less/drupal/components/_pages.less @@ -167,4 +167,52 @@ body { } } } + + &.page-events { + @timeline-width: 96px; + @point-size: 13px; + + .node-event { + img { + max-width: 100%; + height: auto; + } + + // Temp workaround to prevent embedded videos from overlapping container + // @todo: Refactor embedding of external videos + // see https://getbootstrap.com/docs/3.3/components/#responsive-embed + iframe { + max-width: 100%; + } + } + + @media @tablet { + #block-system-main { + padding-left: @grid-gutter-width*2; + margin-left: @timeline-width; + border-left: 1px solid @brand-info; + } + + .event-date { + position: absolute; + left: -(@timeline-width + (@grid-gutter-width*2.5) - (@well-padding-lg-horizontal/2) + (@point-size/2)-1px); + line-height: 1.3em; + font-size: 0.5em; + color: @brand-accent; + + &:after { + display: block; + content: ''; + position: absolute; + width: @point-size; + height: @point-size; + border-radius: 50%; + border: 1px solid; + right: -35px; + top: .3em; + background: @body-bg; + } + } + } + } } diff --git a/profiles/drupalru/themes/druru/less/drupal/modules/_views.less b/profiles/drupalru/themes/druru/less/drupal/modules/_views.less index 3066e773..9f93b4ed 100644 --- a/profiles/drupalru/themes/druru/less/drupal/modules/_views.less +++ b/profiles/drupalru/themes/druru/less/drupal/modules/_views.less @@ -2,9 +2,11 @@ .views-row { border-bottom: 1px solid #e6e6e6; border-top: 1px solid #fff; + &:last-child { border-bottom: none; } + &:first-child { border-top: none; } @@ -15,6 +17,7 @@ .row-title { float: left; width: 90%; + > a { text-overflow: ellipsis; white-space: nowrap; @@ -23,22 +26,26 @@ max-width: 100%; float: left; } + > sup + a { padding-right: 3px; max-width: 75%; } + @media @phone { width: 95%; > sup + a { max-width: 85%; } } + @media @tablet { width: 97%; > sup + a { max-width: 93%; } } + @media @very-smalld { width: 91%; > sup + a { @@ -67,4 +74,4 @@ } } } -} \ No newline at end of file +} diff --git a/sites/all/modules/custom/drurum/includes/views/events-past-page.inc b/sites/all/modules/custom/drurum/includes/views/events-past-page.inc index 9275488b..6288cd96 100644 --- a/sites/all/modules/custom/drurum/includes/views/events-past-page.inc +++ b/sites/all/modules/custom/drurum/includes/views/events-past-page.inc @@ -36,7 +36,7 @@ $handler->display->display_options['fields']['field_event_image']['label'] = ''; $handler->display->display_options['fields']['field_event_image']['element_label_colon'] = FALSE; $handler->display->display_options['fields']['field_event_image']['click_sort_column'] = 'fid'; $handler->display->display_options['fields']['field_event_image']['settings'] = array( - 'image_style' => '', + 'image_style' => 'event_teaser', 'image_link' => 'content', ); /* Field: Content: Title */ diff --git a/sites/all/modules/custom/drurum/includes/views/events-upcoming-block.inc b/sites/all/modules/custom/drurum/includes/views/events-upcoming-block.inc index b4926458..04f71efc 100644 --- a/sites/all/modules/custom/drurum/includes/views/events-upcoming-block.inc +++ b/sites/all/modules/custom/drurum/includes/views/events-upcoming-block.inc @@ -36,7 +36,7 @@ $handler->display->display_options['fields']['field_event_image']['label'] = ''; $handler->display->display_options['fields']['field_event_image']['element_label_colon'] = FALSE; $handler->display->display_options['fields']['field_event_image']['click_sort_column'] = 'fid'; $handler->display->display_options['fields']['field_event_image']['settings'] = array( - 'image_style' => '', + 'image_style' => 'event_teaser', 'image_link' => 'content', ); /* Field: Content: Title */ diff --git a/sites/all/modules/custom/drurum/includes/views/events-upcoming-page.inc b/sites/all/modules/custom/drurum/includes/views/events-upcoming-page.inc index 9e7d5c24..12ddebe6 100644 --- a/sites/all/modules/custom/drurum/includes/views/events-upcoming-page.inc +++ b/sites/all/modules/custom/drurum/includes/views/events-upcoming-page.inc @@ -36,7 +36,7 @@ $handler->display->display_options['fields']['field_event_image']['label'] = ''; $handler->display->display_options['fields']['field_event_image']['element_label_colon'] = FALSE; $handler->display->display_options['fields']['field_event_image']['click_sort_column'] = 'fid'; $handler->display->display_options['fields']['field_event_image']['settings'] = array( - 'image_style' => '', + 'image_style' => 'event_teaser', 'image_link' => 'content', ); /* Field: Content: Title */