Skip to content

MSF / msf-climate-hub

Go to a project
Toggle navigation
Toggle navigation pinning
4aee2f3f by Jeff Balicki
Options

v2 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 7ca15715
Inline Side-by-side
Showing 10 changed files with 100 additions and 50 deletions
...@@ -17746,8 +17746,8 @@ p { ...@@ -17746,8 +17746,8 @@ p {
17746 } 17746 }
17747 } 17747 }
17748 .entry-content h2, .entry-content .h2 { 17748 .entry-content h2, .entry-content .h2 {
17749 font-size: 2.1875rem; 17749 font-size: 28px;
17750 line-height: 2.625rem; 17750 line-height: 35px;
17751 } 17751 }
17752 @media only screen and (max-width: 48.875rem) { 17752 @media only screen and (max-width: 48.875rem) {
17753 .entry-content h2, .entry-content .h2 { 17753 .entry-content h2, .entry-content .h2 {
...@@ -17756,17 +17756,21 @@ p { ...@@ -17756,17 +17756,21 @@ p {
17756 } 17756 }
17757 } 17757 }
17758 .entry-content h3, .entry-content .h3 { 17758 .entry-content h3, .entry-content .h3 {
17759 font-size: 1.5rem; 17759 font-size: 22px;
17760 line-height: 1.875rem; 17760 line-height: 28px;
17761 text-transform: uppercase; 17761 text-transform: uppercase;
17762 } 17762 }
17763 .entry-content h4, .entry-content .h4 { 17763 .entry-content h4, .entry-content .h4 {
17764 font-size: 1.25rem; 17764 font-size: 18px;
17765 line-height: 1.5625rem; 17765 line-height: 23px;
17766 }
17767 .entry-content h5, .entry-content .h5 {
17768 font-size: 16px;
17769 line-height: 22px;
17766 } 17770 }
17767 .entry-content h1 + p, .entry-content .h1 + p { 17771 .entry-content h1 + p, .entry-content .h1 + p {
17768 font-size: 16px; 17772 font-size: 16px;
17769 line-height: 20px; 17773 line-height: 21px;
17770 font-weight: bold; 17774 font-weight: bold;
17771 } 17775 }
17772 .entry-content p + ul { 17776 .entry-content p + ul {
...@@ -18449,8 +18453,8 @@ ul.sf_date_field .sf-datepicker { ...@@ -18449,8 +18453,8 @@ ul.sf_date_field .sf-datepicker {
18449 18453
18450 .advance-search-button { 18454 .advance-search-button {
18451 position: relative; 18455 position: relative;
18452 height: 2.5rem; 18456 width: 40px;
18453 width: 2.5rem; 18457 height: 40px;
18454 text-indent: -624.9375rem; 18458 text-indent: -624.9375rem;
18455 right: -0.625rem; 18459 right: -0.625rem;
18456 display: inline-block; 18460 display: inline-block;
...@@ -19462,6 +19466,10 @@ ul.sf_date_field .sf-datepicker { ...@@ -19462,6 +19466,10 @@ ul.sf_date_field .sf-datepicker {
19462 .search-box:focus-within { 19466 .search-box:focus-within {
19463 width: 100%; 19467 width: 100%;
19464 height: 90px; 19468 height: 90px;
19469 max-width: 1066px;
19470 position: relative;
19471 margin: auto;
19472 right: unset;
19465 } 19473 }
19466 19474
19467 .search-box:focus-within #search-box-content, 19475 .search-box:focus-within #search-box-content,
...@@ -19484,13 +19492,13 @@ ul.sf_date_field .sf-datepicker { ...@@ -19484,13 +19492,13 @@ ul.sf_date_field .sf-datepicker {
19484 border-radius: 1.25rem; 19492 border-radius: 1.25rem;
19485 max-width: 80%; 19493 max-width: 80%;
19486 margin: auto; 19494 margin: auto;
19487 margin-top: 2.5rem; 19495 top: 2.5rem;
19488 position: absolute; 19496 position: relative;
19489 box-shadow: -2px 7px 7px 0 rgba(0, 0, 0, 0.25); 19497 box-shadow: -2px 7px 7px 0 rgba(0, 0, 0, 0.25);
19490 transition: 0.5s ease-in-out; 19498 transition: 0.5s ease-in-out;
19491 height: 4rem; 19499 height: 56px;
19492 width: 4rem; 19500 width: 56px;
19493 right: 10%; 19501 float: right;
19494 overflow: hidden; 19502 overflow: hidden;
19495 } 19503 }
19496 @media only screen and (max-width: 48.875rem) { 19504 @media only screen and (max-width: 48.875rem) {
...@@ -19502,15 +19510,15 @@ ul.sf_date_field .sf-datepicker { ...@@ -19502,15 +19510,15 @@ ul.sf_date_field .sf-datepicker {
19502 } 19510 }
19503 } 19511 }
19504 .search-box .search-button { 19512 .search-box .search-button {
19505 height: 4rem; 19513 height: 40px;
19506 width: 4rem; 19514 width: 40px;
19507 text-indent: -624.9375rem; 19515 text-indent: -624.9375rem;
19508 position: absolute; 19516 position: absolute;
19509 right: 0rem; 19517 right: 0rem;
19510 top: 0px; 19518 top: 0px;
19511 opacity: 1; 19519 opacity: 1;
19512 background-color: #fff; 19520 background-color: #fff;
19513 border-radius: 0.625rem; 19521 border-radius: 10px;
19514 } 19522 }
19515 .search-box .search-button:after { 19523 .search-box .search-button:after {
19516 content: ""; 19524 content: "";
...@@ -19518,10 +19526,10 @@ ul.sf_date_field .sf-datepicker { ...@@ -19518,10 +19526,10 @@ ul.sf_date_field .sf-datepicker {
19518 left: 0rem; 19526 left: 0rem;
19519 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.157' height='34.157' viewBox='0 0 34.157 34.157'%3E%3Cg id='Group_1039' data-name='Group 1039' transform='translate(-919.807 -2612.691)'%3E%3Cline id='Line_1' data-name='Line 1' x2='14.277' y2='14.277' transform='translate(938.626 2631.511)' fill='none' stroke='%23000' stroke-width='3'/%3E%3Cg id='Ellipse_1' data-name='Ellipse 1' transform='translate(919.807 2612.691)' fill='%23fff' stroke='%23000' stroke-width='3'%3E%3Ccircle cx='13.235' cy='13.235' r='13.235' stroke='none'/%3E%3Ccircle cx='13.235' cy='13.235' r='11.735' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); 19527 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.157' height='34.157' viewBox='0 0 34.157 34.157'%3E%3Cg id='Group_1039' data-name='Group 1039' transform='translate(-919.807 -2612.691)'%3E%3Cline id='Line_1' data-name='Line 1' x2='14.277' y2='14.277' transform='translate(938.626 2631.511)' fill='none' stroke='%23000' stroke-width='3'/%3E%3Cg id='Ellipse_1' data-name='Ellipse 1' transform='translate(919.807 2612.691)' fill='%23fff' stroke='%23000' stroke-width='3'%3E%3Ccircle cx='13.235' cy='13.235' r='13.235' stroke='none'/%3E%3Ccircle cx='13.235' cy='13.235' r='11.735' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
19520 background-size: contain; 19528 background-size: contain;
19521 width: 2.25rem; 19529 width: 26px;
19522 height: 2.25rem; 19530 height: 26px;
19523 top: 0.8125rem; 19531 top: 16px;
19524 left: 0.75rem; 19532 left: 0px;
19525 } 19533 }
19526 .search-box #search-box-content { 19534 .search-box #search-box-content {
19527 opacity: 0; 19535 opacity: 0;
...@@ -19845,13 +19853,15 @@ ul.sf_date_field .sf-datepicker { ...@@ -19845,13 +19853,15 @@ ul.sf_date_field .sf-datepicker {
19845 #menu-footer li { 19853 #menu-footer li {
19846 margin-bottom: 0rem; 19854 margin-bottom: 0rem;
19847 padding-bottom: 0rem; 19855 padding-bottom: 0rem;
19848 padding-left: 0rem; 19856 padding-left: 0px;
19857 display: inline-block;
19858 padding-right: 0px;
19849 } 19859 }
19850 #menu-footer-french li a, 19860 #menu-footer-french li a,
19851 #menu-footer li a { 19861 #menu-footer li a {
19852 color: #000; 19862 color: #000;
19853 font-size: 1rem; 19863 font-size: 16px;
19854 line-height: 1.375rem; 19864 line-height: 12px;
19855 font-weight: 400; 19865 font-weight: 400;
19856 text-decoration: none; 19866 text-decoration: none;
19857 } 19867 }
...@@ -19860,6 +19870,17 @@ ul.sf_date_field .sf-datepicker { ...@@ -19860,6 +19870,17 @@ ul.sf_date_field .sf-datepicker {
19860 color: #000; 19870 color: #000;
19861 text-decoration: underline; 19871 text-decoration: underline;
19862 } 19872 }
19873 #menu-footer-french li::after,
19874 #menu-footer li::after {
19875 content: "|";
19876 display: inline-block;
19877 padding-left: 10px;
19878 padding-right: 10px;
19879 }
19880 #menu-footer-french li:last-of-type::after,
19881 #menu-footer li:last-of-type::after {
19882 display: none;
19883 }
19863 19884
19864 .contact h2, .contact .h2 { 19885 .contact h2, .contact .h2 {
19865 margin-left: -12px; 19886 margin-left: -12px;
...@@ -20678,10 +20699,14 @@ ul.sf_date_field .sf-datepicker { ...@@ -20678,10 +20699,14 @@ ul.sf_date_field .sf-datepicker {
20678 border-radius: 10px; 20699 border-radius: 10px;
20679 padding: 30px; 20700 padding: 30px;
20680 margin: 30px 0px; 20701 margin: 30px 0px;
20702 max-width: 726px;
20681 } 20703 }
20682 .relevant-resources h2, .relevant-resources .h2 { 20704 .relevant-resources h2, .relevant-resources .h2 {
20683 border-bottom: 1px solid #707070; 20705 border-bottom: 1px solid #707070;
20706 padding-bottom: 10px;
20684 margin-bottom: 0px; 20707 margin-bottom: 0px;
20708 font-size: 22px;
20709 line-height: 28px;
20685 } 20710 }
20686 .relevant-resources #relevant-resources { 20711 .relevant-resources #relevant-resources {
20687 width: 100%; 20712 width: 100%;
......
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
...@@ -37,7 +37,9 @@ if ($thumbnail_image && isset($thumbnail_image[0])) { ...@@ -37,7 +37,9 @@ if ($thumbnail_image && isset($thumbnail_image[0])) {
37 ?> 37 ?>
38 <?php if ( has_post_thumbnail() ) { ?> 38 <?php if ( has_post_thumbnail() ) { ?>
39 <header class="entry-header page" style=" background-image: url('<?php echo $url;?> ')"> 39 <header class="entry-header page" style=" background-image: url('<?php echo $url;?> ')">
40 <div class="container" tabindex="-1" style="">
40 <div class="search-box"><div id="search-box-content"><?php the_field('page_search_block', 'option'); ?></div> <div class="search-button">Search</div></div> 41 <div class="search-box"><div id="search-box-content"><?php the_field('page_search_block', 'option'); ?></div> <div class="search-button">Search</div></div>
42 </div>
41 <div class='side-caption header-caption <?= (empty($copy) && empty($cap)) ? "hide" : "" ?>'> 43 <div class='side-caption header-caption <?= (empty($copy) && empty($cap)) ? "hide" : "" ?>'>
42 <a class='copy-link' aria-label="Header Slide Caption" href='#' ></a> 44 <a class='copy-link' aria-label="Header Slide Caption" href='#' ></a>
43 <span class='image-side-caption'> 45 <span class='image-side-caption'>
......
...@@ -41,25 +41,29 @@ h1 { ...@@ -41,25 +41,29 @@ h1 {
41 } 41 }
42 } 42 }
43 h2{ 43 h2{
44 font-size: 2.1875rem; 44 font-size: 28px;
45 line-height: 2.625rem; 45 line-height: 35px;
46 @media only screen and (max-width: 48.875rem) { 46 @media only screen and (max-width: 48.875rem) {
47 font-size: 29px; 47 font-size: 29px;
48 line-height: 36px; 48 line-height: 36px;
49 } 49 }
50 } 50 }
51 h3 { 51 h3 {
52 font-size: 1.5rem; 52 font-size: 22px;
53 line-height: 1.875rem; 53 line-height: 28px;
54 text-transform: uppercase; 54 text-transform: uppercase;
55 } 55 }
56 h4 { 56 h4 {
57 font-size: 1.25rem; 57 font-size: 18px;
58 line-height: 1.5625rem; 58 line-height: 23px;
59 } 59 }
60 h5 {
61 font-size: 16px;
62 line-height: 22px;
63 }
60 h1+p{ 64 h1+p{
61 font-size: 16px; 65 font-size: 16px;
62 line-height: 20px; 66 line-height: 21px;
63 font-weight: bold; 67 font-weight: bold;
64 } 68 }
65 p + ul{ 69 p + ul{
......
...@@ -36,11 +36,13 @@ ...@@ -36,11 +36,13 @@
36 li{ 36 li{
37 margin-bottom: 0rem; 37 margin-bottom: 0rem;
38 padding-bottom: 0rem; 38 padding-bottom: 0rem;
39 padding-left: 0rem; 39 padding-left: 0px;
40 display: inline-block;
41 padding-right: 0px;
40 a{ 42 a{
41 color: #000; 43 color: #000;
42 font-size: 1rem; 44 font-size: 16px;
43 line-height: 1.375rem; 45 line-height:12px;
44 font-weight: 400; 46 font-weight: 400;
45 text-decoration: none; 47 text-decoration: none;
46 &:hover{ 48 &:hover{
...@@ -49,6 +51,15 @@ ...@@ -49,6 +51,15 @@
49 } 51 }
50 } 52 }
51 } 53 }
54 li::after{
55 content: "|";
56 display: inline-block;
57 padding-left: 10px;
58 padding-right: 10px;
59 }
60 li:last-of-type::after{
61 display: none;
62 }
52 } 63 }
53 64
54 .contact{ 65 .contact{
......
...@@ -51,6 +51,10 @@ ...@@ -51,6 +51,10 @@
51 .search-box:focus-within{ 51 .search-box:focus-within{
52 width: 100%; 52 width: 100%;
53 height: 90px; 53 height: 90px;
54 max-width: 1066px;
55 position: relative;
56 margin: auto;
57 right: unset;
54 58
55 59
56 } 60 }
...@@ -85,13 +89,13 @@ ...@@ -85,13 +89,13 @@
85 border-radius: 1.25rem ; 89 border-radius: 1.25rem ;
86 max-width: 80%; 90 max-width: 80%;
87 margin: auto; 91 margin: auto;
88 margin-top: 2.5rem; 92 top: 2.5rem;
89 position: absolute; 93 position: relative;
90 box-shadow: -2px 7px 7px 0 rgba(0,0,0,.25); 94 box-shadow: -2px 7px 7px 0 rgba(0,0,0,.25);
91 transition: 0.5s ease-in-out; 95 transition: 0.5s ease-in-out;
92 height: 4rem; 96 height: 56px;
93 width: 4rem; 97 width: 56px;
94 right: 10%; 98 float: right;
95 overflow: hidden; 99 overflow: hidden;
96 @media only screen and (max-width: 48.875rem) { 100 @media only screen and (max-width: 48.875rem) {
97 padding: 0rem 0.625rem ; 101 padding: 0rem 0.625rem ;
...@@ -101,25 +105,25 @@ ...@@ -101,25 +105,25 @@
101 } 105 }
102 106
103 .search-button{ 107 .search-button{
104 height: 4rem; 108 height: 40px;
105 width: 4rem; 109 width: 40px;
106 text-indent: -624.9375rem; 110 text-indent: -624.9375rem;
107 position: absolute; 111 position: absolute;
108 right: 0rem; 112 right: 0rem;
109 top: 0px; 113 top: 0px;
110 opacity: 1; 114 opacity: 1;
111 background-color: #fff; 115 background-color: #fff;
112 border-radius: 0.625rem; 116 border-radius: 10px;
113 &:after { 117 &:after {
114 content: ""; 118 content: "";
115 position: absolute; 119 position: absolute;
116 left: 0rem; 120 left: 0rem;
117 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.157' height='34.157' viewBox='0 0 34.157 34.157'%3E%3Cg id='Group_1039' data-name='Group 1039' transform='translate(-919.807 -2612.691)'%3E%3Cline id='Line_1' data-name='Line 1' x2='14.277' y2='14.277' transform='translate(938.626 2631.511)' fill='none' stroke='%23000' stroke-width='3'/%3E%3Cg id='Ellipse_1' data-name='Ellipse 1' transform='translate(919.807 2612.691)' fill='%23fff' stroke='%23000' stroke-width='3'%3E%3Ccircle cx='13.235' cy='13.235' r='13.235' stroke='none'/%3E%3Ccircle cx='13.235' cy='13.235' r='11.735' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); 121 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.157' height='34.157' viewBox='0 0 34.157 34.157'%3E%3Cg id='Group_1039' data-name='Group 1039' transform='translate(-919.807 -2612.691)'%3E%3Cline id='Line_1' data-name='Line 1' x2='14.277' y2='14.277' transform='translate(938.626 2631.511)' fill='none' stroke='%23000' stroke-width='3'/%3E%3Cg id='Ellipse_1' data-name='Ellipse 1' transform='translate(919.807 2612.691)' fill='%23fff' stroke='%23000' stroke-width='3'%3E%3Ccircle cx='13.235' cy='13.235' r='13.235' stroke='none'/%3E%3Ccircle cx='13.235' cy='13.235' r='11.735' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
118 background-size: contain; 122 background-size: contain;
119 width: 2.25rem; 123 width: 26px;
120 height:2.25rem; 124 height: 26px;
121 top: 0.8125rem; 125 top: 16px;
122 left: 0.75rem; 126 left: 0px;
123 } 127 }
124 } 128 }
125 129
......
...@@ -3,9 +3,13 @@ ...@@ -3,9 +3,13 @@
3 border-radius: 10px; 3 border-radius: 10px;
4 padding: 30px; 4 padding: 30px;
5 margin: 30px 0px; 5 margin: 30px 0px;
6 max-width: 726px;
6 h2 { 7 h2 {
7 border-bottom: 1px solid #707070; 8 border-bottom: 1px solid #707070;
8 margin-bottom: 0px; 9 padding-bottom: 10px;
10 margin-bottom:0px ;
11 font-size: 22px;
12 line-height: 28px;
9 } 13 }
10 #relevant-resources { 14 #relevant-resources {
11 width: 100%; 15 width: 100%;
......
...@@ -448,8 +448,8 @@ ul.sf_date_field { ...@@ -448,8 +448,8 @@ ul.sf_date_field {
448 448
449 .advance-search-button { 449 .advance-search-button {
450 position: relative; 450 position: relative;
451 height: 2.5rem; 451 width: 40px;
452 width: 2.5rem; 452 height: 40px;
453 text-indent: -624.9375rem; 453 text-indent: -624.9375rem;
454 right:-0.625rem ; 454 right:-0.625rem ;
455 display: inline-block; 455 display: inline-block;
......