Commit e4faeb89 authored by Curtis Adam's avatar Curtis Adam

Replace the collapse icon with a FontAwesome hamburger icon

parent c449b66e
......@@ -130,6 +130,10 @@ $themes: (
$navbar_background: map-get($map, "navbar_background");
$navbar_text: map-get($map, "navbar_text");
$navbar_text_hover: map-get($map, "navbar_text_hover");
$navbar_collapse_background: map-get($map, "navbar_collapse_background");
$navbar_collapse_text: map-get($map, "navbar_collapse_text");
$navbar_collapse_background_hover: map-get($map, "navbar_collapse_background_hover");
$navbar_collapse_text_hover: map-get($map, "navbar_collapse_text_hover");
//navbar all
$navbar_all_background: map-get($map, "navbar_all_background");
$navbar_all_background_hover: map-get($map, "navbar_all_background_hover");
......@@ -702,6 +706,16 @@ $themes: (
$use_cases_table_header_text: map-get($map, "use_cases_table_header_text");
.navbar-toggle {
background-color: $navbar_collapse_background !important;
color: $navbar_collapse_text !important;
}
.navbar-toggle:hover, .navbar-toggle:focus {
background-color: $navbar_collapse_background_hover !important;
color: $navbar_collapse_text_hover !important;
}
#admin_user_update {
.btn.active {
background-color: $thm_green !important;
......@@ -1625,16 +1639,6 @@ $themes: (
background-color: $primary !important;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background-color: transparent !important;
}
.navbar-toggle {
i {
background-color: midnightblue !important;
}
}
.info {
color: $primary !important;
}
......
......@@ -165,6 +165,10 @@
"navbar_background": black,
"navbar_text": white,
"navbar_text_hover": $button_text_hover,
"navbar_collapse_background": #2ac55f,
"navbar_collapse_text": white,
"navbar_collapse_background_hover": $button_background_hover,
"navbar_collapse_text_hover": $button_text_hover,
//navbar all
"navbar_all_background": black,
"navbar_all_background_hover": $button_background_hover,
......
......@@ -37,6 +37,8 @@ export let Icons = class Icons {
return config.landingPageNavigation.wordcloud;
case "transcript":
return icons.topNavigation.transcripts.transcripts;
case "collapse":
return icons.topNavigation.collapse;
}
}
......
......@@ -51,7 +51,8 @@ let topNavigation = {
"displayMode": {
"wordcloud": "<i class='fas fa-cloud'></i>",
"list": "<i class='fas fa-table'></i>"
}
},
"collapse": "<i class='fas fa-hamburger'></i>"
};
let labels = {
......
......@@ -830,9 +830,9 @@ blockquote {
border-left: 5px solid #24a751;
}
.navbar-toggle {
background-color: #2ac55f !important;
.navbar-toggle {
border-radius: 10px !important;
font-size: 150%;
}
.bert-alert {
......
......@@ -14,10 +14,8 @@
</div>
<div class="navbar-header-item pull-right">
<button type="button"
class="navbar-toggle pull-right toggle-navbar-collapse needsclick">
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
class="navbar-toggle pull-right toggle-navbar-collapse needsclick flex-content">
{{{getNavigationIcon "collapse"}}}
</button>
</div>
<div class="navbar-header-item pull-right">
......
......@@ -11,10 +11,8 @@
</div>
<div class="navbar-header-item pull-right navbar-header-collapse-item">
<button type="button"
class="navbar-toggle toggle-navbar-collapse needsclick">
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
<span class="icon-bar toggle-navbar-collapse needsclick"></span>
class="navbar-toggle toggle-navbar-collapse needsclick flex-content">
{{{getNavigationIcon "collapse"}}}
</button>
</div>
{{#if isImpressum}}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment