diff --git a/CHANGELOG.md b/CHANGELOG.md
index c7b00d4ed13b3596dda82d48d1dd115ea906f107..665d4bedc6f2847f163d2a22e69b63268e52f0ec 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+## [2.4.6] - 13-09-2019
+
+- Modified main menu to have text-shadow only when has-header is present
+
## [2.4.5] - 13-09-2019
- Fixed menu layout in small resolutions. Now becomes two lines only if logo + name are set
diff --git a/cernclean.info.yml b/cernclean.info.yml
index 304262919ac6cc9a492a989a9743c7ec41c788f8..2b3a43574f08a79067d5f8210b8d72ccea43b8d9 100644
--- a/cernclean.info.yml
+++ b/cernclean.info.yml
@@ -2,7 +2,7 @@ name: CERN
type: theme
description: "CERN theme"
core: 8.x
-version: 2.4.5
+version: 2.4.6
base theme: cernbase
# libraries
diff --git a/css/header.css b/css/header.css
index 5e1b461b3ba3c2ba0423096ba83da6502cdf8f98..ad25edaf3a1b691d39762a4229e79122fc1f2d08 100644
--- a/css/header.css
+++ b/css/header.css
@@ -1,226 +1,274 @@
-header .site-info__text {
- overflow-wrap: break-word; }
- header .site-info__text a, header .site-info__text__slogan {
- text-shadow: 1px 0px 1px black, 0px 1px 1px black, -1px 0px 1px black, 0px -1px 1px black, 0 0 1px black; }
- header .site-info__text__name {
- white-space: unset;
- text-overflow: unset; }
-header .region-header > .name {
- display: block; }
-header .region-header > .navbar-text {
- display: block; }
-header .region-header .language-switcher-language-url a {
- text-shadow: 1px 0px 1px black, 0px 1px 1px black, -1px 0px 1px black, 0px -1px 1px black, 0 0 1px black; }
+body header .site-info + .site-nav nav {
+ float: none;
+}
+body header .site-info__text {
+ overflow-wrap: break-word;
+}
+body header .site-info__text__name {
+ white-space: unset;
+ text-overflow: unset;
+}
+body header .region-header > .name {
+ display: block;
+}
+body header .region-header > .navbar-text {
+ display: block;
+}
@media only screen and (max-width: 1023px) {
header .region-header > .navbar-text {
- display: none; } }
+ display: none;
+ }
+}
header.menu-expanded {
top: 0;
position: fixed;
width: 100%;
- z-index: 500; }
- header.menu-expanded .header-wrapper {
- padding: 10px 5%; }
- header.menu-expanded .site-info__logo {
- max-width: 25%;
- width: auto; }
- header.menu-expanded .site-info__logo img {
- max-height: 50px; }
- header.menu-expanded .site-info__text__slogan {
- display: none; }
- header.menu-expanded .nav > li > a {
- line-height: 56px; }
- header.menu-expanded .nav > li > a:after {
- bottom: 9px; }
- header.menu-expanded .navbar-default .navbar-toggle:hover,
- header.menu-expanded .navbar-default .navbar-toggle:focus,
- header.menu-expanded .navbar-default .navbar-toggle {
- top: 20%; }
- header.menu-expanded .navbar-default.main-menu .navbar-toggle {
- top: 33px; }
+ z-index: 500;
+}
+header.menu-expanded .header-wrapper {
+ padding: 10px 5%;
+}
+header.menu-expanded .site-info__logo {
+ max-width: 25%;
+ width: auto;
+}
+header.menu-expanded .site-info__logo img {
+ max-height: 50px;
+}
+header.menu-expanded .site-info__text__slogan {
+ display: none;
+}
+header.menu-expanded .nav > li > a {
+ line-height: 56px;
+}
+header.menu-expanded .nav > li > a:after {
+ bottom: 9px;
+}
+header.menu-expanded .navbar-default .navbar-toggle:hover,
+header.menu-expanded .navbar-default .navbar-toggle:focus,
+header.menu-expanded .navbar-default .navbar-toggle {
+ top: 20%;
+}
+header.menu-expanded .navbar-default.main-menu .navbar-toggle {
+ top: 33px;
+}
.toolbar-fixed header.menu-expanded {
top: 39px;
- margin-top: 0 !important; }
+ margin-top: 0 !important;
+}
.toolbar-vertical header.menu-expanded {
top: 39px;
- margin-top: 0 !important; }
+ margin-top: 0 !important;
+}
.toolbar-fixed.toolbar-tray-open header.menu-expanded {
- top: 78px; }
+ top: 78px;
+}
.toolbar-fixed.toolbar-tray-open.toolbar-vertical header.menu-expanded {
- top: 39px; }
+ top: 39px;
+}
.sticky-header header .site-info {
- min-height: 56px; }
- .sticky-header header .site-info img {
- left: 0; }
+ min-height: 56px;
+}
+.sticky-header header .site-info img {
+ left: 0;
+}
header .nav > li {
- margin: 0 20px; }
- header .nav > li:nth-last-child(2) {
- margin-right: 35px; }
+ margin: 0 20px;
+}
+header .nav > li:nth-last-child(2) {
+ margin-right: 35px;
+}
header .site-info__text__name {
- padding: 2px 0 0; }
-
-header .site-info + .site-nav nav {
- float: none; }
+ padding: 2px 0 0;
+}
.region-header {
- text-align: right; }
- .region-header > nav, .region-header > .block-language {
- display: inline-block;
- vertical-align: top; }
+ text-align: right;
+}
+.region-header > nav, .region-header > .block-language {
+ display: inline-block;
+ vertical-align: top;
+}
.sticky-header:not(.open-cern-menu) header .navbar-default.main-menu .navbar-toggle {
- top: 32px; }
+ top: 32px;
+}
@media only screen and (max-width: 767px) {
.sticky-header:not(.open-cern-menu) header .nav > li > a {
- line-height: 35px !important; } }
+ line-height: 35px !important;
+ }
+}
.block-language {
- position: relative; }
- .block-language h2.block-title {
- display: none; }
- .block-language .active-language {
- padding: 0 0 0 10px; }
- .block-language .active-language a {
- -webkit-transition: all 0.3s ease-in-out 0s;
- -khtml-transition: all 0.3s ease-in-out 0s;
- -moz-transition: all 0.3s ease-in-out 0s;
- -ms-transition: all 0.3s ease-in-out 0s;
- -o-transition: all 0.3s ease-in-out 0s;
- transition: all 0.3s ease-in-out 0s;
- font-size: 16px;
- font-size: 1.6rem;
- font-family: "opensans-bold";
- padding: 0;
- line-height: 76px;
- position: relative;
- text-transform: uppercase; }
- .block-language .active-language a:after {
- -webkit-transition: width 0.3s ease-in-out 0s;
- -khtml-transition: width 0.3s ease-in-out 0s;
- -moz-transition: width 0.3s ease-in-out 0s;
- -ms-transition: width 0.3s ease-in-out 0s;
- -o-transition: width 0.3s ease-in-out 0s;
- transition: width 0.3s ease-in-out 0s;
- content: '';
- display: block;
- height: 2px;
- width: 0%;
- position: absolute;
- bottom: -10px;
- left: 0; }
- .block-language .active-language a:hover {
- background: transparent; }
- .block-language .active-language a:hover:after {
- width: 100%; }
- .block-language .active-language a:focus {
- background: transparent; }
- .block-language .active-language a span.separator {
- position: absolute;
- left: -20px;
- top: -2px;
- line-height: 21px; }
- .block-language .active-language a span.caret {
- position: absolute;
- right: -20px;
- top: 49%; }
- .block-language > ul.links {
- -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- -khtml-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- -ms-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- -o-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
- filter: alpha(opacity=0);
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
- -webkit-opacity: 0;
- -khtml-opacity: 0;
- -moz-opacity: 0;
- -ms-opacity: 0;
- -o-opacity: 0;
- opacity: 0;
- list-style: none;
- margin: 0;
- padding: 10px 12px;
- position: absolute;
- top: 80px; }
- .block-language > ul.links::before {
- left: unset;
- right: 10px;
- top: -23px;
- content: '';
- width: 0px;
- height: 0px;
- background: transparent;
- border-width: 12px;
- border-style: solid;
- position: absolute; }
- .block-language > ul.links a {
- font-size: 16px;
- font-size: 1.6rem;
- font-family: "opensans-bold";
- padding: 0;
- line-height: 25px;
- display: block;
- text-transform: uppercase;
- position: relative; }
- .block-language > ul.links a:after {
- -webkit-transition: width 0.3s ease-in-out 0s;
- -khtml-transition: width 0.3s ease-in-out 0s;
- -moz-transition: width 0.3s ease-in-out 0s;
- -ms-transition: width 0.3s ease-in-out 0s;
- -o-transition: width 0.3s ease-in-out 0s;
- transition: width 0.3s ease-in-out 0s;
- content: '';
- display: block;
- height: 2px;
- width: 0%;
- position: absolute;
- bottom: -4px;
- left: 0; }
- .block-language > ul.links a:hover {
- background: transparent; }
- .block-language > ul.links a:hover:after {
- width: 100%; }
- .block-language > ul.links a:focus {
- background: transparent; }
- .block-language > ul.links.language-expanded {
- filter: alpha(opacity=100);
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
- -webkit-opacity: 1;
- -khtml-opacity: 1;
- -moz-opacity: 1;
- -ms-opacity: 1;
- -o-opacity: 1;
- opacity: 1; }
+ position: relative;
+}
+.block-language h2.block-title {
+ display: none;
+}
+.block-language .active-language {
+ padding: 0 0 0 10px;
+}
+.block-language .active-language a {
+ -webkit-transition: all 0.3s ease-in-out 0s;
+ -khtml-transition: all 0.3s ease-in-out 0s;
+ -moz-transition: all 0.3s ease-in-out 0s;
+ -ms-transition: all 0.3s ease-in-out 0s;
+ -o-transition: all 0.3s ease-in-out 0s;
+ transition: all 0.3s ease-in-out 0s;
+ font-size: 16px;
+ font-size: 1.6rem;
+ font-family: "opensans-bold";
+ padding: 0;
+ line-height: 76px;
+ position: relative;
+ text-transform: uppercase;
+}
+.block-language .active-language a:after {
+ -webkit-transition: width 0.3s ease-in-out 0s;
+ -khtml-transition: width 0.3s ease-in-out 0s;
+ -moz-transition: width 0.3s ease-in-out 0s;
+ -ms-transition: width 0.3s ease-in-out 0s;
+ -o-transition: width 0.3s ease-in-out 0s;
+ transition: width 0.3s ease-in-out 0s;
+ content: "";
+ display: block;
+ height: 2px;
+ width: 0%;
+ position: absolute;
+ bottom: -10px;
+ left: 0;
+}
+.block-language .active-language a:hover {
+ background: transparent;
+}
+.block-language .active-language a:hover:after {
+ width: 100%;
+}
+.block-language .active-language a:focus {
+ background: transparent;
+}
+.block-language .active-language a span.separator {
+ position: absolute;
+ left: -20px;
+ top: -2px;
+ line-height: 21px;
+}
+.block-language .active-language a span.caret {
+ position: absolute;
+ right: -20px;
+ top: 49%;
+}
+.block-language > ul.links {
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ -khtml-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ -ms-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ -o-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.17);
+ filter: alpha(opacity=0);
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+ -webkit-opacity: 0;
+ -khtml-opacity: 0;
+ -moz-opacity: 0;
+ -ms-opacity: 0;
+ -o-opacity: 0;
+ opacity: 0;
+ list-style: none;
+ margin: 0;
+ padding: 10px 12px;
+ position: absolute;
+ top: 80px;
+}
+.block-language > ul.links::before {
+ left: unset;
+ right: 10px;
+ top: -23px;
+ content: "";
+ width: 0px;
+ height: 0px;
+ background: transparent;
+ border-width: 12px;
+ border-style: solid;
+ position: absolute;
+}
+.block-language > ul.links a {
+ font-size: 16px;
+ font-size: 1.6rem;
+ font-family: "opensans-bold";
+ padding: 0;
+ line-height: 25px;
+ display: block;
+ text-transform: uppercase;
+ position: relative;
+}
+.block-language > ul.links a:after {
+ -webkit-transition: width 0.3s ease-in-out 0s;
+ -khtml-transition: width 0.3s ease-in-out 0s;
+ -moz-transition: width 0.3s ease-in-out 0s;
+ -ms-transition: width 0.3s ease-in-out 0s;
+ -o-transition: width 0.3s ease-in-out 0s;
+ transition: width 0.3s ease-in-out 0s;
+ content: "";
+ display: block;
+ height: 2px;
+ width: 0%;
+ position: absolute;
+ bottom: -4px;
+ left: 0;
+}
+.block-language > ul.links a:hover {
+ background: transparent;
+}
+.block-language > ul.links a:hover:after {
+ width: 100%;
+}
+.block-language > ul.links a:focus {
+ background: transparent;
+}
+.block-language > ul.links.language-expanded {
+ filter: alpha(opacity=100);
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ -webkit-opacity: 1;
+ -khtml-opacity: 1;
+ -moz-opacity: 1;
+ -ms-opacity: 1;
+ -o-opacity: 1;
+ opacity: 1;
+}
/* sticky */
.sticky-header .block-language .active-language a {
- line-height: 56px; }
+ line-height: 56px;
+}
/* responsive */
@media only screen and (max-width: 767px) {
.region-header {
- text-align: left; }
+ text-align: left;
+ }
header .site-info + .site-nav nav {
- width: 100%; }
+ width: 100%;
+ }
.region-header > .block-language {
position: absolute;
display: none;
right: 30px;
margin: auto;
- top: 67px; }
- .region-header > .block-language .active-language a span.separator {
- display: none; }
+ top: 67px;
+ }
+ .region-header > .block-language .active-language a span.separator {
+ display: none;
+ }
header .block-language ul.links {
-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
@@ -229,15 +277,20 @@ header .site-info + .site-nav nav {
-ms-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
-o-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 rgba(0, 0, 0, 0);
- top: 60px; }
- header .block-language ul.links:before {
- display: none; }
+ top: 60px;
+ }
+ header .block-language ul.links:before {
+ display: none;
+ }
.menu-expanded .region-header > .block-language {
- display: block; }
+ display: block;
+ }
.main-menu .navbar-nav {
- padding: 0 50px 0 0; } }
+ padding: 0 50px 0 0;
+ }
+}
/*
element.style {
display: block;
@@ -249,29 +302,38 @@ element.style {
}
*/
header .main-menu .dropdown-menu a {
- display: block; }
- header .main-menu .dropdown-menu a .caret {
- display: none; }
+ display: block;
+}
+header .main-menu .dropdown-menu a .caret {
+ display: none;
+}
header .main-menu .dropdown-menu .dropdown-menu {
display: block;
position: static;
width: 100%;
box-shadow: 0 0 0 0;
- padding: 10px 10px 1px; }
- header .main-menu .dropdown-menu .dropdown-menu li {
- margin: 0; }
- header .main-menu .dropdown-menu .dropdown-menu a {
- min-height: 25px;
- padding: 0 0 0 20px; }
- header .main-menu .dropdown-menu .dropdown-menu:before {
- display: none; }
+ padding: 10px 10px 1px;
+}
+header .main-menu .dropdown-menu .dropdown-menu li {
+ margin: 0;
+}
+header .main-menu .dropdown-menu .dropdown-menu a {
+ min-height: 25px;
+ padding: 0 0 0 20px;
+}
+header .main-menu .dropdown-menu .dropdown-menu:before {
+ display: none;
+}
nav.main-menu .dropdown-menu {
left: unset;
- right: -25px; }
- nav.main-menu .dropdown-menu:before {
- left: 120px; }
- nav.main-menu .dropdown-menu > li > a {
- white-space: normal; }
+ right: -25px;
+}
+nav.main-menu .dropdown-menu:before {
+ left: 120px;
+}
+nav.main-menu .dropdown-menu > li > a {
+ white-space: normal;
+}
/*# sourceMappingURL=header.css.map */
diff --git a/sass/header.scss b/sass/header.scss
index bb8e0704284390e2aa763eef7f61c030d3c4e842..007efdb9f0fdfe94da74632c45797da4eba32cfb 100644
--- a/sass/header.scss
+++ b/sass/header.scss
@@ -2,44 +2,46 @@
// mixins variables
@import 'variables.scss';
-// header
-header {
+body{
- .site-info{
- &__text{
+ // header
+ header {
- overflow-wrap: break-word;
+ .site-info{
- a, &__slogan{
- text-shadow: 1px 0px 1px black, 0px 1px 1px black, -1px 0px 1px black, 0px -1px 1px black, 0 0 1px black;
+ &+.site-nav {
+ nav {
+ float: none;
+ }
}
- &__name{
- white-space: unset;
- text-overflow: unset;
- }
- }
+ &__text{
- }
+ overflow-wrap: break-word;
- .region-header {
- &>.name {
- display: block;
- }
+ &__name{
+ white-space: unset;
+ text-overflow: unset;
+ }
+ }
- &>.navbar-text {
- display: block;
}
- .language-switcher-language-url{
- a{
- text-shadow: 1px 0px 1px black, 0px 1px 1px black, -1px 0px 1px black, 0px -1px 1px black, 0 0 1px black;
+ .region-header {
+ &>.name {
+ display: block;
+ }
+
+ &>.navbar-text {
+ display: block;
}
+
}
-
}
+
}
+
@media only screen and (max-width: 1023px) {
header {
.region-header {
@@ -134,11 +136,6 @@ header .site-info__text__name {
padding: 2px 0 0;
}
-// overriden CERN base
-header .site-info+.site-nav nav {
- float: none;
-}
-
.region-header {
text-align: right;
diff --git a/templates/layout/page.html.twig b/templates/layout/page.html.twig
index 2787f0d64520c451e440328cfb9fa638420880f4..f8268e69d52f475fbe2372ff006d25ebbb031651 100644
--- a/templates/layout/page.html.twig
+++ b/templates/layout/page.html.twig
@@ -152,7 +152,7 @@
{% if (site_show_name and site_new_logo) or (site_show_name and site_show_slogan) or (site_new_logo and site_show_slogan) %}
<div class="site-info col-sm-12 col-md-12 col-lg-3">
{% else %}
- <div class="site-info col-sm-1">
+ <div class="site-info col-sm-2">
{% endif %}
{% if site_new_logo %}
@@ -188,7 +188,7 @@
{% if (site_show_name and site_new_logo) or (site_show_name and site_show_slogan) or (site_new_logo and site_show_slogan) %}
<div class="site-nav col-sm-12 col-md-12 col-lg-9 {% if site_show_search %}has-search{% endif %}">
{% else %}
- <div class="site-nav col-sm-11 {% if site_show_search %}has-search{% endif %}">
+ <div class="site-nav col-sm-10 {% if site_show_search %}has-search{% endif %}">
{% endif %}
{{ page.header }}