diff options
author | Thedro Neely <thedroneely@gmail.com> | 2022-07-19 11:59:45 -0400 |
---|---|---|
committer | Thedro Neely <thedroneely@gmail.com> | 2022-07-19 11:59:45 -0400 |
commit | ea54421b15c9705f86a8d25a6caaa40791d66e18 (patch) | |
tree | 546ec8892c2140a48129fd521189dc68b567c95b /app | |
parent | f888991f298e59933250c8d56080c1805068f5e0 (diff) | |
download | thedroneely.com-ea54421b15c9705f86a8d25a6caaa40791d66e18.tar.gz thedroneely.com-ea54421b15c9705f86a8d25a6caaa40791d66e18.tar.bz2 thedroneely.com-ea54421b15c9705f86a8d25a6caaa40791d66e18.zip |
app: Refactor and CSS rewrite
Diffstat (limited to 'app')
-rw-r--r-- | app/views/components/context.menu.php | 58 | ||||
-rw-r--r-- | app/views/components/navigator.link.dropdown.php | 2 | ||||
-rw-r--r-- | app/views/components/navigator.link.php | 17 | ||||
-rw-r--r-- | app/views/components/theme.toggle.php | 13 | ||||
-rw-r--r-- | app/views/contact.view.php | 155 | ||||
-rw-r--r-- | app/views/index.view.php | 181 | ||||
-rw-r--r-- | app/views/partials/footer.php | 60 | ||||
-rw-r--r-- | app/views/partials/header.php | 23 | ||||
-rw-r--r-- | app/views/partials/navigator.php | 91 | ||||
-rw-r--r-- | app/views/resume.view.php | 411 | ||||
-rw-r--r-- | app/views/snippets/favicons.php | 14 | ||||
-rw-r--r-- | app/views/snippets/stylesheets.php | 13 | ||||
-rw-r--r-- | app/views/upload.view.php | 39 |
13 files changed, 493 insertions, 584 deletions
diff --git a/app/views/components/context.menu.php b/app/views/components/context.menu.php index 1a3356a..75e1746 100644 --- a/app/views/components/context.menu.php +++ b/app/views/components/context.menu.php @@ -1,39 +1,29 @@ -<div class="dropdown <?php echo $type ?? null ?>"> - <input - class="is-hidden dropdown-input" - type="checkbox" - id="dropdown-menu__<?php echo $id ?? null ?>" - /> +<context-menu-container> + <more-button> + <input hidden type="checkbox" id="context-menu-<?php echo $id ?? null ?>"/> + <label for="context-menu-<?php echo $id ?? 'none' ?>"><?php echo $label ?? null ?></label> - <label class="dropdown-label" for="dropdown-menu__<?php echo $id ?? 'none' ?>"> - <?php echo $label ?? null ?> - </label> + <context-menu list right> + <context-menu-content> + <?php + echo $content ?? null; - <div class="dropdown-menu"> - <div class="dropdown-content"> - <?php + 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 = '/abstracts/'; $label = 'Abstracts'; 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'); - 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 = '/abstracts/'; $label = 'Abstracts'; 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'); - } + include views('components', 'theme.toggle'); + } ?> - </div> - </div> -</div> + </context-menu-content> + </context-menu> + </more-button> +</context-menu-container> -<?php $type = $id = $label = $content = $links = null; ?> +<?php $id = $label = $content = $links = null; ?> diff --git a/app/views/components/navigator.link.dropdown.php b/app/views/components/navigator.link.dropdown.php index 0657bc6..e0ec008 100644 --- a/app/views/components/navigator.link.dropdown.php +++ b/app/views/components/navigator.link.dropdown.php @@ -1,6 +1,6 @@ <a href="<?php echo $route ?? null; ?>" - class="<?php if ($navigation->isActive($route ?? null)) { echo ' navbar__active'; } ?> navbar-item" title="<?php echo $label ?? null; ?>" + <?php if ($navigation->isActive($route ?? null)) { echo ' data-active'; } ?> > <?php echo $label ?? null; ?> </a> diff --git a/app/views/components/navigator.link.php b/app/views/components/navigator.link.php index 3b57d62..f255903 100644 --- a/app/views/components/navigator.link.php +++ b/app/views/components/navigator.link.php @@ -1,14 +1,15 @@ -<a href="<?php echo $route ?? null; ?>" class="navbar-item navbar__icon has-text-centered +<a + href="<?php echo $route ?? null; ?>" <?php $hiddenLabels = [ 'Profile' ]; - if (in_array($label, $hiddenLabels)) { echo ' navbar__icon__hidden'; } - if ($navigation->isActive($route ?? null)) { echo ' navbar__active'; } + if (in_array($label, $hiddenLabels)) { echo ' data-hidden'; } + if ($navigation->isActive($route ?? null)) { echo ' data-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> +> + <?php echo icon($icon ?? null); ?> + <span title="<?php echo $label ?? null; ?>"> + <?php echo $label ?? null; ?> + </span> </a> <?php $route = $label = $icon = null; ?> diff --git a/app/views/components/theme.toggle.php b/app/views/components/theme.toggle.php index 3b2d15b..71e8841 100644 --- a/app/views/components/theme.toggle.php +++ b/app/views/components/theme.toggle.php @@ -1,5 +1,4 @@ <form - class="<?php echo $formClass ?? null; ?>" method="get" action="<?php echo $_SERVER['REQUEST_URI']; ?>" > @@ -7,29 +6,25 @@ <button title="Switch to Light Theme" - class="<?php echo $buttonClass ?? null; ?>" name="theme" type="submit" value="light" > - <?php echo icon('sun', $iconClass ?? null); ?> - <span>Light</span> + <?php echo icon('moon'); ?> + <span>Dark</span> </button> <?php } else { ?> <button title="Switch to Dark Theme" - class="<?php echo $buttonClass ?? null; ?>" name="theme" type="submit" value="dark" > - <?php echo icon('moon', $iconClass ?? null); ?> - <span>Dark</span> + <?php echo icon('sun'); ?> + <span>Light</span> </button> <?php } ?> </form> - -<?php $formClass = $buttonClass = $iconClass = null; ?> diff --git a/app/views/contact.view.php b/app/views/contact.view.php index 07ac68a..42c03a5 100644 --- a/app/views/contact.view.php +++ b/app/views/contact.view.php @@ -2,93 +2,74 @@ <?php require __DIR__ . '/partials/header.php'; ?> - <body> - - <?php require __DIR__ . '/partials/navigator.php'; ?> - - <section class="section"> - - <div class="container"> - <div class="columns is-centered"> - <div class="column is-7"> - - <article class="content"> - - <h1 class="title is-3">Contact</h1> - - <?php if (isset($formSuccess)) : ?> - <div class="message__success" role="alert"> - <p>Your message has been successful. I'll get in touch with you soon!</p> - </div> - <?php endif; ?> - - <p> - Interested in collaborating? - Complete and submit the form below to send me a direct message. - </p> - - <form method="post" action="/contact/"> - - <div class="field is-horizontal"> - <div class="field-body"> - <div class="field is-expanded"> - <label for="name" class="heading is-size-6">Name</label> - <div class="field has-addons"> - <p class="control is-expanded"> - <input id="name" class="input" type="text" name="26471" value="<?php echo $name ?? '' ?>"> - </p> - </div> - </div> - <div class="field is-expanded"> - <label for="email" class="heading is-size-6">Email <span class="alert">*</span></label> - <div class="field has-addons"> - <p class="control is-expanded"> - <input id="email" class="input <?php echo $border = isset($emailError) ? 'is-danger' : '';?>" - type="email" name="26472" value="<?php echo $email ?? '' ?>" required> - </p> - </div> - </div> - </div> - </div> - - <label for="message" class="heading is-size-6">Message <span class="alert">*</span></label> - - <div class="field is-horizontal"> - <div class="field-body"> - <div class="field"> - <div class="control"> - <textarea id="message" class="textarea" name="26478" placeholder="" required><?php echo $message ?? '' ?></textarea> - </div> - </div> - </div> - </div> - - <br> - - <div class="field is-horizontal"> - <div class="field-body"> - <div class="field"> - <div class="control"> - <button class="button item__box has-text-weight-normal"> - <?php echo icon('send'); ?> - <span>Send Message</span> - </button> - </div> - </div> - </div> - </div> - - <input type="checkbox" name="agree" class="agree" tabindex="-1"> - - </form> - - </article> - - </div> - </div> - </div> - - </section> +<body> + +<?php require __DIR__ . '/partials/navigator.php'; ?> + +<main> + <contact-page> + <article> + + <h1>Contact</h1> + + <?php if (isset($formSuccess)) : ?> + <aside> + <p>Your message has been successful. I'll get in touch with you soon!</p> + </aside> + <?php endif; ?> + + <p> + Interested in collaborating? Complete and submit the form below to send me a + direct message. + </p> + + <form method="post" action="/contact/"> + + <field-set> + + <section> + <label for="name">Name</label> + <input + id="name" + type="text" + name="26471" + value="<?php echo $name ?? '' ?>" + > + </section> + + <section> + <label for="email">Email <span data-danger>*</span></label> + <input + required + id="email" + type="email" + name="26472" + value="<?php echo $email ?? '' ?>" + <?php echo $border = isset($emailError) ? 'data-contact-required' : '';?> + > + </section> + + </field-set> + + <label for="message">Message <span data-danger>*</span></label> + <textarea + id="message" + name="26478" + placeholder="" required + ><?php echo $message ?? '' ?> </textarea> + + <button> + <?php echo icon('send'); ?> + <span>Send Message</span> + </button> + + <input type="checkbox" name="agree" tabindex="-1"> + + </form> + + </article> + </contact-page> + </main> <?php require __DIR__ . '/partials/footer.php'; ?> diff --git a/app/views/index.view.php b/app/views/index.view.php index 8261d35..bef54f5 100644 --- a/app/views/index.view.php +++ b/app/views/index.view.php @@ -1,109 +1,90 @@ <?php require __DIR__ . '/partials/header.php';?> - <body> +<body> <?php require __DIR__ . '/partials/navigator.php';?> - <section class="section"> - - <div class="container"> - <div class="columns is-centered"> - <div class="column is-7"> - - <h1 class="title has-text-weight-normal"> - <span> - Web - <span class="has-text-danger"> - Developer - </span> - </span> - </h1> - - <h2 class="subtitle has-text-grey-dark has-text-weight-normal"> - In it for the long haul - </h2> - - <video-container> - <video preload="none" poster="/images/pipes.png" width="732" autoplay loop muted playsinline> - <source src="/videos/pipes.mp4" type="video/mp4" /> - <p> - Sorry, your browser doesn't support embedded videos. Here is a - <a href="/videos/pipes.mp4">link to the video</a> instead. - </p> - </video> - <figcaption class="has-text-grey-dark">pipes.sh terminal screensaver</figcaption> - </video-container> - - <div class="content"> - - <p class="introduction has-text-left"> - <?php fetch('/cockpit/api/singletons/get/introduction', 'text'); ?> - </p> - - <span class="quote marginnote leftnote"> - <span class="has-text-weight-bold has-margin-bottom-sm is-block">Random Quote</span> - <?php echo shell_exec('fortune ' . dirname($_SERVER['DOCUMENT_ROOT']) . '/generators/fortune/quotes.fortune'); ?> - </span> - - </div> - - <div class="recent__article"> - - <label for="posts" class="title is-inline-block is-4 has-text-weight-normal marginnote-toggle marginnote-mark"> - Recent Posts - </label> - - <input type="checkbox" id="posts" class="marginnote-toggle"> - - <span class="marginnote rightnote"> - See an archive of all posts <a href="/posts/archive/">here.</a> - </span> - - <?php - $recentPosts = new DOMExtract(); - echo $recentPosts->innerHTML('recent-articles', $_SERVER['DOCUMENT_ROOT'] . '/posts/index.html'); - ?> - - <a href="/posts/page/2/" - class="front__more is-block has-text-centered"> - See More Posts - <?php icon('chevron-right'); ?> - </a> - - <br> - - - <label for="projects" class="title is-inline-block is-4 has-text-weight-normal marginnote-toggle marginnote-mark"> - Recent Projects - </label> - - <input type="checkbox" id="projects" class="marginnote-toggle"> - - <span class="marginnote rightnote"> - See an archive of all projects <a href="/projects/archive/">here.</a> - </span> - - <?php - $recentProjects = new DOMExtract(); - echo $recentPosts->innerHTML('recent-articles', $_SERVER['DOCUMENT_ROOT'] . '/projects/index.html'); - ?> - </div> - - <a href="/projects/page/2/" - class="front__more is-block has-text-centered"> - See More Projects - <?php icon('chevron-right'); ?> - </a> - - <br> - - </div> - </div> - </div> - - </section> +<main> + <home-page> + <article> + + <h1>Web <em>Developer </em></h1> + + <h2>In it for the long haul</h2> + + <video-container> + <video preload="none" poster="/images/pipes.png" width="732" autoplay loop muted playsinline> + <source src="/videos/pipes.mp4" type="video/mp4" /> + <p> + Sorry, your browser doesn't support embedded videos. Here is a + <a href="/videos/pipes.mp4">link to the video</a> instead. + </p> + </video> + <footer><a href="https://github.com/pipeseroni/pipes.sh#readme">pipes.sh</a> terminal screensaver</footer> + </video-container> + + <home-page-intro> + <?php fetch('/cockpit/api/singletons/get/introduction', 'text'); ?> + </home-page-intro> + + <fortune-quote> + <margin-note left> + <b>Random Quote</b> + <?php echo shell_exec('fortune ' . dirname($_SERVER['DOCUMENT_ROOT']) . '/generators/fortune/quotes.fortune'); ?> + </margin-note> + </fortune-quote> + + <home-page-posts> + + <margin-note-aside> + <label for="posts">Recent Posts</label> + <input type="checkbox" id="posts" name="toggle"> + <margin-note right> + See an archive of all posts <a href="/archives/posts/">here.</a> + </margin-note> + </margin-note-aside> + + <?php + $recentPosts = new DOMExtract(); + echo $recentPosts->innerHTML('recent-articles', $_SERVER['DOCUMENT_ROOT'] . '/posts/index.html'); + ?> + + <a href="/posts/page/2/"> + See More Posts + <?php echo icon('corner-down-right'); ?> + </a> + </home-page-posts> + + <br> + + <home-page-projects> + + <margin-note-aside> + <label for="projects">Recent Projects</label> + <input type="checkbox" id="projects" name="toggle"> + <margin-note right> + See an archive of all projects <a href="/archives/projects/">here.</a> + </margin-note> + </margin-note-aside> + + <?php + $recentProjects = new DOMExtract(); + echo $recentPosts->innerHTML('recent-articles', $_SERVER['DOCUMENT_ROOT'] . '/projects/index.html'); + ?> + + <a href="/projects/page/2/"> + See More Projects + <?php echo icon('corner-down-right'); ?> + </a> + </home-page-projects> + + <br> + + </article> + </home-page> +</main> <?php require __DIR__ . '/partials/footer.php';?> - </body> +</body> </html> diff --git a/app/views/partials/footer.php b/app/views/partials/footer.php index f82d4e1..0a7b37b 100644 --- a/app/views/partials/footer.php +++ b/app/views/partials/footer.php @@ -1,53 +1,39 @@ -<footer class="hero-foot"> - <div class="footer"> - <div class="container"> +<footer> - <div class="columns is-centered"> - <div class="column is-6 has-text-centered footer__section"> + <a href="/sitemap.xml">Site Map</a> | - <p class="has-text-grey-dark is-size-7"> + <a href="/posts/rss.xml">RSS Feed</a> | - <a href="/sitemap.xml">Site Map</a> | + <a href="/index.json">JSON Feed</a> | - <a href="/posts/rss.xml">RSS Feed</a> | + <a href="/resume/">Resume</a> - <a href="/index.json">JSON Feed</a> | + <br> - <a href="/resume">Resume</a> + <a rel="me" href="https://gitlab.com/tdro">Gitlab</a> | - <br> + <a rel="me" href="https://github.com/tdro">Github</a> | - <a rel="me" href="https://gitlab.com/tdro">Gitlab</a> | + <a rel="me" href="https://codeberg.org/tdro">Codeberg</a> | - <a rel="me" href="https://github.com/tdro">Github</a> | + <a href="/analytics">Analytics</a> | - <a rel="me" href="https://codeberg.org/tdro">Codeberg</a> | + <a href="#">Back To Top</a> - <a href="/analytics">Analytics</a> | + <p> + The content for this site is <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>. + The <a href="/git/thedroneely/thedroneely.com">source code</a> + for this site is <a href="https://opensource.org/licenses/GPL-3.0">GPL</a>.<br> + Copyright © 2018 — <?php echo date("Y"); ?> + </p> - <a href="#">Back To Top</a> + <p hidden class="h-card"> + <img class="u-photo" src="data:image/ico;base64,<?php echo base64('/public/favicon.ico'); ?>" alt="Terminal" /> + <a class="p-name u-url" href="https://www.thedroneely.com">Thedro Neely</a> + <span class="p-note">Thedro Neely is a web developer based in The Bahamas.</span> + <span class="p-country-name">The Bahamas</span> + </p> - </p> - - <p class="has-text-grey-dark is-size-7"> - The content for this site is <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>. - The <a href="/git/thedroneely/thedroneely.com">source code</a> - for this site is <a href="https://opensource.org/licenses/GPL-3.0">GPL</a>.<br> - Copyright © 2018 — <?php echo date("Y"); ?> - </p> - - <p class="is-hidden h-card"> - <img class="u-photo" src="data:image/ico;base64,<?php echo base64('/public/favicon.ico'); ?>" alt="Terminal" /> - <a class="p-name u-url" href="https://www.thedroneely.com">Thedro Neely</a> - <span class="p-note">Thedro Neely is a web developer based in The Bahamas.</span> - <span class="p-country-name">The Bahamas</span> - </p> - - </div> - </div> - - </div> - </div> </footer> <script src="/js/app.js"></script> diff --git a/app/views/partials/header.php b/app/views/partials/header.php index b236575..e5439be 100644 --- a/app/views/partials/header.php +++ b/app/views/partials/header.php @@ -1,22 +1,21 @@ <!DOCTYPE html> -<html class="has-navbar-fixed-top" lang="en-us" itemscope itemtype="http://schema.org/WebPage"> +<html lang="en-us" itemscope itemtype="http://schema.org/WebPage"> <head> - <title><?php echo $title = $title ?? 'Portfolio - '; ?>Thedro Neely</title> +<title><?php echo $title = $title ?? 'Portfolio - '; ?>Thedro Neely</title> - <meta name="description" content="Thedro's Portfolio Website"> - <meta name="keywords" content="Thedro,Neely,Portfolio,Website"> - <meta name="author" content="Thedro Neely"> +<meta charset="utf-8"> +<meta name="robots" content="index,follow"> +<meta name="author" content="Thedro Neely"> +<meta name="description" content="Thedro's Portfolio Website"> +<meta name="keywords" content="Thedro,Neely,Portfolio,Website"> +<meta name="viewport" content="width=device-width, initial-scale=1"> - <meta charset="utf-8"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <meta name="robots" content="index,follow"> +<?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/rss.php'; ?> - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/rss.php'; ?> +<?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/favicons.php'; ?> - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/favicons.php'; ?> - - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/stylesheets.php'; ?> +<?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/stylesheets.php'; ?> </head> diff --git a/app/views/partials/navigator.php b/app/views/partials/navigator.php index ab2ea58..a9e8c7c 100644 --- a/app/views/partials/navigator.php +++ b/app/views/partials/navigator.php @@ -1,57 +1,48 @@ -<nav id="navbar" class="navbar is-fixed-top" aria-label="main navigation"> - <div class="container"> - <div class="navbar-menu"> - <div class="columns is-centered"> +<nav id="navbar"> + <section> - <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> + <column-left> + <button-repo> + <button-anchor> + <a title="Go to Website Repository" href="/git/"> + <?php echo icon('git-commit'); ?> + <span>Repo</span> + </a> + </button-anchor> + </button-repo> - <?php - $formClass = 'is-inline'; - $buttonClass ='navbar-item button item__box'; - require views('components', 'theme.toggle'); - ?> - </div> + <?php require views('components', 'theme.toggle'); ?> + </column-left> - <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'); - ?> + <column-middle> + <?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'); + ?> - <?php - $links = true; - $id = 'mobile-compact'; - $type = 'navbar-item is-menu is-right navbar__icon has-text-dark has-tap-transparent'; - $icon = icon('arrow-down-circle'); - $label = <<<insert - <span class="is-block has-text-centered"> - $icon - <span class="is-block navbar__icon__label">More</span> - </span> - insert; - require views('components', 'context.menu'); - ?> - </div> + <?php + $links = true; + $id = 'navigation'; + $icon = icon('arrow-down-circle'); + $label = <<<insert + $icon + <span>More</span> + insert; + require views('components', 'context.menu'); + ?> + </column-middle> - <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> + <column-right> + <button-anchor> + <a title="Coffee" href ="https://ko-fi.com/thedroneely"> + <?php echo icon('coffee'); ?> + <span>Coffee</span> + </a> + </button-anchor> + </column-right> - </div> - </div> - </div> + </section> </nav> diff --git a/app/views/resume.view.php b/app/views/resume.view.php index e61bdab..dd3d3e8 100644 --- a/app/views/resume.view.php +++ b/app/views/resume.view.php @@ -3,265 +3,248 @@ <head> - <title>Resume - Thedro Neely</title> + <title>Resume - Thedro Neely</title> - <meta name="description" content="Thedro's Web Development Resume"> - <meta name="keywords" content="Thedro,Neely,Portfolio,Website,Resume"> - <meta name="author" content="Thedro Neely"> + <meta charset="utf-8"> + <meta name="description" content="Thedro's Web Development Resume"> + <meta name="keywords" content="Thedro,Neely,Portfolio,Website,Resume"> + <meta name="author" content="Thedro Neely"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta name="robots" content="index,follow"> - <meta charset="utf-8"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <meta name="robots" content="index,follow"> + <style>html::-webkit-scrollbar { height: 0; width: 0; }</style> - <style>html::-webkit-scrollbar { height: 0; width: 0; }</style> + <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/rss.php'; ?> - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/rss.php'; ?> + <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/favicons.php'; ?> - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/favicons.php'; ?> - - <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/stylesheets.php'; ?> - - <link rel="stylesheet" href="/css/bulma-timeline.css"> + <?php require $_SERVER['DOCUMENT_ROOT'] . '/..' . '/app/views/snippets/stylesheets.php'; ?> </head> - <body> - - <div class="columns max__height is-gapless"> + <body data-resume> - <div class="column column__background is-4"> + <resume-page> - <section class="section has-text-centered"> - - <a href="/resume" class="title has-text-weight-normal is-size-4 has-text-white inline__padding">Resume</a> + <column-left> + <section> + <h1> + <a href="/resume/">Resume</a> + </h1> <br> - <a href="/contact/" class="resume__label title has-text-weight-normal is-size-7 text__frame">Contact for Full Resume</a> + <p> + <a href="/contact/">Contact for Full Resume</a> + </p> <br> - <h1 class="title has-text-weight-normal is-size-3 has-text-white inline__padding">Web <br> Developer</h1> + <h1><a href="/">Web <br> Developer</a></h1> <br> - <p> - <a href="/" class="title has-text-weight-normal is-size-7 resume__label">https://www.thedroneely.com</a> - </p> + <p><a href="/">https://www.thedroneely.com</a></p> <br> <p> - <a href="#tools" class="title has-text-weight-normal is-size-7 resume__label">#Tools</a> - - <a href="#projects" class="title has-text-weight-normal is-size-7 resume__label">#Projects</a> - - <a href="#questions" class="title has-text-weight-normal is-size-7 resume__label">#Questions</a> + <a href="#stack">#Stack</a> + <a href="#questions">#Questions</a> + <a href="#projects">#Projects</a> </p> + </section> + </column-left> - </section> + <column-right> - </div> + <main> - <div class="column column__right is-size-6"> - - <div id="tools" class="resume__container"> - - <div class="resume__break"></div> - <div class="resume__break"></div> - - <div class="column resume__column"> + <article> <section> - - <h1 class="title has-text-weight-normal has-text-primary is-4"> - Thedro Neely - </h1> - - <p class="is-size-7"> - Hi, My name is Thedro, and I'm a web developer based in The Bahamas. - </p> - + <h1>Thedro Neely</h1> + <p>Hi, My name is Thedro, and I'm a web developer based in The Bahamas.</p> </section> <br> - <div class="columns"> - - <div class="column"> - - <section> - <h1 class="heading title has-text-weight-semibold">Stack</h1> - </section> - - <br> - - <section> - - <div class="timeline"> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Front End</p> - <p class="is-size-7">HTML CSS JavaScript Bulma</p> - <p class="is-size-7">Bootstrap Sass Tailwind</p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Back End</p> - <p class="is-size-7">PHP Python MariaDB MySQL</p> - <p class="is-size-7">PostgreSQL Nginx Apache </p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Tooling and Frameworks</p> - <p class="is-size-7">LaTeX Laravel Sublime Text</p> - <p class="is-size-7">Npm Webpack Gimp Hugo</p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Version Systems & GUIs</p> - <p class="is-size-7">Git Gitlab Github Gitea</p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Sys Admin</p> - <p class="is-size-7">CentOS Debian Windows</p> - <p class="is-size-7">Android Alpine pfSense/Opnsense</p> - <p class="is-size-7">Systemd DNS SMTP DHCP</p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Dev Ops</p> - <p class="is-size-7">Docker Jenkins Drone CI</p> - <p class="is-size-7">LXC</p> - </div> - </div> - - </div> - - </section> - - </div> - - <div class="column"> - - <section id="questions"> - <h1 class="heading title has-text-weight-semibold">Questions</h1> - </section> - - <br> - - <section> - - <div class="timeline"> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">Are you currently available for work?</p> - <p class="is-size-7"> - Yes, I'm currently available for - contract work and full-time job - opportunities. - </p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">How long have you been programming?</p> - <p class="is-size-7"> - I've been programming for a long time, too long to accurately say. - </p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">What is your preferred stack?</p> - <p class="is-size-7"> - PHP 7 + PostgreSQL. Pretty decent stuff. I'm still learning - Vue and React. I'd like to learn Go next. - </p> - </div> - </div> - - <div class="timeline-item"> - <div class="timeline-marker"></div> - <div class="timeline-content"> - <p class="heading">What's your OS setup?</p> - <p class="is-size-7"> - Linux distribution on bare metal, and everything else floating on top. - Arch bare metaling and hosting CentOS, Debian, Void, Windows and macOS. - </p> - </div> - </div> - - </div> - - </section> - - </div> - - </div> - </div> + <column-section> + + <column-stack> + <section> + <h1>Stack</h1> + </section> + + <br> + + <section> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Front End</h1> + <p>HTML CSS JavaScript Bulma</p> + <p>Bootstrap Sass Tailwind</p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Back End</h1> + <p>PHP Python MariaDB MySQL</p> + <p>PostgreSQL Nginx Apache </p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Tooling and Frameworks</h1> + <p>LaTeX Laravel Sublime Text</p> + <p>Npm Webpack Gimp Hugo</p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Version Systems & GUIs</h1> + <p>Git Gitlab Github Gitea</p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Sys Admin</h1> + <p>CentOS Debian Windows</p> + <p>Android Alpine pfSense/Opnsense</p> + <p>Systemd DNS SMTP DHCP</p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Dev Ops</h1> + <p>Docker Jenkins Drone CI</p> + <p>LXC</p> + </timeline-content> + </timeline-item> + + </section> + </column-stack> + + <column-questions> + <section id="questions"> + <h1>Questions</h1> + </section> + + <br> + + <section> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>Are you currently available for work?</h1> + <p> + Yes, I'm currently available for contract work and full-time job + opportunities. + </p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>How long have you been programming?</h1> + <p>I've been programming for a long time, too long to accurately say.</p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>What is your preferred stack?</h1> + <p> + PHP 7 + PostgreSQL. Pretty decent stuff. I'm still learning Vue and React. I'd + like to learn Go next. + </p> + </timeline-content> + </timeline-item> + + <timeline-item> + <aside></aside> + <timeline-content> + <h1>What's your OS setup?</h1> + <p> + Linux distribution with everything else floating on top. NixOS hosting Arch, + CentOS, Debian, Void, Windows, macOS and more. + </p> + </timeline-content> + </timeline-item> + + </section> + </column-questions> + + </column-section> + </article> <br> <section id="projects"> - <h1 class="heading title has-text-weight-semibold">Projects</h1> + <h1>Projects</h1> </section> - <div class="resume__break"></div> + <br> <section> - <div class="tile is-ancestor"> - - <div class="tile is-parent"> - <a href="/projects/personal-portfolio"> - <img width="203" height="360" src="/images/personal-portfolio.png" alt="thedro"> - </a> - </div> - - <div class="tile is-parent"> - <a href="/projects/bulma-resume"> - <img width="203" height="360" src="/images/bulma-resume.png" alt="resume"> - </a> - </div> - - <div class="tile is-parent"> - <a href="/projects/voiceover-website/"> - <img width="203" height="360" src="/images/voiceover-website.png" alt="edwin"> - </a> - </div> - - </div> + + <tile-set> + <tile-item> + <a href="/projects/personal-portfolio/"> + <img + width="203" + height="360" + src="/images/personal-portfolio.png" + alt="thedro" + > + </a> + </tile-item> + + <tile-item> + <a href="/projects/bulma-resume/"> + <img + width="203" + height="360" + src="/images/bulma-resume.png" + alt="resume" + > + </a> + </tile-item> + + <tile-item> + <a href="/projects/voiceover-website/"> + <img + width="203" + height="360" + src="/images/voiceover-website.png" + alt="edwin" + > + </a> + </tile-item> + </tile-set> + </section> - </div> + </main> - </div> + </column-right> - </div> + </resume-page> </body> </html> diff --git a/app/views/snippets/favicons.php b/app/views/snippets/favicons.php index 424d2a3..f052ee5 100644 --- a/app/views/snippets/favicons.php +++ b/app/views/snippets/favicons.php @@ -1,7 +1,7 @@ - <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,<?php echo base64('/public/favicon-32x32.png'); ?>"> - <link rel="icon" type="image/png" sizes="16x16" href="data:image/png;base64,<?php echo base64('/public/favicon-16x16.png'); ?>"> - <link rel="manifest" href="data:application/manifest+json;base64,<?php echo base64('/public/site.webmanifest'); ?>"> - <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"> - <meta name="msapplication-TileColor" content="#b91d47"> - <meta name="theme-color" content="#ffffff"> +<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> +<link rel="icon" type="image/png" sizes="32x32" href="data:image/png;base64,<?php echo base64('/public/favicon-32x32.png'); ?>"> +<link rel="icon" type="image/png" sizes="16x16" href="data:image/png;base64,<?php echo base64('/public/favicon-16x16.png'); ?>"> +<link rel="manifest" href="data:application/manifest+json;base64,<?php echo base64('/public/site.webmanifest'); ?>"> +<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"> +<meta name="msapplication-TileColor" content="#b91d47"> +<meta name="theme-color" content="#ffffff"> diff --git a/app/views/snippets/stylesheets.php b/app/views/snippets/stylesheets.php index 6132261..7eb1c06 100644 --- a/app/views/snippets/stylesheets.php +++ b/app/views/snippets/stylesheets.php @@ -5,10 +5,11 @@ <?php } ?> <noscript> - <style> - .has-navbar-fixed-top { padding-top: 0 !important; } - .is-fixed-top { position: unset !important; } - .posts__more__content { margin-bottom: 0 !important; } - .isso-comments-counter, .comments__section { display: none; } - </style> + <style> + article-comments, + [href="#isso-thread"], + article-meta-top aside:nth-child(2) svg:first-child { + display: none; + } + </style> </noscript> diff --git a/app/views/upload.view.php b/app/views/upload.view.php index 93ab171..f504d5b 100644 --- a/app/views/upload.view.php +++ b/app/views/upload.view.php @@ -2,31 +2,32 @@ <?php require __DIR__ . '/partials/header.php';?> - <body> +<body> <?php require __DIR__ . '/partials/navigator.php';?> - <section class="section"> - <div class="container"> + <main> + <article> + <upload-page> + <h1>Upload Files</h1> + <div id="file-upload-area"></div> + </upload-page> + </article> + </main> - <h1 class="title has-text-centered">Upload Files</h1> - <div id="file-upload-area"></div> + <link href="/css/uppy.min.css" rel="stylesheet"> - </div> - </section> + <script src="/js/uppy.min.js"></script> - <link href="/css/uppy.min.css" rel="stylesheet"> - <script src="/js/uppy.min.js"></script> + <script> + var uppy = Uppy.Core() + .use(Uppy.Url, { companionUrl: 'https://www.thedroneely.com/' }) + .use(Uppy.Webcam, {}) + .use(Uppy.Dashboard, { inline: true, target: '#file-upload-area', plugins: ['Url', 'Webcam'] }) + .use(Uppy.XHRUpload, {endpoint: '/upload/', formdata: true, fieldName: 'upload' }) + </script> - <script> - var uppy = Uppy.Core() - .use(Uppy.Url, { companionUrl: 'https://www.thedroneely.com/' }) - .use(Uppy.Webcam, {}) - .use(Uppy.Dashboard, { inline: true, target: '#file-upload-area', plugins: ['Url', 'Webcam'] }) - .use(Uppy.XHRUpload, {endpoint: '/upload/', formdata: true, fieldName: 'upload' }) - </script> +<?php require __DIR__ . '/partials/footer.php';?> - <?php require __DIR__ . '/partials/footer.php';?> - - </body> +</body> </html> |