kova/hugo-profile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dropdown v3 #44

Browse Source
This commit is contained in:
gurusabarish
2022-01-26 17:33:09 +05:30
parent aeec9ef74f
commit d159cfb594
9 changed files with 107 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/_default/baseof.html
+2
View File
@@ -67,6 +67,7 @@
$("nav").toggleClass("navbar-light");
$('.text-dark').toggleClass('darkmode-text-dark');
$('.text-muted').toggleClass('darkmode-text-muted');
$(".dropdown-menu").toggleClass('darkmode-dropdown-menu');
};
</script>
<script src="/js/auto_darkmode.js"></script>
@@ -79,6 +80,7 @@
$("nav").toggleClass("navbar-light");
$('.text-dark').toggleClass('darkmode-text-dark');
$('.text-muted').toggleClass('darkmode-text-muted');
$(".dropdown-menu").toggleClass('darkmode-dropdown-menu');
switchDarkmodeSetting();
});
layouts/index.html
+2
View File
@@ -129,6 +129,7 @@
$(".about-backdark").toggleClass("about-back");
$(".education-backdark").toggleClass("education-back");
$(".achievements-backdark").toggleClass("achievements-back");
$(".dropdown-menu").toggleClass('darkmode-dropdown-menu');
}
</script>
<script src="/js/auto_darkmode.js"></script>
@@ -160,6 +161,7 @@
$("nav").toggleClass("navbar-light");
$(".text-dark").toggleClass("darkmode-text-dark");
$(".text-muted").toggleClass("darkmode-text-muted")
$(".dropdown-menu").toggleClass('darkmode-dropdown-menu');
switchDarkmodeSetting();
});
layouts/partials/sections/v3/navbar.html
+40 -4
View File
@@ -64,11 +64,47 @@
</li>
{{ end }}
{{ range site.Params.customMenus }}
<li class="nav-item navbar-text">
<a class="nav-link text-dark" href="{{.Url}}" aria-label="{{ .name }}">{{ .name }}</a>
{{ range .Site.Menus.main }}
{{ if .HasChildren }}
<!-- Dropdown menu -->
<li class="nav-item dropdown navbar-text">
<a class="nav-link text-dark dropdown-toggle" href="#" title="{{ .Title }}" id="navbarDropdownMenuLink"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{ .Name }}
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
{{ range .Children }}
<a class="dropdown-item text-dark" href="{{ .URL }}" title="{{ .Title }}">
{{ .Name }}
</a>
{{ end }}
</div>
</li>
{{ end }}
{{/*
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="{{ .URL }}" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="{{ .Title }}">
{{ .Name }}
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
{{ range .Children }}
<a class="dropdown-item" href="{{ .URL }}" title="{{ .Title }}">
{{ .Name }}</a>
{{ end }}
</div>
</li> */}}
{{else}}
<!-- Single menu item -->
<li class="nav-item navbar-text">
<a class="nav-link text-dark" href="{{.URL}}" title="{{ .Title }}">
{{ .Pre }}
<span>{{ .Name }}</span>
</a>
</li>
{{end}}
{{end}}
<li class="nav-item navbar-text">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1" autocomplete="on">
static/css/v3/darkmode.css
+3 -2
View File
@@ -10,5 +10,6 @@
color: #b0b3b8 !important;
}
.darkmode-dropdown-menu {
background-color: #212121 !important;
}
static/css/v3/navbar-footer.css
+3
View File
@@ -9,6 +9,9 @@
.navbar-text {
font-size: 16px !important;
}
li> .dropdown-toggle:focus{
color: #007bff !important;
}
/* v2 and v3 footer */
footer {
static/css/v3/v3.css
-6
View File
@@ -205,13 +205,9 @@ a:hover {
}
/* v3 experience */
#experience {
}
#nav-pills-out {
border-left: 1px solid #007bff;
}
.nav-pills .nav-link {
}
.nav-pills .active {
padding-left: 20%;
color: #818181 !important;
@@ -224,8 +220,6 @@ a:hover {
left: 0px;
color: #007bff;
}
.tab-pane {
}
.ex {
list-style-type: none;
}
static/js/auto_darkmode.js
+1 -1
View File
@@ -7,6 +7,7 @@ function setCookie(name,value,days) {
}
document.cookie = name + "=" + (value || "") + expires + "; path=/";
}
function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
@@ -52,7 +53,6 @@ function switchDarkmodeSetting() {
}
}
const check_darkmode = getDarkmodeSetting();
const darkmode_prefer = window.matchMedia('(prefers-color-scheme: dark)').matches;
if (darkmode_prefer && check_darkmode === null) {
website/config.yaml
+28 -5
View File
@@ -17,6 +17,34 @@ taxonomies:
category: "categories"
enableEmoji: true
# menus
Menus:
main:
- identifier: blog
name: Blog
title: Blog posts
url: /blog
weight: 1
#Dropdown menu
# - identifier: dropdown
# title: Example dropdown menu
# name: Dropdown
# weight: 3
# - identifier: dropdown1
# title: example dropdown 1
# name: example 1
# url: /ew
# parent: dropdown
# weight: 1
# - identifier: dropdown2
# title: example dropdown 2
# name: example 2
# url: /34545
# parent: dropdown
# weight: 2
params:
version: 3
customCSS: false
@@ -24,11 +52,6 @@ params:
favicon: "/images/fav.png"
description: "A high performance hugo theme for personal portfolio and blog."
# Navbar Menus
customMenus:
- name: "Blog"
Url: "/blog"
# home
disable_home: false
profile_image: "/images/profile.png"
website/v3.yaml
+28 -5
View File
@@ -17,6 +17,34 @@ taxonomies:
category: "categories"
enableEmoji: true
# menus
Menus:
main:
- identifier: blog
name: Blog
title: Blog posts
url: /blog
weight: 1
#Dropdown menu
# - identifier: dropdown
# title: Example dropdown menu
# name: Dropdown
# weight: 3
# - identifier: dropdown1
# title: example dropdown 1
# name: example 1
# url: /ew
# parent: dropdown
# weight: 1
# - identifier: dropdown2
# title: example dropdown 2
# name: example 2
# url: /34545
# parent: dropdown
# weight: 2
params:
version: 3
customCSS: false
@@ -24,11 +52,6 @@ params:
favicon: "/images/fav.png"
description: "A high performance hugo theme for personal portfolio and blog."
# Navbar Menus
customMenus:
- name: "Blog"
Url: "/blog"
# home
disable_home: false
profile_image: "/images/profile.png"