rayelliott
/
hugo-blog
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Compare commits

base: rayelliott:2e73a45c60da57d8e681ed741bc470c1cc2cb121
Branches Tags
rayelliott:dev
rayelliott:production
..
compare: rayelliott:5c79e0fdb1be5efe25502af6d0d66539912542e7
Branches Tags
rayelliott:dev
rayelliott:production

2 Commits
2e73a45c60 ... 5c79e0fdb1

Author SHA1 Message Date
Ray Elliott 5c79e0fdb1 update TODO 2020-02-24 19:45:31 +00:00
Ray Elliott 95717ddda7 convert about.md to html page 
updated layout ready for inserting a cover image.
removed now unneeded divwrap shortcode.
added baseurl shortcode.
 2020-02-24 19:45:08 +00:00
6 changed files with 169 additions and 83 deletions
Show Stats Expand all files Collapse all files

2
TODO.md
View File

@ -5,6 +5,8 @@
* about me - have all the bolded things be links to articles in my blog
e.g., for **SEO** just do some shit like benefits of seo and that
* temporary contact form until main site done
When enough content done:
* google analytics

73
assets/css/_about.scss
View File

@ -1,6 +1,63 @@
.page.about {
&.header-expanded .wrapper {
.navigation {
z-index: 10;
}
&::before {
content: "";
z-index: -1;
display: block;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: #707070;
}
header {
z-index: 5;
position: relative;
margin-top: 0;
margin-bottom: 9.6rem;
height: calc(100vh - 1.6em);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 1.3em;
@media (min-width: 768px) {
margin-bottom: 8.4rem;
}
}
.more-hint {
position: absolute;
right: 50%;
bottom: 0;
transform: translateX(50%);
font-size: 1em;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.more-scroll {
font-size: 2em;
}
.more-svg {
height: 3em;
width: 3em;
}
}
.content {
text-align: center;
font-size: 1.1em;
}
ul {
@ -8,25 +65,16 @@
list-style: none;
}
.column > p,
.column > ul,
article > p,
article > ul {
font-size: 1.1em;
}
.column > p,
article > p {
p {
margin: 3rem;
}
li {
li p {
margin: 2rem 0;
}
h2 {
font-size: 2.2rem;
line-height: 2.6rem;
font-size: 1.4em;
}
h3 {
@ -59,4 +107,3 @@
}
}
}

106
content/about.html Normal file
View File

@ -0,0 +1,106 @@
---
title: "About Me"
date: 2020-01-31T12:54:00Z
---
<div id="js-intro" class="intro">
<p>
I am a UK based, freelance, front-end <strong>Web Developer</strong>.
</p>
<p>
I work with small businesses to <strong>Build</strong> and <strong>Grow</strong> their online presence.
</p>
<div class="more-hint">
<svg class="more-svg" viewBox="0 0 24 24">
<path fill="currentColor" d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z" />
</svg>
</div>
</div>
<ul>
<li><p>I create <strong><a href="{{< baseurl >}}tags/bespoke">Bespoke Websites</a></strong> using the latest technologies.</p></li>
<li><p>I work with a number of <strong><a href="{{< baseurl >}}tags/cms">Content Management Systems</a></strong>, including <strong><a href="{{< baseurl >}}tags/wordpress">WordPress</a></strong>.</p></li>
<li><p>I develop custom <strong>Themes</strong> and <strong>Plugins</strong>.</p></li>
<li><p>I advise and develop <strong><a href="{{< baseurl >}}tags/ecommerce">eCommerce Solutions</a></strong> for your online business.</p></li>
<li><p>I customise <strong><a href="{{< baseurl >}}tags/woocommerce">WooCommerce</a></strong> to fit specific business needs.</p></li>
<li><p>I integrate <strong>Social Media</strong> accounts with websites.</p></li>
<li><p>I <strong>Manage</strong> websites, taking care of <strong>Backups</strong>, <strong>Updates</strong> and other essential tasks.</p></li>
<li><p>I turn old, tired websites into <strong><a href="{{< baseurl >}}posts/leopold">Fresh and Modern</a></strong> sites.</p></li>
</ul>
<h2>All Of My Work Is</h2>
<ul>
<li><p>Fully optimised for on-site <strong>SEO</strong>.</p></li>
<li><p>Built with <strong>Security</strong> in mind.</p></li>
<li><p><strong>Mobile Friendly</strong> and responsive.</p></li>
<li><p>Built for <strong>Performance</strong> and <strong>Speed</strong>.</p></li>
<li><p><strong>Accessible</strong> and standards compliant.</p></li>
<li><p>Built with <strong>Semantic</strong>, <strong>Clean</strong>, <strong>Maintainable</strong> code.</p></li>
</ul>
<h2>I Enjoy Working With</h2>
<div class="row">
<div class="column">
<h3>Core Web Technologies</h3>
<ul>
<li><p>HTML</p></li>
<li><p>CSS</p></li>
<li><p>JavaScript</p></li>
<li><p>PHP</p></li>
<li><p>SVG</p></li>
<li><p>WebGL</p></li>
</ul>
</div>
<div class="column">
<h3>Content Management Systems</h3>
<ul>
<li><p><a href="{{< baseurl >}}tags/october-cms/">OctoberCMS</a></p></li>
<li><p><a href="{{< baseurl >}}tags/wordpress">WordPress</a></p></li>
<li><p>Hugo</p></li>
<li><p>Gatsby</p></li>
</ul>
</div>
<div class="column">
<h3>Modern Frameworks and Libraries</h3>
<ul>
<li><p><a href="{{< baseurl >}}tags/vue">Vue.js</a></p></li>
<li><p>React.js</p></li>
<li><p>Anime.js</p></li>
<li><p>GSAP</p></li>
<li><p>Tailwind</p></li>
</ul>
</div>
</div>
<div class="column">
<h3>Legacy and Other Web Technologies</h3>
<ul>
<li><p>jQuery</p></li>
<li><p>Bootstrap</p></li>
</ul>
</div>
<script>
var introEl = document.getElementById('js-intro');
var headerEl = document.querySelector('section > article > header');
if (introEl && headerEl) {
var navEl = document.querySelector('main > nav');
if (navEl) {
var navHeight = navEl.offsetHeight;
navEl.style.marginBottom = -1 * navHeight + "px";
headerEl.style.paddingTop = navHeight / 2 + "px";
headerEl.style.paddingBottom = navHeight / 2 + "px";
headerEl.appendChild(introEl);
document.body.classList.add('header-expanded');
}
}
</script>

67
content/about.md
View File

@ -1,67 +0,0 @@
---
title: "About Me"
date: 2020-01-31T12:54:00Z
---
I am a UK based, freelance, front-end **Web Developer**.
* I work with small businesses to **Build** and **Grow** their online presence.
* I create **[Bespoke Websites](/tags/bespoke)** using the latest technologies.
* I work with a number of **[Content Management Systems](/tags/cms)**, including **[WordPress](/tags/wordpress)**.
* I develop custom **Themes** and **Plugins**.
* I advise and develop **[eCommerce Solutions](/tags/ecommerce)** for your online business.
* I customise **[WooCommerce](/tags/woocommerce)** to fit specific business needs.
* I integrate **Social Media** accounts with websites.
* I **Manage** websites, taking care of **Backups**, **Updates** and other essential tasks.
* I turn old, tired websites into **[Fresh and Modern](/posts/leopold)** sites.
## All Of My Work Is
* Fully optimised for on-site **SEO**.
* Built with **Security** in mind.
* **Mobile Friendly** and responsive.
* Built for **Performance** and **Speed**.
* **Accessible** and standards compliant.
* Built with **Semantic**, **Clean**, **Maintainable** code.
## I Enjoy Working With
{{% divwrap row %}}
{{% divwrap "column" %}}
### Core Web Technologies
* HTML
* CSS
* JavaScript
* PHP
* SVG
* WebGL
{{% /divwrap %}}
{{% divwrap "column" %}}
### Content Management Systems
* [OctoberCMS](/tags/october-cms/)
* [WordPress](/tags/wordpress)
* Hugo
* Gatsby
{{% /divwrap %}}
{{% divwrap "column" %}}
### Modern Frameworks and Libraries
* [Vue.js](/tags/vue)
* React.js
* Anime.js
* GSAP
* Tailwind
{{% /divwrap %}}
{{% /divwrap %}}
{{% divwrap "column" %}}
### Legacy and Other Web Technologies
* jQuery
* Bootstrap
{{% /divwrap %}}

1
layouts/shortcodes/baseurl.html Normal file
View File

@ -0,0 +1 @@
{{ .Page.Site.BaseURL }}

3
layouts/shortcodes/divwrap.html
View File

@ -1,3 +0,0 @@
<div class="{{ .Get 0 }}" >
{{ .Inner }}
</div>