Compare commits

...

2 Commits

Author SHA1 Message Date
Roxie Gibson ed1621c1c8
customisable headshot 2021-08-25 17:29:31 +01:00
Roxie Gibson 2f5529396c
aboutme page mostly done, footer mostly done 2021-08-25 16:58:19 +01:00
34 changed files with 232 additions and 36 deletions

5
README.md Normal file
View File

@ -0,0 +1,5 @@
## How to change about me headshot
Add the headshot image you want to use to the `static/img` directory. Then uncomment the `headshot=` option under `[param.about]`. Set this option to the filename and only the filename.

View File

@ -1,6 +1,7 @@
baseURL = 'http://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
title = 'SITENAME'
theme = "sophie-lewis"
[params]
@ -8,9 +9,11 @@ navbar = ["about", "writing", "videos", "get-in-touch"]
[params.header]
name = "Sophie Lewis"
subtitle = "Writer & Philosopher"
[params.about]
#headshot =
# DON'T EDIT BELOW
[markup.goldmark.renderer]
hardWraps = false
unsafe = true
xhtml = true
xhtml = true

View File

@ -2,6 +2,6 @@
Octo: octo-2.webp
---
Well, the way they make shows is, they make one show. That show's called a pilot. Then they show that show to the people who make shows, and on the strength of that one show they decide if they're going to make more shows. Some pilots get picked and become television programs. Some don't, become nothing. She starred in one of the ones that became nothing.
***SOPHIE LEWIS*** is pellentesque luctus eros nec purus vestibulum, ut euismod dui suscipit. Quisque sollicitudin nisi nec dictum ultrices. Quisque et luctus orci. Nulla ante libero, rutrum ac euismod ut, sollicitudin non nisi. Etiam a erat nec metus facilisis sodales. Morbi porta varius purus, vel sodales odio consequat a. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris ut arcu at arcu euismod scelerisque. Quisque mollis at massa sit amet tempus. Phasellus nec lacus nec erat lobortis fringilla eget ut augue. Nam non est sed sem elementum varius.
You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man.
Suspendisse justo massa, molestie at turpis a, posuere gravida orci. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aliquam magna mi, commodo vitae ante pulvinar, suscipit mollis turpis. Duis a dui fringilla, sollicitudin nisl quis, efficitur lacus. Donec ultricies ligula nisl, id eleifend elit iaculis eget. Aenean auctor quam non lectus eleifend, ac eleifend ligula pulvinar. Aliquam sollicitudin luctus massa, quis facilisis justo fringilla id. Donec pulvinar fringilla nulla sit amet imperdiet.

View File

@ -1,6 +1,15 @@
---
title: "About"
date: 2021-08-23T05:58:05+01:00
draft: true
octo: octo-1.webp
---
Quisque sollicitudin nisi nec dictum ultrices. Quisque et luctus orci. Nulla ante libero, rutrum ac euismod ut, sollicitudin non nisi. Etiam a erat nec metus facilisis sodales. Morbi porta varius purus, vel sodales odio consequat a. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris ut arcu at arcu euismod scelerisque. Quisque mollis at massa sit amet tempus. Phasellus nec lacus nec erat lobortis fringilla eget ut augue. Nam non est sed sem elementum varius.
Suspendisse justo massa, molestie at turpis a, posuere gravida orci. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aliquam magna mi, commodo vitae ante pulvinar, suscipit mollis turpis. Duis a dui fringilla, sollicitudin nisl quis, efficitur lacus. Donec ultricies ligula nisl, id eleifend elit iaculis eget. Aenean auctor quam non lectus eleifend, ac eleifend ligula pulvinar. Aliquam sollicitudin luctus massa, quis facilisis justo fringilla id. Donec pulvinar fringilla nulla sit amet imperdiet.
---
{{< cv-entry dates="2012-2017" title="Quisque sollicitudin nisi nec dictum ultricesmet imperdiet." >}}
{{< cv-entry dates="2012-2017" title="Quisque sollicitudin nisi nec dictum ultricesmet imperdiet." >}}
{{< cv-entry dates="2012-2017" title="Quisque sollicitudin nisi nec dictum ultricesmet imperdiet." >}}

View File

@ -10,4 +10,6 @@ draft: false
*Published 14 May 2021*
Quisque sollicitudin nisi nec dictum ultrices. Quisque et luctus orci.
---

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,42 @@
@mixin define-font-family($name, $weight, $style, $filename) {
font-family: $name;
src:
url("../font/woff2/#{$filename}") format("woff2"),
url("../font/ttf/#{$filename}") format("ttf");
font-weight: $weight;
@if $style {
font-style: $style;
}
}
$sans_font: IBMPlexSans;
$serif_font: IBMPlexSerif;
@font-face {
@include define-font-family($sans_font, normal, italic, 'IBMPlexSans-Italic.woff2')
}
@font-face {
@include define-font-family($sans_font, normal, null, 'IBMPlexSans-Regular.woff2')
}
@font-face {
@include define-font-family($sans_font, 200, null, 'IBMPlexSans-Light.woff2')
}
@font-face {
@include define-font-family($sans_font, bold, italic, 'IBMPlexSans-BoldItalic.woff2')
}
@font-face {
@include define-font-family($sans_font, 700, null, 'IBMPlexSans-Medium.woff2')
}
@font-face {
@include define-font-family($sans_font, lighter, italic, 'IBMPlexSans-LightItalic.woff2')
}
@font-face {
@include define-font-family($serif_font, normal, italic, 'IBMPlexSerif-Italic.woff2')
}
@font-face {
@include define-font-family($serif_font, lighter, null, 'IBMPlexSerif-Light.woff2')
}
@font-face {
@include define-font-family($serif_font, lighter, italic, 'IBMPlexSerif-LightItalic.woff2')
}

View File

@ -2,9 +2,24 @@ $section-padding: 1rem 0rem;
$section-padding-desktop: $section-padding;
$section-padding-large: $section-padding;
$gray: #707070;
$gray: #adadad;
$text-colour: #1F1F1F;
@import "./bulma/bulma.sass";
@import "./font.scss";
body {
color: $text-colour;
}
$hr-width: 0.15rem;
$hr-color: $gray;
hr {
background-color: $hr-color;
height: $hr-width;
}
.nav-tabs.tabs {
li:first-of-type a {
@ -14,17 +29,21 @@ $gray: #707070;
justify-content: right !important;
}
a {
padding: 0.5rem;
padding: 0.5rem 0;
font-size: 1.3rem;
color: $text-colour;
border-bottom-color: $hr-color;
border-bottom-width: $hr-width;
:hover {
border-bottom-color: $hr-color;
}
}
padding: 0.8rem 0;
.is-active a {
text-decoration: underline;
font-weight: bold;
color: $tabs-link-color;
border-bottom-color: $tabs-border-bottom-color;
color: $text-colour;
border-bottom-color: $hr-color;
}
}
@ -37,15 +56,15 @@ $gray: #707070;
padding-top: 8em;
}
hr {
background-color: $gray;
height: 0.1rem;
}
#content {
font-size: 1.1rem;
p {
padding-bottom: 2rem;
strong,i,b,em {
font-family: $sans_font
}
em {
font-style: italic;
font-weight: lighter !important;
}
table {
table-layout: fixed;
@ -57,11 +76,36 @@ hr {
td {
padding: 0.5rem 0;
}
hr {
margin: 0.5rem 0;
}
iframe {
padding-bottom: 1rem;
}
}
#content.videos {
p:has(em) {
padding-bottom: 1rem;
}
}
#content.about hr ~ p {
padding-bottom: 0 !important;
}
.headshot {
img {
border-radius: 100%;
border-width: 0.15rem;
border-color: $gray;
border-style: solid;
}
}
#content:not(.videos) p {
padding-bottom: 2rem;
}
#content-column {
@media all and (max-width: 1216px) {
@ -72,4 +116,43 @@ hr {
}
}
.title {
font-family: $serif_font;
font-style: italic;
font-weight: 200;
}
.subtitle {
font-family: $sans_font;
font-weight: 200;
}
p {
font-family: $serif_font;
b {
font-weight: normal;
}
}
nav,footer {
font-family: $sans_font;
font-style: italic;
}
.cv-entry {
padding: 1rem 0;
font-family: $sans_font;
.job-title {
font-weight: 400;
}
.job-date {
font-weight: 200;
}
}
footer {
hr {
margin-top: 0;
margin-bottom: 0.8rem;
}
}

View File

@ -7,9 +7,7 @@
<div id="content-column" class="column is-5-widescreen is-8-desktop">
{{- partial "header.html" . -}}
{{- partial "nav.html" . -}}
<div id="content" class="section">
{{- block "main" . }}{{- end }}
</div>
{{- block "main" . }}{{- end }}
{{- partial "footer.html" . -}}
</div>
<div id="octopus" class="column is-4-widescreen is-4-desktop is-hidden-touch ">

View File

@ -1 +1,31 @@
{{ define "main" }}{{.Content}}{{ end }}
{{ define "main" }}
{{ $content_class := $.Page.Params.title | lower }}
{{ if eq (.Title | lower) "about" }}
<div class="columns">
<div class="column is-one-third">
<div class="headshot">
{{ $img := relURL "img/headshot_example.png"}}
{{ if isset $.Site.Params.about "headshot" }}
{{ if fileExists ( printf "static/img/%s" $.Site.Params.about.headshot ) }}
{{ $img := relURL ( printf "img/%s" $.Site.Params.about.headshot )}}
<img src='{{ $img }}'>
{{ else }}
<img src='{{ $img }}'>
{{ end }}
{{ else }}
<img src='{{ $img }}'>
{{ end }}
</div>
</div>
<div class="column">
<div id="content" class='section {{ $content_class }}'>
{{.Content}}
</div>
</div>
</div>
{{ else }}
<div id="content" class='section {{ $content_class }}'>
{{.Content}}
</div>
{{ end }}
{{ end }}

View File

@ -3,5 +3,4 @@
{{ end }}
{{ define "octo" }}
<h1 class="">nrsnts</h1>
{{ end }}

View File

@ -0,0 +1,12 @@
<footer>
<hr>
<div class="columns">
<div class="column">
<div>FIND ME AT</div>
<div></div>
</div>
<div class="column has-text-right">
PRIVACY POLICY
</div>
</div>
</footer>

View File

@ -0,0 +1,4 @@
<div class="cv-entry">
<div class="job-date">{{ .Get "dates" }}</div>
<div class="job-title">{{ .Get "title" }}</div>
</div>

View File

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 24.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 400 400" style="enable-background:new 0 0 400 400;" xml:space="preserve">
<style type="text/css">
.st0{fill:#1B9DF0;}
.st1{fill:#FFFFFF;}
</style>
<g id="Dark_Blue">
<circle class="st0" cx="200" cy="200" r="200"/>
</g>
<g id="Logo__x2014__FIXED">
<path class="st1" d="M163.4,305.5c88.7,0,137.2-73.5,137.2-137.2c0-2.1,0-4.2-0.1-6.2c9.4-6.8,17.6-15.3,24.1-25
c-8.6,3.8-17.9,6.4-27.7,7.6c10-6,17.6-15.4,21.2-26.7c-9.3,5.5-19.6,9.5-30.6,11.7c-8.8-9.4-21.3-15.2-35.2-15.2
c-26.6,0-48.2,21.6-48.2,48.2c0,3.8,0.4,7.5,1.3,11c-40.1-2-75.6-21.2-99.4-50.4c-4.1,7.1-6.5,15.4-6.5,24.2
c0,16.7,8.5,31.5,21.5,40.1c-7.9-0.2-15.3-2.4-21.8-6c0,0.2,0,0.4,0,0.6c0,23.4,16.6,42.8,38.7,47.3c-4,1.1-8.3,1.7-12.7,1.7
c-3.1,0-6.1-0.3-9.1-0.9c6.1,19.2,23.9,33.1,45,33.5c-16.5,12.9-37.3,20.6-59.9,20.6c-3.9,0-7.7-0.2-11.5-0.7
C110.8,297.5,136.2,305.5,163.4,305.5"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 MiB

View File

@ -2,20 +2,9 @@
# See https://github.com/gohugoio/hugoThemes#themetoml for an example
name = "Sophie Lewis"
license = "MIT"
licenselink = "https://github.com/yourname/yourtheme/blob/master/LICENSE"
description = ""
homepage = "http://example.com/"
tags = []
features = []
min_version = "0.41.0"
[author]
name = ""
homepage = ""
# If porting an existing theme
[original]
name = ""
homepage = ""
repo = ""