diff --git a/css/ebi-global-includes/_embl_selector.scss b/css/ebi-global-includes/_embl_selector.scss
new file mode 100644
index 0000000000000000000000000000000000000000..611d877577a943c891d57502dffe2fbe126ec8fa
--- /dev/null
+++ b/css/ebi-global-includes/_embl_selector.scss
@@ -0,0 +1,59 @@
+// Custom tag class for Foundation-based EBI framework
+
+////
+/// @group embl-selector
+////
+
+/// Classses to theme the embl dropdown selector for the .masthead-black-bar
+@mixin embl-selector {
+ .dropdown-pane.embl-dropdown {
+ background-image: url('../images/map.png');
+ height: 21rem;
+ left: 0; //fix position of menu, to prevent horizontal scrolling of page
+
+ h6 { color: white; font-weight: 700; }
+ .button { color: #007c82; background: #fff; }
+ }
+ @media screen and (max-width: 39.9375em) {
+ .dropdown-pane.embl-dropdown {
+ // do not show embl-dropdown on small screens at all
+ display: none;
+ width: 0 !important;
+ overflow: hidden;
+ }
+ }
+
+ .embl-selector {
+ .button,
+ .button.hover,
+ .button:focus,
+ .button:hover {
+ background: no-repeat 4px 50% url("../images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg");
+ padding-left: 108px;
+ background-size: 100px;
+ padding-right: 17px;
+ height: 37px;
+ line-height: 12px;
+ }
+ .button.hover,
+ .button:hover { background-color: #888; }
+ .button[aria-expanded="false"]::after {
+ content: '';
+ display: block;
+ width: 0;
+ height: 0;
+ border: inset 4px;
+ border-color: #fff transparent transparent;
+ border-top-style: solid;
+ position: absolute;
+ top: 18px;
+ margin-left: 55px;
+ }
+ }
+ // begin to hide bits of dropdown toggle as screen shrinks
+ @media screen and (max-width: 53em) {
+ .embl-selector .button { width: 0px; padding-right:0; overflow: hidden;}
+ .embl-selector .button:after { display: none; }
+ .masthead-black-bar nav ul.menu li a { padding-right: .5rem; padding-left: .5rem;}
+ }
+}
diff --git a/css/ebi-global.scss b/css/ebi-global.scss
index 66f06d825a2049859cf6c2d59fa40cba4bf10f6d..81561f58baf73c7463d988b4763ae42e8c7044de 100644
--- a/css/ebi-global.scss
+++ b/css/ebi-global.scss
@@ -1,6 +1,7 @@
// Various includes
@import 'ebi-global-includes/ebi_theme_settings'; // default EBI styling
@import 'ebi-global-includes/tag'; // custom tag class
+@import 'ebi-global-includes/embl_selector'; // EMBL Dropdown selector for .masthead-black-bar
// This code is the EBI layer atop the Foundation base styling
@@ -289,14 +290,12 @@ a:active {
color: #fff;
}
- /* EMBL Dropdwon styles */
- .dropdown-pane.embl-dropdown {
+ /* masthead dropdwon styles */
+ .dropdown-pane {
background-color: #333;
- background-image: url('../images/map.png');
background-position: 100% 100%;
background-repeat: no-repeat;
color: #fff;
- height: 21rem;
padding-right: 17rem;
min-width: 39.9375em;
left: 0; //fix position of menu, to prevent horizontal scrolling of page
@@ -304,14 +303,9 @@ a:active {
h6 { color: white; font-weight: 700; }
.button { color: #007c82; background: #fff; }
}
- @media screen and (max-width: 39.9375em) {
- .dropdown-pane.embl-dropdown {
- // do not show embl-dropdown on small screens at all
- display: none;
- width: 0 !important;
- overflow: hidden;
- }
- }
+
+ /* EMBL Selector dropdown */
+ @include embl-selector;
}
@@ -361,9 +355,8 @@ a:active {
background-repeat: no-repeat;
background-position: 100% 82%;
background-size: cover;
- /*background-image: url('data:image/svg+xml;charset=UTF-8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="147 248 60 248" xml:space="preserve"><polygon class="st0" fill="#000" fill-opacity="0.05" points="147,363.6 259.3,363.6 259.3,428.4 203.2,460.9 147,428.4 "/></svg>');*/
- /* Base64 for IE/FF */
- background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIxNDcgMjQ4IDYwIDI0OCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gY2xhc3M9InN0MCIgZmlsbD0iIzAwMCIgZmlsbC1vcGFjaXR5PSIwLjA1IiBwb2ludHM9IjE0NywzNjMuNiAyNTkuMywzNjMuNiAyNTkuMyw0MjguNCAyMDMuMiw0NjAuOSAxNDcsNDI4LjQgIi8+PC9zdmc+Jyk7');
+ // triangle svg background
+ background-image: url('data:image/svg+xml;charset=UTF-8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="147 248 60 248" xml:space="preserve"><polygon class="st0" fill="#000" fill-opacity="0.05" points="147,363.6 259.3,363.6 259.3,428.4 203.2,460.9 147,428.4 "/></svg>');
h1,
h4,
@@ -565,42 +558,6 @@ a:active {
#local-title.logo-title-strapline h1 { font-size: 270%; }
#local-title.logo-title-strapline p { display: inline; font-size: 123.1%; }
- /* embl selector */
- .embl-selector {
- .button,
- .button.hover,
- .button:focus,
- .button:hover {
- background: no-repeat 4px 50% url("../images/logos/EMBL-EBI/EMBL_EBI_Logo_white.svg");
- padding-left: 108px;
- background-size: 100px;
- padding-right: 17px;
- height: 37px;
- line-height: 12px;
- }
- .button.hover,
- .button:hover { background-color: #888; }
- .button[aria-expanded="false"]::after {
- content: '';
- display: block;
- width: 0;
- height: 0;
- border: inset 4px;
- border-color: #fff transparent transparent;
- border-top-style: solid;
- position: absolute;
- top: 18px;
- margin-left: 55px;
- }
- }
- // begin to hide bits of dropdown toggle as screen shrinks
- @media screen and (max-width: 53em) {
- .embl-selector .button { width: 0px; padding-right:0; overflow: hidden;}
- .embl-selector .button:after { display: none; }
- .masthead-black-bar nav ul.menu li a { padding-right: .5rem; padding-left: .5rem;}
- }
-
-
/*
LOCAL FOOTER
=============================== */
@@ -911,7 +868,6 @@ code { font-size: .95rem; }
}
// read more
-
a.read-more,
a.readmore,
a.more {
@@ -980,15 +936,6 @@ a.more {
.padding-bottom-large { padding-bottom: 1rem; }
.padding-bottom-xlarge { padding-bottom: 2rem; }
-/* icon to indicate link is a PDF file */
-// a span.link-pdf { background: url(http://www.ebi.ac.uk/inc/images/icon_pdf.gif) right center no-repeat; padding: 0 18px 0 0; }
-// h1 a span.link-pdf,
-// h2 a span.link-pdf,
-// h3 a span.link-pdf,
-// h4 a span.link-pdf,
-// h5 a span.link-pdf,
-// h6 a span.link-pdf { display:none; }
-
/* print styles */
@media print {
a, a:visited { border-bottom: none; }
diff --git a/libraries/foundation-6/css/foundation.css b/libraries/foundation-6/css/foundation.css
index a32b817b3eb4e4b2096e2c888831d7ccb646b742..86f0adf425d6e47e27f78ac87974a158e519afb6 100644
--- a/libraries/foundation-6/css/foundation.css
+++ b/libraries/foundation-6/css/foundation.css
@@ -449,7 +449,7 @@ body {
margin: 0;
padding: 0;
background: white;
- font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: normal;
line-height: 1.5;
color: #222;
@@ -1326,7 +1326,7 @@ h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
- font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: normal;
color: inherit;