diff options
author | Thedro Neely <thedroneely@gmail.com> | 2021-04-30 03:51:13 -0400 |
---|---|---|
committer | Thedro Neely <thedroneely@gmail.com> | 2021-04-30 15:31:01 -0400 |
commit | 9d39a7ba3de79e27029bb5c9c2d72e114d8fa795 (patch) | |
tree | 226696a3c635e5f91b1ca97edff49b7f34663f58 /app | |
parent | fbd112c924190b1f622c59ff480f0cd2a2433249 (diff) | |
download | thedroneely.com-9d39a7ba3de79e27029bb5c9c2d72e114d8fa795.tar.gz thedroneely.com-9d39a7ba3de79e27029bb5c9c2d72e114d8fa795.tar.bz2 thedroneely.com-9d39a7ba3de79e27029bb5c9c2d72e114d8fa795.zip |
app/views/partials/navigator: Unify
Diffstat (limited to 'app')
-rw-r--r-- | app/views/components/context-menu.php | 25 | ||||
-rw-r--r-- | app/views/components/context.menu.php | 38 | ||||
-rw-r--r-- | app/views/components/navigator.link.dropdown.php | 13 | ||||
-rw-r--r-- | app/views/components/navigator.link.php | 18 | ||||
-rw-r--r-- | app/views/components/theme.toggle.php (renamed from app/views/components/theme-toggle.php) | 6 | ||||
-rw-r--r-- | app/views/partials/navigator.links.php | 19 | ||||
-rw-r--r-- | app/views/partials/navigator.php | 126 |
7 files changed, 117 insertions, 128 deletions
diff --git a/app/views/components/context-menu.php b/app/views/components/context-menu.php deleted file mode 100644 index 882bb60..0000000 --- a/app/views/components/context-menu.php +++ /dev/null @@ -1,25 +0,0 @@ -<div class="dropdown <?php echo $type ?? null ?>"> - <input - class="is-hidden dropdown-input" - type="checkbox" - id="dropdown-menu__<?php echo $id ?? null ?>" - /> - - <label class="dropdown-label" for="dropdown-menu__<?php echo $id ?? null ?>"> - <?php echo $label ?? null ?> - </label> - - <div class="dropdown-menu"> - <div class="dropdown-content"> - <?php - echo $content ?? null; - if ($links ?? null === true) { - include views('partials', 'navigator.links'); - $formClass = 'theme-toggle'; - $buttonClass ='theme-toggle-button button is-text has-text-left is-block'; - include views('components', 'theme-toggle'); - } - ?> - </div> - </div> -</div> diff --git a/app/views/components/context.menu.php b/app/views/components/context.menu.php new file mode 100644 index 0000000..59f6610 --- /dev/null +++ b/app/views/components/context.menu.php @@ -0,0 +1,38 @@ +<div class="dropdown <?php echo $type ?? null ?>"> + <input + class="is-hidden dropdown-input" + type="checkbox" + id="dropdown-menu__<?php echo $id ?? null ?>" + /> + + <label class="dropdown-label" for="dropdown-menu__<?php echo $id ?? 'none' ?>"> + <?php echo $label ?? null ?> + </label> + + <div class="dropdown-menu"> + <div class="dropdown-content"> + <?php + + echo $content ?? null; + + if ($links ?? null === true) { + + $route = '/'; $label = 'Home'; include views('components', 'navigator.link.dropdown'); + $route = '/posts/'; $label = 'Posts'; include views('components', 'navigator.link.dropdown'); + $route = '/projects/'; $label = 'Projects'; include views('components', 'navigator.link.dropdown'); + $route = '/about/'; $label = 'Profile'; include views('components', 'navigator.link.dropdown'); + $route = '/contact/'; $label = 'Contact'; include views('components', 'navigator.link.dropdown'); + $route = '/git/'; $label = 'Repository'; include views('components', 'navigator.link.dropdown'); + $route = 'https://ko-fi.com/thedroneely'; $label = 'Coffee'; include views('components', 'navigator.link.dropdown'); + + $formClass = 'theme-toggle'; + $iconClass = 'is-hidden'; + $buttonClass ='navbar-item button theme-toggle-button is-text has-text-left'; + include views('components', 'theme.toggle'); + } + ?> + </div> + </div> +</div> + +<?php $type = $id = $label = $content = $links = null; ?> diff --git a/app/views/components/navigator.link.dropdown.php b/app/views/components/navigator.link.dropdown.php new file mode 100644 index 0000000..be937f8 --- /dev/null +++ b/app/views/components/navigator.link.dropdown.php @@ -0,0 +1,13 @@ +<a href="<?php echo $route ?? null; ?>" + class=" + <?php + echo $check = ($label === 'Home') + ? ($navigation->isActiveHome() ? ' navbar__active' : '') + : ($navigation->isActive($route ?? null) ? ' navbar__active' : ''); + ?> navbar-item" + title="<?php echo $label ?? null; ?>" +> + <?php echo $label ?? null; ?> +</a> + +<?php $route = $label = null; ?> diff --git a/app/views/components/navigator.link.php b/app/views/components/navigator.link.php new file mode 100644 index 0000000..a129acf --- /dev/null +++ b/app/views/components/navigator.link.php @@ -0,0 +1,18 @@ +<a href="<?php echo $route ?? null; ?>" class="navbar-item navbar__icon has-text-centered + <?php + + $hiddenLabels = [ 'Profile' ]; + if (in_array($label, $hiddenLabels)) { echo ' navbar__icon__hidden'; } + + echo $check = ($label === 'Home') + ? ($navigation->isActiveHome() ? ' navbar__active' : '') + : ($navigation->isActive($route ?? null) ? ' navbar__active' : ''); + ?> +"> + <div class="has-text-centered"> + <?php echo icon($icon ?? null); ?> + <p title="<?php echo $label ?? null; ?>" class="navbar__icon__label"><?php echo $label ?? null; ?></p> + </div> +</a> + +<?php $route = $label = $icon = null; ?> diff --git a/app/views/components/theme-toggle.php b/app/views/components/theme.toggle.php index cfaf193..3b2d15b 100644 --- a/app/views/components/theme-toggle.php +++ b/app/views/components/theme.toggle.php @@ -12,7 +12,7 @@ type="submit" value="light" > - <?php echo icon('sun', 'is-hidden-mobile'); ?> + <?php echo icon('sun', $iconClass ?? null); ?> <span>Light</span> </button> @@ -25,9 +25,11 @@ type="submit" value="dark" > - <?php echo icon('moon', 'is-hidden-mobile'); ?> + <?php echo icon('moon', $iconClass ?? null); ?> <span>Dark</span> </button> <?php } ?> </form> + +<?php $formClass = $buttonClass = $iconClass = null; ?> diff --git a/app/views/partials/navigator.links.php b/app/views/partials/navigator.links.php deleted file mode 100644 index b207446..0000000 --- a/app/views/partials/navigator.links.php +++ /dev/null @@ -1,19 +0,0 @@ -<a href="/" class="<?php echo $check = $navigation->isActiveHome() ? 'navbar__active' : ''; ?> navbar-item navbar__item"> - Home -</a> - -<a href="/posts/" class="<?php echo $check = $navigation->isActive('posts') ? 'navbar__active' : ''; ?> navbar-item navbar__item"> - Posts -</a> - -<a href="/projects/" class="<?php echo $check = $navigation->isActive('projects') ? 'navbar__active' : ''; ?> navbar-item navbar__item"> - Projects -</a> - -<a href="/about/" class="<?php echo $check = $navigation->isActive('about') ? 'navbar__active' : ''; ?> navbar-item navbar__item"> - Profile -</a> - -<a href="/contact/" class="<?php echo $check = $navigation->isActive('contact') ? 'navbar__active' : ''; ?> navbar-item navbar__item"> - Contact -</a> diff --git a/app/views/partials/navigator.php b/app/views/partials/navigator.php index 4c5b765..67cf609 100644 --- a/app/views/partials/navigator.php +++ b/app/views/partials/navigator.php @@ -1,97 +1,59 @@ +<nav id="navbar" class="navbar is-fixed-top" aria-label="main navigation"> + <div class="container"> + <div class="navbar-menu"> + <div class="columns is-centered"> + + <div class="navbar__left column"> + <a title="Go to Website Repository" + href="/git/" + class="navbar-item item__box button is-inline-flex"> + <?php echo icon('git-commit'); ?> + <span>Repo</span> + </a> - <nav id="navbar" class="navbar is-fixed-top" aria-label="main navigation"> - - <div class="container"> - - <div class="navbar-brand navbar-mobile"> - - <a href="/" class="navbar-item navbar__icon - <?php echo $check = $navigation->isActiveHome() ? 'navbar__active' : ''; ?>"> - <div class="has-text-centered"> - <?php echo icon('user'); ?> - <p class="is-size-7 navbar__icon__align">Home</p> - </div> - </a> - - <a href="/posts/" class="navbar-item navbar__icon - <?php echo $check = $navigation->isActive('posts') ? 'navbar__active' : ''; ?>"> - <div class="has-text-centered"> - <?php echo icon('book-open'); ?> - <p class="is-size-7 navbar__icon__align">Posts</p> - </div> - </a> - - <a href="/projects/" class="navbar-item navbar__icon - <?php echo $check = $navigation->isActive('projects') ? 'navbar__active' : ''; ?>"> - <div class="has-text-centered"> - <?php echo icon('briefcase'); ?> - <p class="is-size-7 navbar__icon__align">Projects</p> - </div> - </a> + <?php + $formClass = 'is-inline'; + $buttonClass ='navbar-item button item__box'; + require views('components', 'theme.toggle'); + ?> + </div> - <a href="/contact/" class="navbar-item navbar__icon - <?php echo $check = $navigation->isActive('contact') ? 'navbar__active' : ''; ?>"> - <div class="has-text-centered"> - <?php echo icon('mail'); ?> - <p class="is-size-7 navbar__icon__align">Contact</p> - </div> - </a> + <div class="navbar__middle column is-7"> + <?php + $route = '/'; $label = 'Home'; $icon = 'home'; require views('components', 'navigator.link'); + $route = '/posts/'; $label = 'Posts'; $icon = 'feather'; require views('components', 'navigator.link'); + $route = '/projects/'; $label = 'Projects'; $icon = 'package'; require views('components', 'navigator.link'); + $route = '/about/'; $label = 'Profile'; $icon = 'file-text'; require views('components', 'navigator.link'); + $route = '/contact/'; $label = 'Contact'; $icon = 'mail'; require views('components', 'navigator.link'); + ?> - <div class="navbar-burger navbar-item navbar__icon has-text-dark has-tap-transparent"> + <div class="navbar-item navbar__icon has-text-dark has-tap-transparent"> <?php + $links = true; $id = 'mobile-compact'; $type = 'is-menu is-right'; - $icon = icon('menu'); + $icon = icon('arrow-down-circle'); $label = <<<insert - <span class="is-block has-text-centered"> - $icon - <span class="is-block is-size-7 navbar__icon__align">Menu</span> - </span> + <span class="is-block has-text-centered"> + $icon + <span class="is-block navbar__icon__label">More</span> + </span> insert; - $links = true; - require views('components', 'context-menu'); + require views('components', 'context.menu'); ?> + </div> </div> - </div> - - - <div class="navbar-menu"> - - <div class="columns is-centered has-margin-bottom-none"> - - <div class="navbar__left column"> - <a title="Go to Website Repository" - href="/git/" - class="navbar-item item__box button is-inline-flex"> - <?php echo icon('git-commit'); ?> - <span>Repo</span> - </a> - - <?php - $formClass = 'is-inline'; - $buttonClass ='navbar-item button item__box is-inline-flex'; - require views('components', 'theme-toggle'); - ?> - - </div> - - <div class="navbar__middle column is-7"> - <?php require views('partials', 'navigator.links'); ?> - </div> - - <div class="navbar__right column"> - <a title="Coffee" - href ="https://ko-fi.com/thedroneely" - class="navbar-item item__box button is-inline-flex has-margin-right-none"> - <?php echo icon('coffee'); ?> - <span>Coffee</span> - </a> - </div> - + <div class="navbar__right column"> + <a title="Coffee" + href ="https://ko-fi.com/thedroneely" + class="navbar-item item__box button is-inline-flex has-margin-left-none"> + <?php echo icon('coffee'); ?> + <span>Coffee</span> + </a> </div> </div> - </div> - </nav> + </div> +</nav> |