Compare commits

...

9 Commits

9 changed files with 160 additions and 41 deletions

View File

@ -8,11 +8,14 @@
list-style: none;
}
.column > p,
.column > ul,
article > p,
article > ul {
font-size: 1.1em;
}
.column > p,
article > p {
margin: 3rem;
}
@ -25,5 +28,35 @@
font-size: 2.2rem;
line-height: 2.6rem;
}
h3 {
font-size: 1.1em;
}
// TODO - use grid for this (maybe keep this for fallback?)
.row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.column {
flex: 0 0 50%;
@media (min-width: 768px) {
flex: 0 0 33%;
}
h3 {
margin-left: 1.5em;
margin-right: 1.5em;
margin-top: 0;
}
li {
margin: 1rem 0;
}
}
}

View File

@ -7,6 +7,9 @@ theme = "hugo-coder"
publishDir = "blog"
[markup.goldmark.renderer]
unsafe= true
[taxonomies]
category = "categories"
series = "series"
@ -28,16 +31,16 @@ hidecredits = true
colorscheme = "auto"
custom_scss = ["/css/main.scss"]
[[params.social]]
name = "LinkedIn"
icon = "fab fa-linkedin fa-2x"
weight = 10
url = "https://www.linkedin.com/in/rayelliottdev"
[[params.social]]
name = "Gitea"
icon = "fab fa-git-alt fa-2x"
weight = 20
svg = "gitea.svg"
weight = 10
url = "https://git.rayelliott.dev"
[[params.social]]
name = "LinkedIn"
weight = 20
svg = "linkedin.svg"
url = "https://www.linkedin.com/in/rayelliottdev"
[[menu.main]]

View File

@ -4,39 +4,72 @@ date: 2020-01-31T12:54:00Z
draft: true
---
I am an experienced, UK based front-end web developer and designer.
I am a UK based, freelance, front-end **Web Developer**.
I specialise in helping businesses build an online presence, guiding my clients through every step of the process in an efficient and straight forward manner.
## What Do I Do?
I am experienced in all aspects of web development:
I work with small businesses to build and strengthen their online presence.
* Web design and development.
* Fully bespoke custom websites, using the latest technologies.
* Custom and bespoke WordPress theme development.
* Custom WordPress plugin development (Gutenberg and classical).
* WordPress eCommerce integration and development.
* WooCommerce integration and plugin development.
* WordPress Management.
* Social media integration.
* Core web technologies such as HTML, CSS, JavaScript, PHP, SVG, WebGL.
* Modern and legacy web development frameworks and libraries
* React.js,
* Vue.js,
* Anime.js, GSAP,
* jQuery,
* Bootstrap,
* Tailwind.
* Content Management Systems
* WordPress,
* Gatsby,
* Hugo,
* OctoberCMS.
## What Can I Do For You
All of my work is:
... what do i give the customer that sets me above others ...
... what problems of the customer do I solve ...
* Fully optimised for on-site SEO.
* Accessible and standards compliant.
* Mobile friendly and responsive.
* Built for performance and speed.
* Built with semantic, clean, maintainable code.
* 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**.
* **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 %}}

View File

@ -3,7 +3,7 @@ title: "Flow Model Management"
date: 2020-02-08T12:27:18Z
description: "Developing a portfolio website using Nuxt.js."
categories: ["Portfolio"]
tags: ["Vue", "Nuxt", "CMS"]
tags: ["Vue", "Nuxt", "CMS", "Bespoke"]
featured_image: "/images/flowmm/flowmm-home.jpg"
series: ["Portfolio"]
draft: false

View File

@ -3,7 +3,7 @@ draft = false
date = 2019-12-29T18:55:07Z
title = "Giana Boutique"
description = "Developing an ecommerce website using WordPress and WooCommerce."
tags = ["WordPress", "WooCommerce", "CMS"]
tags = ["WordPress", "WooCommerce", "CMS", "eCommerce"]
categories = ["Portfolio"]
featured_image = "/images/giana/large-1.jpg"
externalLink = ""

View File

@ -3,7 +3,7 @@ draft = false
date = 2020-02-01T18:54:46Z
title = "Marc Leopold Photography"
description = "Developing a portfolio website using October CMS and Vue.js."
tags = ["October CMS", "Vue", "CMS"]
tags = ["October CMS", "Vue", "CMS", "Bespoke"]
categories = ["Portfolio"]
featured_image = "/images/leopold/large-1.jpg"
series = ["Portfolio"]
@ -12,7 +12,7 @@ series = ["Portfolio"]
**Marc Leopold** is an apocryphal photographer and visual artist based in Chicago, USA.
He recently decided his previous (and rather imaginary) website, whose purpose was to showcase his work, was beginning to look dated.
He decided that it was time for a modern, up to date portfolio site.
He decided that it was time for a modern, up to date [portfolio site](https://leopold.rayelliott.dev).
Being a photographer's portfolio site, the requirements are fairly basic.
Aside from the portfolio items, we just need some brief background information and an outline of the services provided along with a contact form.

View File

@ -0,0 +1,18 @@
<svg viewBox="0 30 135 90">
<g transform="translate(0 -154)">
<path d="m27.71 195.15c-9.5466-0.0272-22.339 6.798-21.632 23.904 1.1055 26.729 25.457 29.208 35.192 29.423 1.068 5.0136 12.522 22.306 21.002 23.217h37.153c22.278-1.6678 38.961-75.757 26.593-76.038-46.782 2.4769-49.995 2.1384-88.6 0-2.4951-0.0266-5.9723-0.49474-9.7079-0.5054zm2.4913 9.4589c1.3514 13.693 3.5558 21.704 8.0182 33.943-11.383-1.5047-21.07-5.2244-22.852-19.11-0.95096-7.4112 2.3904-15.168 14.833-14.834z" fill="#609926" stroke="#428f29"/>
</g>
<g fill="#fff">
<rect transform="rotate(25.915)" x="87.509" y="18.292" width="34.762" height="34.762" ry="5.4826"/>
<path d="m79.805 57.359 3.2411 1.61v-23.713h-3.2627z"/>
</g>
<g>
<g>
<circle transform="rotate(-19.796)" cx="49.065" cy="90.078" r="3.4745" fill="#609926"/>
<circle transform="rotate(-19.796)" cx="36.81" cy="102.1" r="3.4745" fill="#609926"/>
<circle transform="rotate(-19.796)" cx="46.484" cy="111.44" r="3.4745" fill="#609926"/>
<rect transform="rotate(26.024)" x="97.333" y="18.062" width="2.6727" height="27.261" fill="#609926"/>
<path d="m76.558 68.116c12.976 6.3954 13.013 4.1019 4.8909 20.907" fill="none" stroke="#609926" stroke-width="2.68"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,29 @@
<!-- https://commons.wikimedia.org/wiki/File:LinkedIn_Logo.svg -->
<svg viewbox="0 0 291 80" >
<g transform="translate(-200.55198,-393.96227)">
<g
transform="matrix(1.018827,0,0,-1.018827,170.5996,498.03288)"
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none" >
<path
d="m 239.3298,95.036 c 0,2.96 2.4604,5.361 5.4956,5.361 l 63.376,0 c 3.0351,0 5.4956,-2.401 5.4956,-5.361 l 0,-64.117 c 0,-2.961 -2.4605,-5.361 -5.4956,-5.361 l -63.376,0 c -3.0352,0 -5.4956,2.4 -5.4956,5.361 l 0,64.117 z"
style="fill:#006699;fill-opacity:1;fill-rule:nonzero;stroke:none" />
<g style="fill:currentColor;fill-opacity:1;fill-rule:evenodd;stroke:none">
<path d="m 31.1516,37.709 31.0356,0 0,10.189 -19.8042,0 0,38.874 -11.2314,0 0,-49.063 z" />
<path
d="m 77.9001,37.709 0,33.793 -11.2324,0 0,-33.793 11.2324,0 z m -5.6162,38.407 c 3.917,0 6.355,2.595 6.355,5.84 -0.073,3.315 -2.438,5.837 -6.2803,5.837 -3.8428,0 -6.355,-2.522 -6.355,-5.837 0,-3.245 2.4375,-5.84 6.207,-5.84 l 0.073,0 z" />
<path
d="m 83.1154,37.709 11.2325,0 0,18.872 c 0,1.01 0.073,2.019 0.3701,2.741 0.8115,2.017 2.6596,4.107 5.7627,4.107 4.0649,0 5.6909,-3.1 5.6909,-7.64 l 0,-18.08 11.2314,0 0,19.377 c 0,10.38 -5.542,15.21 -12.9321,15.21 -6.0591,0 -8.7197,-3.387 -10.1978,-5.694 l 0.075,0 0,4.9 -11.2325,0 c 0.1475,-3.171 0,-33.793 0,-33.793 z" />
<path
d="m 133.2487,86.772 -11.2329,0 0,-49.063 11.2329,0 0,10.956 2.8072,3.534 8.7939,-14.49 13.8179,0 -14.7783,20.977 12.9316,14.272 -13.5225,0 c 0,0 -9.2368,-12.769 -10.0498,-14.283 l 0,28.097 z" />
<path
d="m 188.7062,51.805 c 0.1475,0.868 0.3697,2.533 0.3697,4.415 0,8.736 -4.4346,17.604 -16.1094,17.604 -12.4888,0 -18.2524,-9.877 -18.2524,-18.835 0,-11.08 7.02,-18 19.2866,-18 4.8774,0 9.3843,0.72 13.0796,2.234 l -1.4785,7.418 c -3.0293,-1.005 -6.1329,-1.507 -9.9751,-1.507 -5.2466,0 -9.8277,2.153 -10.1978,6.743 l 23.2773,-0.07 z m -23.3505,7.599 c 0.2954,2.884 2.2168,7.138 7.02,7.138 5.0976,0 6.2807,-4.543 6.2807,-7.138 l -13.3007,0 z" />
<path
d="m 216.801,86.772 0,-16.984 -0.1475,0 c -1.626,2.377 -5.0259,3.963 -9.5322,3.963 -8.6465,0 -16.2573,-6.92 -16.1841,-18.741 0,-10.958 6.8726,-18.094 15.4443,-18.094 4.6553,0 9.0889,2.019 11.3057,5.912 l 0.2222,0 0.4433,-5.119 9.9766,0 c -0.148,2.379 -0.2969,6.488 -0.2969,10.524 l 0,38.539 -11.2314,0 z m 0,-33.421 c 0,-0.864 -0.074,-1.73 -0.2222,-2.45 -0.6641,-3.1 -3.3252,-5.262 -6.5757,-5.262 -4.6557,0 -7.6855,3.748 -7.6855,9.659 0,5.55 2.5869,10.019 7.7588,10.019 3.4726,0 5.9116,-2.378 6.5771,-5.333 0.1475,-0.65 0.1475,-1.371 0.1475,-2.019 l 0,-4.614 z" />
</g>
<path
d="m 261.8728,37.749 0,33.794 -11.2325,0 0,-33.794 11.2325,0 z m -5.6163,38.408 c 3.917,0 6.355,2.595 6.355,5.838 -0.073,3.316 -2.438,5.839 -6.2807,5.839 -3.8423,0 -6.3545,-2.523 -6.3545,-5.839 0,-3.243 2.4375,-5.838 6.207,-5.838 l 0.073,0 z" />
<path
d="m 268.0881,37.749 11.2324,0 0,18.872 c 0,1.01 0.073,2.019 0.3696,2.741 0.812,2.018 2.6602,4.108 5.7632,4.108 4.0645,0 5.6904,-3.099 5.6904,-7.642 l 0,-18.079 11.2315,0 0,19.377 c 0,10.38 -5.5415,15.21 -12.9316,15.21 -6.0596,0 -8.7198,-3.387 -10.1978,-5.694 l 0.075,0 0,4.901 -11.2324,0 c 0.1474,-3.171 0,-33.794 0,-33.794 z" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

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