diff options
author | Thedro Neely <thedroneely@gmail.com> | 2018-11-18 19:30:50 -0500 |
---|---|---|
committer | Thedro Neely <thedroneely@gmail.com> | 2018-11-18 19:30:50 -0500 |
commit | b820ce28c79ef42bf8976b258f50486ae81931f8 (patch) | |
tree | 23c33591e33be71aa511ffc3e2112d5103f80e4f | |
parent | 1d224d3920190bdc4e7bc708cc91a67c064f4388 (diff) | |
download | thedroneely.com-b820ce28c79ef42bf8976b258f50486ae81931f8.tar.gz thedroneely.com-b820ce28c79ef42bf8976b258f50486ae81931f8.tar.bz2 thedroneely.com-b820ce28c79ef42bf8976b258f50486ae81931f8.zip |
app/views: General site design update and refresh
Let website be more minimal with white background
Add home page image
-rw-r--r-- | app/views/contact.view.php | 90 | ||||
-rw-r--r-- | app/views/index.view.php | 79 | ||||
-rw-r--r-- | app/views/partials/footer.php | 20 | ||||
-rw-r--r-- | app/views/partials/navigator.php | 22 | ||||
-rw-r--r-- | app/views/resume.view.php | 2 |
5 files changed, 81 insertions, 132 deletions
diff --git a/app/views/contact.view.php b/app/views/contact.view.php index 7b2d54c..bfc0da5 100644 --- a/app/views/contact.view.php +++ b/app/views/contact.view.php @@ -2,7 +2,7 @@ <body> - <section class="section hero" itemscope itemtype="http://schema.org/WebPage"> + <section class="section is-fullheight" itemscope itemtype="http://schema.org/WebPage"> <div class="hero-head"> @@ -11,75 +11,73 @@ </div> <div id="contact-vue"> - <div class="hero-body"> - <div class="container"> - <div class="columns is-centered"> - <div class="column is-8"> + <div class="container"> + <div class="columns is-centered"> + <div class="column is-8"> - <article class="content"> + <article class="content"> - <h1 class="title is-3">Contact</h1> + <h1 class="title is-3">Contact</h1> - <p> - Interested in collaborating together? - Complete the form below with basic info about your project or idea. - </p> + <p> + Interested in collaborating together? + Complete the form below with basic info about your project or idea. + </p> - <form method="post" action="/?sent"> + <form method="post" action="/?sent"> - <div class="field is-horizontal"> - <div class="field-body"> - <div class="field is-expanded"> - <label class="heading is-size-6">Name <span class="alert" v-show="!name">*</span></label> + <div class="field is-horizontal"> + <div class="field-body"> + <div class="field is-expanded"> + <label class="heading is-size-6">Name <span class="alert" v-show="!name">*</span></label> + <div class="field has-addons"> + <p class="control is-expanded"> + <input v-model="name" class="input" type="text" name="26471" placeholder="Jason Response"> + </p> + </div> + </div> + <div class="field is-expanded"> + <label class="heading is-size-6">Email <span class="alert" v-show="!email">*</span></label> <div class="field has-addons"> <p class="control is-expanded"> - <input v-model="name" class="input" type="text" name="26471" placeholder="Jason Response"> + <input v-model="email" class="input" type="email" name="26472" placeholder="user@domain.com"> </p> </div> - </div> - <div class="field is-expanded"> - <label class="heading is-size-6">Email <span class="alert" v-show="!email">*</span></label> - <div class="field has-addons"> - <p class="control is-expanded"> - <input v-model="email" class="input" type="email" name="26472" placeholder="user@domain.com"> - </p> - </div> - </div> </div> </div> + </div> - <label class="heading is-size-6">Message <span class="alert" v-show="!message">*</span></label> - <div class="field is-horizontal"> - <div class="field-body"> - <div class="field"> - <div class="control"> - <textarea v-model="message" class="textarea" name="26478" placeholder="How would you describe your project?"></textarea> - </div> - </div> - </div> - </div> - - <br> - + <label class="heading is-size-6">Message <span class="alert" v-show="!message">*</span></label> <div class="field is-horizontal"> <div class="field-body"> <div class="field"> <div class="control"> - <button class="button is-primary contact__button has-text-weight-normal"> - Send message - </button> + <textarea v-model="message" class="textarea" name="26478" placeholder="How would you describe your project?"></textarea> </div> </div> </div> </div> - <input type="checkbox" name="contact" class="form" tabindex="-1" autocomplete="off"> + <br> + + <div class="field is-horizontal"> + <div class="field-body"> + <div class="field"> + <div class="control"> + <button class="button is-primary contact__button has-text-weight-normal"> + Send message + </button> + </div> + </div> + </div> + </div> + + <input type="checkbox" name="contact" class="form" tabindex="-1" autocomplete="off"> - </form> + </form> - </article> + </article> - </div> </div> </div> </div> diff --git a/app/views/index.view.php b/app/views/index.view.php index f6e2f15..2068415 100644 --- a/app/views/index.view.php +++ b/app/views/index.view.php @@ -2,17 +2,17 @@ <body> - <section class="section hero" itemscope itemtype="http://schema.org/HomePage"> - <div class="hero-head"> +<?php require __DIR__ . '/partials/navigator.php'; ?> - <?php require __DIR__ . '/partials/navigator.php'; ?> + <section class="section hero" itemscope itemtype="http://schema.org/HomePage"> - </div> <div class="hero-body"> <div class="container"> <div class="columns is-centered"> <div class="column is-8"> + <br> + <h1 class="title has-text-weight-normal"> <span> Web @@ -23,25 +23,30 @@ </h1> <h2 class="subtitle has-text-grey-dark has-text-weight-normal"> - Thedro Neely + In it for the long haul </h2> + <img alt="Mountains" width="960" height="480" src="/images/mountains.jpg"> + <div class="content"> + <br> + <p class="has-text-left has-text-black line__height"> - My name is Thedro (tee-dro) — a web developer and self-taught - <a href="https://en.wikipedia.org/wiki/Linux">linux and unix-like</a> - system administrator. + My name is Thedro (<span class="has-text-grey">tee-dro</span>) — + a web developer and self-taught + <a href="https://en.wikipedia.org/wiki/Linux">linux and unix-like</a> system administrator. There are many different tools and programming languages I've come across. - Welcome to my small part of the web. Here you'll find things I've + Welcome to my corner of the web. Here you'll find things I've worked on as well as other interesting discoveries. </p> </div> <div class="columns"> + <div class="column"> - <h3 class="heading has-text-black is-marginless is-size-5"> + <h3 class="has-text-dark is-marginless is-size-5"> Recent Posts </h3> @@ -62,12 +67,12 @@ <br> - <li><a class="front__frame" href="post/">More posts<span class="icon">➤</span></a></li> + <li><a class="front__frame" href="post/">More posts <span class="icon">➤</span></a></li> </ul> </div> <div class="column"> - <h3 class="heading has-text-black is-marginless is-size-5"> + <h3 class="has-text-dark is-marginless is-size-5"> Recent Projects </h3> @@ -88,58 +93,16 @@ <br> - <li><a class="front__frame" href="project/">More projects<span class="icon">➤</span></a></li> + <li><a class="front__frame" href="project/">More projects <span class="icon">➤</span></a></li> </ul> </div> - </div> - - <!-- <div> - <img width="200" src="/images/valley.png"> - </div> --> - - </div> - - <!-- <div class="column is-4 has-text-left"> - - <div class="tabs is-boxed" style="margin-bottom: 0;"> - <ul> - <li class="is-active"> - <a> - <span class="is-size-7">Activity</span> - </a> - </li> - <li> - <a style="background-color: #fff; color: #999; border: 0;"> - <span class="is-size-7">Status</span> - </a> - </li> - </ul> </div> - - <div style="background-color: #f2f2f2; padding: 10px;border: 1px solid #dbdbdb; min-height: 350px;"> - - <div class="card"> - <header class="card-header"> - <p class="card-header-title is-size-7"> - Last Github Commit - </p> - <a href="#" class="card-header-icon" aria-label="more options"> - </a> - </header> - <div class="card-content" style="padding: 0.5rem;"> - <div class="content is-size-7"> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec iaculis mauris. - </div> - </div> - </div> - - </div> - - </div> --> - + </div> </div> </div> </div> +</section> +<section> <?php require __DIR__ . '/partials/footer.php'; ?> diff --git a/app/views/partials/footer.php b/app/views/partials/footer.php index 9aaa326..d8c4f7e 100644 --- a/app/views/partials/footer.php +++ b/app/views/partials/footer.php @@ -5,7 +5,7 @@ <div class="columns is-centered"> <div class="column is-8"> - <hr style="margin: 0 0 0.8rem 0;"> + <hr class="has-background-grey-lighter"> </div> </div> @@ -13,7 +13,7 @@ <div class="column is-2"> - <p class="has-text-grey-dark is-size-7"> + <p class="has-text-grey-dark has-text-centered-mobile is-size-7"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKsAAACrAQMAAAAjJv5aAAAABlBMVEUAAAD///+l2Z/dAAAAAnRSTlP//8i138cAAAAJcEhZcwAACxIAAAsSAdLdfvwAAALJSURBVEiJ5Ze9jeQwDIUpOFBmNyBAbShTS3YD/mnAbkmZ2xCgBuRMgWDe03r29oILjk7PGAzsbwYaUXx85BD/9aL/G2ei2cWe0hXs7e0VSMnxxXV2aQuRyIye1Akix8GM2iiOC9td83bS9AovZxy4y65jTsdbPBNvoRKlWzO/w4iSTO/jEuyqafkj+H/HOO/pND+vnzQIMK4rxNnVJaSD6/IjCAHOmoi67BElLcWQbp9I8VW6lWz21CPEUEcygxwDkGvxzZr3tnBc5Pg6u+tM2RsVqipxdJ+fFOGbDPkW2XF2mewW7PUG26yb9AaOqvDBNMjxVepQ7IateajPTOVZW4azQyXFWeMT7DHO9Mm8CHOISBSOXDEyj7pMmxxn3eR/+3Q7FBY2GJUc3xppT3w2Dc7ajC6xHPOJ4Kj3ZvZwLLNwVXKcPayu25pRwW/sxt0lxxDg7dKugVGX3RHiIMfZoRpoKpW0zS5BhoccXyeKsrubQ5hex5Y6Ob49EsW7r9NpueBbj1fJMDflptzswa5fIprk+GK0oDpqRIl3GumzbxG+Pa/EKwKF38CGy8chZLi11trrbsXaZNfvtUUYWVo1jAH5pxE12jqbGDO6q4PT4AkahKKfzMvwjcVgDB4l3lwTyZ/k+ILxO7t6FBZ+p07fhifCubURpK6dN9oRlKjkGI1doapw2B4+AR09nUSGc6ukSB6drd2v7tvwJBjnNBWUFLwBN9jdGwyzXDGwUIJ8hoJHs7zAPvbtvFtR7pCSr28w4QkNBK+0+3QVeoEzenuxXxOH/dqs3eQYVybYLeYvzHTwmKcxyjCmsNHXGfo921Sozt/DmQBjHoThrR7q644Co+qOFzg8gw+8ihRqlJ6kiTFG7NVh8G/esLtPg5HiiWvvoCDMUPYoZnqBEWVzF3gDqZKgAiXHbUZG5h2qE6ZV25gsx7K/WP8D/gXGiTnQ96NZQAAAAABJRU5ErkJggg==" height="100" width="100" alt="Contact Card"> </p> @@ -24,7 +24,7 @@ <div class="footer__section"> - <p class="has-text-grey-dark has-text-right has-text-left-mobile is-size-7"> + <p class="has-text-grey-dark has-text-right has-text-centered-mobile is-size-7"> Design inspired by <a href="https://github.com/solutionroute/hugo-smorg">Smorg</a> — Built with <a href="https://secure.php.net/">PHP</a> · @@ -39,7 +39,7 @@ <br> - <p class="has-text-grey has-text-right has-text-left-mobile is-size-7"> + <p class="has-text-grey has-text-right has-text-centered-mobile is-size-7"> Copyright © Thedro Neely <?php echo date("Y"); ?>. All rights reserved. </p> @@ -99,7 +99,7 @@ var activeMenu = document.getElementById('navMenu'); document.addEventListener('click', function(event) { var burgerClick= activeBurger.contains(event.target); if (!burgerClick && activeBurger.classList.contains('is-active')) { - activeBurger.className = "navbar-burger burger has-text-white"; + activeBurger.className = "navbar-burger burger has-text-dark"; activeMenu.className = "navbar__mobile navbar-menu"; } }); @@ -116,7 +116,7 @@ window.onscroll = function() { document.getElementById("navbar").style.top = "-4.2em"; } if (activeBurger.classList.contains('is-active')) { - activeBurger.className = "navbar-burger burger has-text-white"; + activeBurger.className = "navbar-burger burger has-text-dark"; activeMenu.className = "navbar__mobile navbar-menu"; } pastPosition = currentPosition; @@ -125,18 +125,12 @@ window.onscroll = function() { <?php if (trim($_SERVER['REQUEST_URI'], '/') == 'contact') { ?> -<!-- development version, includes helpful console warnings --> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> new Vue({ el: '#contact-vue', - data: { - name: '', - email: '', - message: '' - } - + data: { name: '', email: '', message: '' } }); </script> diff --git a/app/views/partials/navigator.php b/app/views/partials/navigator.php index f82dbd2..d544db0 100644 --- a/app/views/partials/navigator.php +++ b/app/views/partials/navigator.php @@ -4,10 +4,14 @@ <div class="navbar-brand"> <a href="/" class="has-text-white"> - <div class="navbar__mobile navbar__custom has-text-weight-semibold navbar-item">Home</div> + <div class="navbar__mobile navbar__custom navbar-item">Home</div> </a> - <div id="navBurger" class="navbar-burger burger has-text-white" data-target="navMenu"> + <a href="/project" class="has-text-white"> + <div class="navbar__mobile navbar__custom navbar-item">Projects</div> + </a> + + <div id="navBurger" class="navbar-burger burger has-text-dark" data-target="navMenu"> <span></span> <span></span> <span></span> @@ -22,21 +26,11 @@ <?php $navigation->generateNavBar(); ?> </div> - </div> + </div> <div class="navbar__desktop navbar-menu"> - <!-- <div class="navbar-start"> - - <div class="navbar-item"> - <div class="control"> - <input class="navbar__search input" type="text"> - </div> - </div> - - </div> --> - - <div class="columns is-centered heading is-size-7"> + <div class="columns is-centered"> <div class="navbar__left column is-3"> <?php $navigation->generatehomeButton(); ?> diff --git a/app/views/resume.view.php b/app/views/resume.view.php index 4f06d56..ccc8f24 100644 --- a/app/views/resume.view.php +++ b/app/views/resume.view.php @@ -211,7 +211,7 @@ <p class="heading">How long have you been programming?</p> <p class="is-size-7"> For approximately 3 years. I was recently taught PHP by - a fellow programmer however web app development is not a recent endeaver. + a fellow programmer however web app development is not a recent endeavor. I've made quite a few websites before this, but mostly in private. </p> </div> |