From 59ae0efad7b80f25e881d00702b983ec196fedcb Mon Sep 17 00:00:00 2001 From: Chrystal Maria Griffiths Date: Fri, 17 Aug 2018 11:25:34 +0100 Subject: [PATCH 1/4] Templates index page --- .../web/public/stylesheets/app/templates.less | 37 +++++++++++++++++-- 1 file changed, 34 insertions(+), 3 deletions(-) diff --git a/services/web/public/stylesheets/app/templates.less b/services/web/public/stylesheets/app/templates.less index f7d490ff48..d0f357bee2 100644 --- a/services/web/public/stylesheets/app/templates.less +++ b/services/web/public/stylesheets/app/templates.less @@ -11,9 +11,13 @@ .thumbnail { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); + -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); + height: 465px; + margin: 5% 0; + img { width: 100%; + height: 100%; } } @@ -23,11 +27,38 @@ color:@link-color; margin: 10px 0px 10px 20px; } + + display: flex; + justify-content: center; + align-items: center; } .caption { - background: lighten(@gray-lightest, 3%); - border-top: 1px solid #ddd; + text-align:center; + + .description { + font-style: italic; + padding: 5px 0; + } + + } + + /* Media Queries */ + @media (max-width: @screen-md-min) { + .thumbnail { + height: 400px; + width: 300px; + + margin: 5% auto; + } + + img { + width: 90%; + } + + .caption .description { + padding: 5px 50px; + } } } From 6c7301fb09c4841f4b6b5f4bf9638f26ebc5c690 Mon Sep 17 00:00:00 2001 From: Chrystal Griffiths Date: Tue, 21 Aug 2018 13:56:02 +0100 Subject: [PATCH 2/4] Templates detail page --- .../web/public/stylesheets/app/templates.less | 52 ++++++++++++++++--- 1 file changed, 44 insertions(+), 8 deletions(-) diff --git a/services/web/public/stylesheets/app/templates.less b/services/web/public/stylesheets/app/templates.less index d0f357bee2..dbe5746c5c 100644 --- a/services/web/public/stylesheets/app/templates.less +++ b/services/web/public/stylesheets/app/templates.less @@ -1,16 +1,31 @@ -.template-page-header { - padding-top: unit(@line-height-base,rem); - h1, h2 { - margin-top: 6px; - margin-right: @line-height-base * 5; - line-height: 1; +.template-title { + margin-bottom: 40px; +} + +.field-title { + font-weight: bold; +} + +.cta-links { + margin-top: 30px; + + .cta-link { + display: inline; } + + .cta-link.btn { + margin: 0 10px; + } +} + +.tag-link { + margin-right: 5px; } .template-thumbnail { .thumbnail { - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); height: 465px; margin: 5% 0; @@ -67,7 +82,25 @@ margin-top: 0px; } +.section-preview { + margin-top: 40px; + .abstract { + padding: 0 10% 10% 0; + + @media (max-width: @screen-md-min) { + padding: 5%; + } + } +} + +.section-tags { + margin: 40px 0; +} + +.section-find-more { + padding-left: 5%; +} .download-buttons, .social_buttons { padding-top: 20px; @@ -90,12 +123,15 @@ color:@link-color; } img { - max-width: 100%; + max-width: 100%; height: auto; } } .template-large-pdf-preview { + border: solid 1px @gray-lightest; + margin-bottom: 30px; + img { max-width: 100%; } From f3c47320cf5423e38bfe4b8736366bedf1684a5d Mon Sep 17 00:00:00 2001 From: Chrystal Griffiths Date: Fri, 24 Aug 2018 15:23:12 +0100 Subject: [PATCH 3/4] Tidy up --- .../stylesheets/_ol_style_includes.less | 1 + .../public/stylesheets/app/templates-v2.less | 113 ++++++++++++++++++ .../web/public/stylesheets/app/templates.less | 86 ++----------- 3 files changed, 124 insertions(+), 76 deletions(-) create mode 100644 services/web/public/stylesheets/app/templates-v2.less diff --git a/services/web/public/stylesheets/_ol_style_includes.less b/services/web/public/stylesheets/_ol_style_includes.less index 70820f9b68..c55729976d 100644 --- a/services/web/public/stylesheets/_ol_style_includes.less +++ b/services/web/public/stylesheets/_ol_style_includes.less @@ -1,3 +1,4 @@ @import "app/sidebar-v2-dash-pane.less"; @import "app/front-chat-widget.less"; @import "app/ol-chat.less"; +@import "app/templates-v2.less"; diff --git a/services/web/public/stylesheets/app/templates-v2.less b/services/web/public/stylesheets/app/templates-v2.less new file mode 100644 index 0000000000..c9e826bb30 --- /dev/null +++ b/services/web/public/stylesheets/app/templates-v2.less @@ -0,0 +1,113 @@ +.template-title { + margin-bottom: @margin-xl; +} + +.field-title { + font-weight: bold; +} + +.filters { + float: right; + margin-bottom: @margin-lg; + + @media (max-width: @screen-md-min) { + float: none; + } +} + +.cta-links { + margin-top: @margin-lg; + + .cta-link.btn { + margin: 0 @margin-sm; + } +} + +.tag-link { + margin-right: @margin-xs; +} + +.template-thumbnail { + + .thumbnail { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); + height: 465px; + margin: 5% 0; + + &.thumbnail-tag { + height: 100px; + } + + img { + width: 100%; + height: 100%; + } + } + + a { + padding:0px; + h3 { + color:@link-color; + margin: 10px 0px 10px 20px; + } + + display: flex; + justify-content: center; + align-items: center; + } + + .caption { + // Override ShareLatex template styles + background: none; + border: none; + + text-align: center; + + .description { + font-style: italic; + padding: 5px 0; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + + } + + /* Media Queries */ + @media (max-width: @screen-md-min) { + .thumbnail { + height: 400px; + width: 300px; + + margin: 5% auto; + } + + img { + width: 90%; + } + + .caption .description { + padding: 5px 50px; + } + } + +} + + .section-preview { + margin-top: @margin-xl; + + .abstract { + padding-right:10%; + padding-bottom: 10%; + + @media (max-width: @screen-md-min) { + padding: 5%; + } + } + } + + .section-tags { + margin-bottom: @margin-xl; + margin-top: @margin-xl; + } \ No newline at end of file diff --git a/services/web/public/stylesheets/app/templates.less b/services/web/public/stylesheets/app/templates.less index dbe5746c5c..d841d82cf7 100644 --- a/services/web/public/stylesheets/app/templates.less +++ b/services/web/public/stylesheets/app/templates.less @@ -1,38 +1,19 @@ -.template-title { - margin-bottom: 40px; -} - -.field-title { - font-weight: bold; -} - -.cta-links { - margin-top: 30px; - - .cta-link { - display: inline; +.template-page-header { + padding-top: unit(@line-height-base,rem); + h1, h2 { + margin-top: 6px; + margin-right: @line-height-base * 5; + line-height: 1; } - - .cta-link.btn { - margin: 0 10px; - } -} - -.tag-link { - margin-right: 5px; } .template-thumbnail { .thumbnail { - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); - height: 465px; - margin: 5% 0; - + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.1); img { width: 100%; - height: 100%; } } @@ -42,38 +23,11 @@ color:@link-color; margin: 10px 0px 10px 20px; } - - display: flex; - justify-content: center; - align-items: center; } .caption { - text-align:center; - - .description { - font-style: italic; - padding: 5px 0; - } - - } - - /* Media Queries */ - @media (max-width: @screen-md-min) { - .thumbnail { - height: 400px; - width: 300px; - - margin: 5% auto; - } - - img { - width: 90%; - } - - .caption .description { - padding: 5px 50px; - } + background: lighten(@gray-lightest, 3%); + border-top: 1px solid #ddd; } } @@ -82,26 +36,6 @@ margin-top: 0px; } -.section-preview { - margin-top: 40px; - - .abstract { - padding: 0 10% 10% 0; - - @media (max-width: @screen-md-min) { - padding: 5%; - } - } -} - -.section-tags { - margin: 40px 0; -} - -.section-find-more { - padding-left: 5%; -} - .download-buttons, .social_buttons { padding-top: 20px; } From 0d283f103a1e03460d9075258b6792301332e59d Mon Sep 17 00:00:00 2001 From: Chrystal Griffiths Date: Fri, 31 Aug 2018 17:05:48 +0100 Subject: [PATCH 4/4] Move remaining new styles to v2-templates --- services/web/public/stylesheets/app/templates-v2.less | 7 ++++++- services/web/public/stylesheets/app/templates.less | 3 --- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/services/web/public/stylesheets/app/templates-v2.less b/services/web/public/stylesheets/app/templates-v2.less index c9e826bb30..1cdc054398 100644 --- a/services/web/public/stylesheets/app/templates-v2.less +++ b/services/web/public/stylesheets/app/templates-v2.less @@ -110,4 +110,9 @@ .section-tags { margin-bottom: @margin-xl; margin-top: @margin-xl; - } \ No newline at end of file + } + + .template-large-pdf-preview { + border: solid 1px @gray-lightest; + margin-bottom: 30px; + } \ No newline at end of file diff --git a/services/web/public/stylesheets/app/templates.less b/services/web/public/stylesheets/app/templates.less index d841d82cf7..0f876bd475 100644 --- a/services/web/public/stylesheets/app/templates.less +++ b/services/web/public/stylesheets/app/templates.less @@ -63,9 +63,6 @@ } .template-large-pdf-preview { - border: solid 1px @gray-lightest; - margin-bottom: 30px; - img { max-width: 100%; }