From 701378d02ce72291864036d6d955d6d911004524 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Thu, 8 Jul 2021 01:45:39 +0200 Subject: [PATCH] Add padding to the whole header Instead of adding the padding to each individual element inside the container, why not adding padding to the container itself? The answer is "because we want the background of the children elements to take the width of the whole screen". But this generates either HTML cluttered with elements to add padding or repetitive padding definitions in the CSS. So now we only define the padding once, and when an element requires a full width background or border, we use the `full-width-background` mixin. In this case the code is a bit more complex because the header is also used in the dashboard and admin layouts: * In the public layout, the body has a margin, so we include the mixin to take margin into account * In the dashboard layout, the header itself has a margin, so we include the same mixin * In the admin layout, the headet doesn't have a margin but gets the whole width, so in this case we include the mixin which dosen't take the margin into account In the future, the idea is to apply this principle to the element and remove the `@include grid-column-gutter` in the CSS as well as the `small-12 column` classes in the HTML. Note we use the `calc()` function inside the mixin instead of using it in the `$full-width-margin` variable. That way we avoid nested `calc()` operations, which don't work in Internet Explorer. Also note we're using `flex-grow: 1` to make one element appear on the left of the screen and the other one on the right. It would be easier to use `justify-content: space-between` (which is actually the default for the top-bar element). However, there's a bug in Internet Explorer and old versions of Firefox; they include the absolutely-positioned `::before` element we use to set the full width background when calculating where to position the elements. The bug was fixed in Firefox 52 (released in 2017). Finally, we're removing the padding from our logo. In order to allow logos like the new one and at the same time provide backwards compatibility to logos in existing CONSUL installations, we're relaxing the validation rule for the logo width. --- app/assets/images/logo_header.png | Bin 3655 -> 3077 bytes app/assets/stylesheets/_consul_settings.scss | 2 +- app/assets/stylesheets/admin.scss | 14 ++++---- app/assets/stylesheets/layout.scss | 32 +++++++++--------- app/assets/stylesheets/mixins/layouts.scss | 33 +++++++++++++++---- app/models/site_customization/image.rb | 7 +++- spec/factories/administration.rb | 5 +++ spec/fixtures/files/logo_header-260x80.png | Bin 0 -> 3655 bytes spec/fixtures/files/logo_header.png | Bin 3655 -> 3077 bytes spec/models/site_customization/image_spec.rb | 29 ++++++++++++++++ 10 files changed, 92 insertions(+), 30 deletions(-) create mode 100644 spec/fixtures/files/logo_header-260x80.png create mode 100644 spec/models/site_customization/image_spec.rb diff --git a/app/assets/images/logo_header.png b/app/assets/images/logo_header.png index 84478da8325603c1e746a619ef49cdf6dc514f56..a43ca626fa1faf35690209c1ecef30f89e8d9e80 100644 GIT binary patch literal 3077 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 literal 3655 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 diff --git a/app/assets/stylesheets/_consul_settings.scss b/app/assets/stylesheets/_consul_settings.scss index 0410655ab..ea97131f6 100644 --- a/app/assets/stylesheets/_consul_settings.scss +++ b/app/assets/stylesheets/_consul_settings.scss @@ -49,7 +49,7 @@ $show-header-for-stacked: true !default; // -------------------- $body-margin: calc(50vw - #{$global-width / 2}) !default; -$full-width-margin: calc(#{$global-width / 2} - 50vw) !default; +$full-width-margin: #{$global-width / 2} - 50vw !default; $base-font-size: rem-calc(17) !default; $base-line: rem-calc(26) !default; diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 4cce7b027..05581b774 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -31,6 +31,14 @@ $table-header: #ecf1f6; .admin { @include admin-layout; + > header { + border-bottom: 1px solid #eee; + + > * { + @include full-width-background($adjust-margin: false, $adjust-padding: true); + } + } + h2 { font-weight: 100; margin-bottom: $line-height; @@ -56,17 +64,12 @@ $table-header: #ecf1f6; background: #000; color: $white; - &::before { - content: none; - } - a { line-height: rem-calc($line-height * 1.5); } } .top-bar { - border-bottom: 1px solid #eee; height: auto; padding-top: $line-height / 2; @@ -118,7 +121,6 @@ $table-header: #ecf1f6; margin-bottom: 0; @include breakpoint(medium) { - margin-left: $line-height / 2; margin-top: 0; } diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index 4cdc650f5..06f415467 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -480,6 +480,7 @@ a { body > header, .wrapper > header { + @include grid-column-gutter; margin-bottom: $line-height; @include breakpoint(small down) { @@ -519,9 +520,15 @@ body > header, .public > .wrapper > header, .proposal-dashboard > header { - @extend %brand-background; @include full-width-border(bottom, 1px solid $border); - @include full-width-background; + + > * { + @include full-width-background($adjust-padding: true); + } + + .top-bar { + @extend %brand-background; + } } .proposal-dashboard > header { @@ -534,16 +541,18 @@ body > header, .top-bar { background-color: inherit; - padding-bottom: 0; - padding-top: 0; + padding: 0; @include breakpoint(medium) { - padding: 0; + justify-content: flex-start; + + .top-bar-title { + flex-grow: 1; + } } ul { background: none; - padding-right: rem-calc(15); } .menu > li { @@ -603,6 +612,7 @@ body > header, .top-bar-title { line-height: $line-height; + margin-right: 0; a img { height: rem-calc(48); @@ -649,9 +659,8 @@ body > header, } .top-links { - @include full-width-background; - @include grid-column-gutter; background: $dark; + color: $white; display: flex; flex-wrap: wrap; font-size: $small-font-size; @@ -691,8 +700,6 @@ body > header, } .subnavigation { - @include full-width-background; - @include grid-column-gutter; display: flex; flex-direction: column; @@ -787,11 +794,6 @@ body > header, } } -.subnavigation-with-top-links { - padding-left: 0; - padding-right: 0; -} - .top-bar-right { .is-active { diff --git a/app/assets/stylesheets/mixins/layouts.scss b/app/assets/stylesheets/mixins/layouts.scss index b2b2a073c..445e8e6f0 100644 --- a/app/assets/stylesheets/mixins/layouts.scss +++ b/app/assets/stylesheets/mixins/layouts.scss @@ -23,7 +23,8 @@ } } -@mixin full-width-cover { +@mixin full-width-cover($adjust-margin: true, $adjust-padding: false) { + $global-padding: rem-calc(map-get($grid-column-gutter, medium)) / 2; bottom: 0; content: ""; display: block; @@ -33,27 +34,45 @@ right: 0; top: 0; + @if $adjust-padding { + $small-padding: rem-calc(map-get($grid-column-gutter, small)) / 2; + + left: -$small-padding; + right: -$small-padding; + + @include breakpoint(medium) { + left: -$global-padding; + right: -$global-padding; + } + } + @include breakpoint($global-width) { - left: $full-width-margin; - right: $full-width-margin; + + @if $adjust-padding and $adjust-margin { + left: calc(#{$full-width-margin} - #{$global-padding}); + right: calc(#{$full-width-margin} - #{$global-padding}); + } @else if $adjust-margin { + left: calc(#{$full-width-margin}); + right: calc(#{$full-width-margin}); + } } } -@mixin full-width-background { +@mixin full-width-background($adjust-margin: true, $adjust-padding: false) { position: relative; &::before { - @include full-width-cover; + @include full-width-cover($adjust-margin: $adjust-margin, $adjust-padding: $adjust-padding); background: inherit; z-index: -1; } } -@mixin full-width-border($position, $border) { +@mixin full-width-border($position, $border, $adjust-margin: true, $adjust-padding: false) { position: relative; &::after { - @include full-width-cover; + @include full-width-cover($adjust-margin: $adjust-margin, $adjust-padding: $adjust-padding); border-#{$position}: $border; } } diff --git a/app/models/site_customization/image.rb b/app/models/site_customization/image.rb index 77f0e16ab..fc6bcfd71 100644 --- a/app/models/site_customization/image.rb +++ b/app/models/site_customization/image.rb @@ -43,7 +43,12 @@ class SiteCustomization::Image < ApplicationRecord dimensions = Paperclip::Geometry.from_file(image.queued_for_write[:original].path) - errors.add(:image, :image_width, required_width: required_width) unless dimensions.width == required_width + if name == "logo_header" + errors.add(:image, :image_width, required_width: required_width) unless dimensions.width <= required_width + else + errors.add(:image, :image_width, required_width: required_width) unless dimensions.width == required_width + end + errors.add(:image, :image_height, required_height: required_height) unless dimensions.height == required_height end end diff --git a/spec/factories/administration.rb b/spec/factories/administration.rb index 7edf4c5f2..c49e06881 100644 --- a/spec/factories/administration.rb +++ b/spec/factories/administration.rb @@ -57,6 +57,11 @@ FactoryBot.define do body { "Some top links content" } end + factory :site_customization_image, class: "SiteCustomization::Image" do + image { File.new("spec/fixtures/files/logo_header.png") } + name { "logo_header" } + end + factory :map_location do latitude { 51.48 } longitude { 0.0 } diff --git a/spec/fixtures/files/logo_header-260x80.png b/spec/fixtures/files/logo_header-260x80.png new file mode 100644 index 0000000000000000000000000000000000000000..84478da8325603c1e746a619ef49cdf6dc514f56 GIT binary patch literal 3655 zcmbtXc|4T+8h@3Tj1VajGX~ks!VELa*v6hnc1dGqWMY=aU@WDO^$6Lbn>I!za_NvY zQAmr*t&YSLIkqW8mTY%)>)iXtx#x2~pZostzR&Z#&-Z!0&+>Uc?=RJLzuh*8-4Xx* zY;&+Dx&eTQs8DtVi3#uPN5BEXha$(un{$vE#EB%asemPg8AydX&`C$BZd4K_>i8q7 z831h7qPcr>yq)*q$V|EcX~V~WOJ@nu0AOa$Ws%4sR1P$ddX&b%!=@VV!Jsq>9_EF1 zMmV#qslhb+Xg2j=^nQ18bO;$sfteGaW?Y;w0G-MqLAmr$Mi`EZhkcKW6UrNAI1KvT zg%g5@{fm^hvn$k^$)-Zl1{i%Z($EBIj5R=_u_h=ZJtzu+#J~|)IMPTTfy5!OI0O>< zG3+8ZGI5<2qGSVQ@(16K43P)nGSU3U&N1^nE9{OQX3=WB_ z&j?fd8G%R*BeQ8N4vooxZbT#nGQ&A|n2_neN}#ixo&N~T2>a0}VawoL5(|zrK)~tr zjk>;jhjHAf|EBS$-eK-hEGpcM8paG~lZEpLQu_%O_U^9}Z8!?q;D}6eIGxJiI1uqL zp~Zkgqu{VcM5H0s*v7;NWralAm|!u6Xsi_$V??wuLK_;PeqtRMVH^^JO#O+a{ToaC zODxWsO(k)dYbd|48k><#Y11JiGr#~ zuN9C6_QulAMngtAj=;skH8YkE6d%}as+`0Q_I_mFXs9cW3@TWMV)z?N0=j#eW3k3y3N`UJ%Xj9HDr&^x}7UHI{e+%8!mqCdGPj}|6OH_lq_G{OF z)~<%+`0EY>>_}#>I3E+Rcma*bJbgz;_q6Q7)yZ zi#_q7jAjk^v!9B?Qboe{^l3gK)bY~HkXP(;{d6v9(?-_NFr}C4$;g$g%v!U1*~{lI z;lF%U?Rio&@l7w<_S*EI<6z9InYBP)u`dj@9wYAozZpsT$*zR~tro+8d%vf(;zeCd z^95zg!_^lAS+bYvh#Sqbwopm*&Iv6Jt%qgkQt-|rHA@UrO8U;FDm@wvM+mU%_i&Fb zR-JmCIm1XYdSb)PZ292p-_Rf8E)_sk9bT&`&C7VS{AiH0$iGmM4#^>R5q2o7v(ES> zMdejwjyd*Rp7@Dqk^@#b>Q{Q;useYa3Bn&kPvEY+lv5SNJ-0mWx z;vw7qX1wR}I`_*-v;9ObCOTAd3uy(lou);a!p_4Vu4ipx@t9XZ=*XZ(sJ z+U1Ye!jy+crFC_}?L%{nwwA>yV}7 zcA`(09G_+-^;&KTm+Q+_C<{pgS6y+H1_wURyK<&hcDiOSs-uUmK1EQYJuj`F+U?ba zgw(_sR7BUo*4HvW_G1#pK3V+gq6X@5f~#V9q^@+Gr&h3M3C5bwMvGNFS@L;&2Nb>B z=F+yVppsL!e~;eYFOgTOaXb}P4ihz8(R(`U_0U*)y%P1+cGF-CGH~IYy1~JRD>7w2kXrj>zOH%p@LoR3&;ab<#p6S5oorSFUzoQMacH`^nHS zB`$R=Gr=`kbC1DTwD`3LgqF#RiaxpxNBXI6j!3wPRk+BUR#FTEJ5_T-c6&tAx19dq zpM1%)@6Hj)lL0g9n(noxsC=yzr&3e1QmTEN8^k>-VhdrG^z>+_kLRJ!4?~e9VFZLf z6<>aKZfA$Csi`-!3KQQteP3-f2k)N%MKpTUnpQ*ZL&SC0&uhi;1IIk=?z_Gx3r;Bb zq+M{>k(AWkzZK+q_6(yV@O%fs@0-n!N!(5E74i9Jv=1t zpt5Mm4$-xY#E?C@J)7ddCmAVje z^5sfXew8w=3ky=VBmKtki3)H3h1OY|Sm}jMgi@yaw$xo00J46cRhJvf?pbRbKF({$ zM_%XjW<>3~khIgEXzBZTBrx&tPT6sZwOe)tv4hW}#im4LEDK-Eoe$MjUbq>J%20Sa z67Z_TS<}=1@f44$z}qHu*T5>Cd|pbead1YfMsvg-6L85Z>r>eDf>~c7TE!Xd#WwRT z8(OA0YIN~?U*0L^UHeVP#X=V1#9MayT!Ta1V!3n*Uxy4bOIdopowmenJxpv#`NT3! z{w0Rz#qMdqTj|fkjg@uUMc*J%naj6l=N^fd4!-9~!%N=!*39Q$oHIOEx!zv?IvxBe z$olbYQO16^t^&v69$iQAVZ0PfmOegFB(drm&#|@Cs!c&DdwU#+(IDjM2wvuX=((i| z*{RMK8zwndK72i3c+O|5e?$JZX3YM_QW=?#NAR3@Q`*~o8f`v$V6c>BS3RZF=xRf# zdgJ}!%LhFltKnCapEZu{i4l8}A}B$-@@*Y-1>NT=Uln*VG)gm{t5{V&3}BC`&cRe} znfkwY+j-eO*neSet?Px2oM` z%Mw;LUVbqX)hX+a-A(E0H}PPI_^;4I_Va%mP4^$yCd8Pn4%|`cpuKa9a(~)k>bH`@4PcID}Bt;#Mw96tHn7Y@#xfhuVU+*j7g%* zm$oWzx7Gq{%&7gA3C|s^^8AYSEAg(VJ;D9^EImICESfGHPEkMIQhY|b>|)-ek4)ee z`KaaDS5j}L^0l@2H1oka)~-G!{o8R#f_9y?*TYAu4J`w(OJzQwF`I$wB})%4f4I-u z^!MMray-eaLmtN<*$Ll1j3C|OO==d6ckx5C#jcDhPM_Xu>_xoUIsMsT?P*up4&ZXG zH#p~R-cm!il#+HrB;oL_wgu@Xy@PO%GvI1s)sy75l;Qike6x!{+?PT7)mkYar3vlAUBx!WJ@k8K8S zRX`C1*#mp6T9>zQGuz^1TiS(R!HmMqX2v%{JJnC#1fL3r{SQBNq9Oob2>=!{03ahg h`2D47L0@q>B?4rnW9nF-7vIlz4mSIVl~zaM{|OSc9NPc@ literal 0 HcmV?d00001 diff --git a/spec/fixtures/files/logo_header.png b/spec/fixtures/files/logo_header.png index 84478da8325603c1e746a619ef49cdf6dc514f56..a43ca626fa1faf35690209c1ecef30f89e8d9e80 100644 GIT binary patch literal 3077 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 literal 3655 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 diff --git a/spec/models/site_customization/image_spec.rb b/spec/models/site_customization/image_spec.rb new file mode 100644 index 000000000..5c755dbfe --- /dev/null +++ b/spec/models/site_customization/image_spec.rb @@ -0,0 +1,29 @@ +require "rails_helper" + +describe SiteCustomization::Image do + describe "logo" do + it "is valid with a 260x80 image" do + image = build(:site_customization_image, + name: "logo_header", + image: File.new("spec/fixtures/files/logo_header-260x80.png")) + + expect(image).to be_valid + end + + it "is valid with a 223x80 image" do + image = build(:site_customization_image, + name: "logo_header", + image: File.new("spec/fixtures/files/logo_header.png")) + + expect(image).to be_valid + end + + it "is not valid with a 400x80 image" do + image = build(:site_customization_image, + name: "logo_header", + image: File.new("spec/fixtures/files/logo_email_custom.png")) + + expect(image).not_to be_valid + end + end +end