From 15b2341ba643d5975ad825a6bcf152b0f7a228c9 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Wed, 27 Mar 2024 15:43:35 -0400 Subject: [PATCH 1/2] WIP updates for brand images and styles. --- public/favicon.ico | Bin 15086 -> 15406 bytes src/assets/img/logo.svg | 10 ++++------ .../funnel-header/funnel-header.vue | 2 +- 3 files changed, 5 insertions(+), 7 deletions(-) diff --git a/public/favicon.ico b/public/favicon.ico index 0dd4da6338e8428e47a7b5c501ef6d359a85af4d..398c90449a1e970671e30b495f36400488b680fa 100644 GIT binary patch literal 15406 zcmeHO2apt18g7iIavq-Xyi<3HiwG_#Ut?OAkFgo!+>sTjji}uI_&Q!vFsFzdyGm zb&>X!x^yB;Y7I>o>ZV=?I1FL!_s3Ft>%|sIBwER+H2M;B z->qKC?~=LZrNH#gT9S0~Vfygg zcx4UMRmaodP``Lwak^?uRmR*347g(tCZ6V|`B&A@!hbOR&Z#4eJAR0ZdhC};cj~^s z#j`F`5U2#7$>VD{U*Jzh<+oT{ZqCj}Z=H2d!2hlpS4AuC^2t1R`-dU=;hP9K9WioO zwDI-b-$m(*;t;+4s-GUcuYqP?T1`X#QfA5ztk!$_apkn`i6#p8Rm@AxbS$3Zu~yo; zDM(XCne!z*I4&COB41s?Vg`GklMMa~k2g_In>?=IUdvcF zLe^+u#{1I`rt2w6d-Z+RCDpop)#J^%teT474;o(oK}Uq1bo2BY`MldbpVF%HG+% zPvr9*iP#`04Z#JOS8shUDBCAz9G|I6+nxWDqL5}}{a5g!uRjmV_`Q5YC7pPPu^nW0 zZs_qbja{Ri9X$P|r<>{AJ{7{awSr^tF=c#~&2hi_flOXLZFH3^6CfA#t|@FYS;moD@jhd`Cu1zkX;zlpX8-&ZZ3vhRMH^rDQ;&W3o~ORN?~Wg$rhQe*F$N^dZEQ?Xe_fguhEllsc=BHJQ zeRSPK4-M$1Z_8TEmHWQ;T;*`l@whPZ3;bT{;U{4itu&ploS&rQ=`DArb2!e?K#m4P zXrRx54uV~B{z*>y`#Em9n*D*$$L39~rupm#fG+@k{kd1v(9B8IH2s1qnskO+wvP}~ z=(+!|kM9$^mJ)0t#IImamhFy_#~r77wy6>CYH3c&zD4NRhza2iUq%c2*6_W)CP7us zIF+z(6ET++3w`pM`mlW@f;*A6@DUF0Swa6{9~gAolo^;(zf%v2nk{sP-{hxVQCc*= zp3cgzFpV3Ez>T)OnMM}eP%DoQ`?wGR>ceFU53*DRr6 zEBnv_)URvyGzEX$436i4WK4pLYruBZ=e_vf0H;ohPjSq@^_1R{^d9%W^ z-gm?oU}L6eU2hUiT?5B3@Bf#V&dx8Fc?*1NpuY)2UG&=XEhI{R&5cQ!pXtTF^XiNn&qmfVOBr8*bj7e zcX9f$3!h#);JW{xN@)`3SU?tiwl!qwH&nx{enzZvAp5!W=4sD5z&wCqhCld;WsS6R zdxYbM31NCy!;Vaq*8{R{CL%A?u7fg>_zUE$agU zyj28#$mrtDA%gtL@3OmH=pMGlvfI7nXWhOd3h*6fTcNxpMh~$5(UvdOKCpw2AfGG5 zang1zJRHs^^4p+iL3W?hy?tpN`q!$(4MK9*YK;k2XA!%AZi#%7VLd7cx}syncvq9%m z&#R&)@DJTn1pmnQLJo+61MMC8xybiOChc9He;ktI&f0P8yn`Ps zVciQn&TjdUeITd(%@}^<<^pzGg_~{J7?kr{?ZB(oX4?5x1e?}w0d8ka_UQ6L?B~mz zn;=piVx3zLF1vM*gCA}*kJ)SCfjqjEbI9RW?9RGB^nc|1A)aoOqpckS@5oz*U(znD zM(r*fwc+XrS}c0H+7#N)7{AW8i1i CkI4=I literal 15086 zcmeHO3s98T75)VbHgqN#bp~7M$ViNkKte>ShT248Vmqi{GNrYdaaxrz(D4y$wHoN4 zP197=IMEo!km`U*G|@sxeE~)^3Mh{#h~cp-i}D7M=fd*(`kh~vQW6AYf!&ld^Kl=0 z|NEbF?&H7roP(l_Q>+ztcZI2=a%6_0{8UjCN5`)6ql$8qb&oQY-(Ry)l(*QxnQi!p z@;gH6ReJ1Ra=*U-#u0ABPNI@92g)K7L4*=3+3C$cDXTQp=qau@;%1(ms(?DluCt6xs(B9r| zcDxOQp|-X*q^71KDk=)+&!0z8Q4ty%8qm>UZdaPVrKzf_!hr(^uw=;+czb(e&6+jX zyLT^6oH&7uj0_YM6riG_;#*_Hp+kE=Vu~7CTRTzT(1D^`t+cxy)$*1lc}zhB+Lyyvud|AQLpqPrWDW@>9|5fc*we}8{WnKA`d zR#xEMM}@t;Jyxw+rOvZ^a}3D7Zor?ml;dX$wD5RVgE{lHnEP`rJiRnCE zWImi+1bJ|D&coW^GSt@fGjKzYO4hXKIW8^^t5>ha^y$+ve*Ab<25W0;I5{~XI5-&T z>FHei&8VvGz(+^w@ba&3Vdhi$m`*+)BhNEj@8NN`d>A41&%acNE9uQc;Ba7%iX1gH zH8^+f9JX%VidnN}!OqT3l|$rlcXvlGdaJTP@rkU?ssdjU{RsUyVDcj=KpcZ zBr?9evl<42i5J0r#FF)qo12UM`}bqnvSpYyZ5nKBY}9dac6P?Pb!&0@^eO0crAW(Y z!r#NI;p10?C!Z-$=Z%a-&oS`+MIlnTmPeXoUo9^$M?yjZwrtsg`Sa&v(xgeSwYA06 zsZ-(W>x+np_mTN^4pD~#AJ*bGD@yRpT&+5%oSyja+zMP@ikpS4BP~Mr`{cVQC5HwNSA(PKFKWe$#fR)&ymoO@X%dEe^Q65*)1^eduOgBa<#U$LdL5nu^P?%9tzAs|2=sd%a3Vb zOao&Y_#SAW-oj-_v2gx(TR8vA$$z7T%1}kVe@rA=Apdfp+a*3ormqs>53?i^-aOWprDg>}hqOp~NceW@w+ zr;{@Esp^&bRrNjXp7B*Iuo9=`NIXw;$7wN^t1sd>K194i$hm2_i~{mq{RiRDlMj|{ z3E6w@5W`Jk4L?Q96dssLT$=11BfTdG5Atnzn#d)5-^SOen2X>M*FHGizwTa%NMRsZVAlP96kXlUcEqwmK+JL|x=2=O=S^_`Ss z@XBs%Y*c-Uetv$c&uY=4MOe9VCBnnQ>F?309g2@O`+5sfF6(jiS~ITEj(sIvk5gwF zXs@qD*qfEu98!+5^0vV<(Dg(~NeTAs*@HQA=BWM}@dbK$d8vNcs;WEq`kDdjHw^e_a_=}9bFY!IT5msR`zn%Dc6B84$VZ#Qvy1GLAyDz=C5c~G+!|C{J zycbak|5r=k=AnW35``D>?VkT?XgcUUfZ_|#YPC3g_%H$j0#u*c!i6tj^XAPsc<2kf z`(6$L*XdNhrudV6{B$^-(16CK2bhe#U*4-Myoi4`y!H6G zh(0?X`{Dbl0n;yx!D*^^aLrBL`g4=_IPebTqq>qX?Itj()6$EH8WGv+9ZXFm--Jzl5YLHgpOXT6-6v|0^g{H`D+ zH4_&vmGDg4fE(Wo?YuUKD^pK)`pOSAh%mXYjt5YGmu-BB+XHCZyNRqhS-0}PeA0*5 id-|Rr{IQE3;wr9P6C` diff --git a/src/assets/img/logo.svg b/src/assets/img/logo.svg index 33c00d936..5892bbdaf 100644 --- a/src/assets/img/logo.svg +++ b/src/assets/img/logo.svg @@ -1,8 +1,6 @@ - + + + \ No newline at end of file diff --git a/src/fmg-components/funnel-header/funnel-header.vue b/src/fmg-components/funnel-header/funnel-header.vue index 24e12d549..3b412ee03 100644 --- a/src/fmg-components/funnel-header/funnel-header.vue +++ b/src/fmg-components/funnel-header/funnel-header.vue @@ -94,6 +94,6 @@ export default { } .logo-image { - max-width: 78px; + max-width: 116px; } From 66a880d6ea0be33d29e81edfbef34acda37f4127 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Fri, 5 Apr 2024 18:49:10 -0400 Subject: [PATCH 2/2] CSR-2045 update imagery, colors, typography to new Brand Guidelines. --- public/index.html | 2 +- .../funnel-header/funnel-header.vue | 3 +- src/styles/common-typography-styles.scss | 71 +++++++++++++++++++ src/styles/ux-variables.scss | 6 +- 4 files changed, 77 insertions(+), 5 deletions(-) diff --git a/public/index.html b/public/index.html index b8a80e384..edf50a0f4 100644 --- a/public/index.html +++ b/public/index.html @@ -11,7 +11,7 @@ - + <%= htmlWebpackPlugin.options.title %> diff --git a/src/fmg-components/funnel-header/funnel-header.vue b/src/fmg-components/funnel-header/funnel-header.vue index 3b412ee03..8de05c3c1 100644 --- a/src/fmg-components/funnel-header/funnel-header.vue +++ b/src/fmg-components/funnel-header/funnel-header.vue @@ -94,6 +94,7 @@ export default { } .logo-image { - max-width: 116px; + max-width: 114px; + height: auto; } diff --git a/src/styles/common-typography-styles.scss b/src/styles/common-typography-styles.scss index 72b2e5875..b15c07a88 100644 --- a/src/styles/common-typography-styles.scss +++ b/src/styles/common-typography-styles.scss @@ -13,26 +13,31 @@ h1, line-height: 1.325; font-weight: 300; } + h2, .h2 { line-height: 1.325; font-weight: 300; } + h3, .h3 { line-height: 1.375; font-weight: 300; } + h4, .h4 { line-height: 1.6; font-weight: 300; } + h5, .h5 { line-height: 1.325; font-weight: 400; } + h6, .h6 { line-height: 1.7; @@ -70,3 +75,69 @@ caption, line-height: 1.4; font-weight: 500; } + +// Poppins styles from Google Fonts + +// Regular styles + +.poppins-light { + font-family: "Poppins", sans-serif; + font-weight: 300; + font-style: normal; +} + +.poppins-regular { + font-family: "Poppins", sans-serif; + font-weight: 400; + font-style: normal; +} + +.poppins-medium { + font-family: "Poppins", sans-serif; + font-weight: 500; + font-style: normal; +} + +.poppins-semibold { + font-family: "Poppins", sans-serif; + font-weight: 600; + font-style: normal; +} + +.poppins-bold { + font-family: "Poppins", sans-serif; + font-weight: 700; + font-style: normal; +} + +// Italic styles + +.poppins-light-italic { + font-family: "Poppins", sans-serif; + font-weight: 300; + font-style: italic; +} + +.poppins-regular-italic { + font-family: "Poppins", sans-serif; + font-weight: 400; + font-style: italic; +} + +.poppins-medium-italic { + font-family: "Poppins", sans-serif; + font-weight: 500; + font-style: italic; +} + +.poppins-semibold-italic { + font-family: "Poppins", sans-serif; + font-weight: 600; + font-style: italic; +} + +.poppins-bold-italic { + font-family: "Poppins", sans-serif; + font-weight: 700; + font-style: italic; +} diff --git a/src/styles/ux-variables.scss b/src/styles/ux-variables.scss index 2d26125aa..57d8b56f5 100644 --- a/src/styles/ux-variables.scss +++ b/src/styles/ux-variables.scss @@ -10,7 +10,7 @@ $blue-200: #c1dfee; $blue-300: #9fcee6; $blue-400: #69adcf; // Used in theme $blue-500: #3b8fb8; -$blue: #1574a1; // Default Blue +$blue: #0070D1; // Default Blue $blue-700: #06577c; $blue-800: #003d58; $blue-900: #002433; // Used in theme @@ -20,7 +20,7 @@ $red-100: #ffe6e4; $red-200: #fcbfbb; $red-300: #f89892; $red-400: #e65c53; -$red: #d4281c; // Default Red +$red: #DB0020; // Default Red $red-600: #ac160b; $red-700: #840900; $red-800: #5b0600; @@ -115,7 +115,7 @@ $theme-colors: ( $body-color: $gray-600; //Fonts -$font-family-sans-serif: Roboto, Arial, Helvetica, sans-serif; +$font-family-sans-serif: Poppins, Arial, Helvetica, sans-serif; $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; // stylelint-enable value-keyword-case