Browse Source

various accessibility/performance fixes

main
James Fenn 1 week ago
parent
commit
b18dac2e53
3 changed files with 55 additions and 6 deletions
  1. +2
    -2
      _includes/head.liquid
  2. +51
    -2
      assets/css/styles.scss
  3. +2
    -2
      pages/index.html

+ 2
- 2
_includes/head.liquid View File

@@ -23,7 +23,7 @@

<meta name="description" content="{{ head_description }}">
<meta name="author" content="{{ meta.author }}">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
<title>{{ head_title }}</title>

<meta name="theme-color" content="#FFFFFF">
@@ -49,7 +49,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="white">
<meta name="apple-mobile-web-app-title" content="{{ meta.name }}">

<link href="//fonts.googleapis.com/css?family=Crete+Round|Roboto|Montserrat" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Crete+Round|Roboto|Montserrat&display=swap" rel="stylesheet">
<link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="/css/styles.css" rel="stylesheet">



+ 51
- 2
assets/css/styles.scss View File

@@ -1,5 +1,54 @@
$font-heading: 'Montserrat', sans-serif !default;
$font-body: 'Crete Round', sans-serif !default;
$font-heading: 'Montserrat', sans-serif;
$font-body: 'Crete Round', sans-serif;

$theme-light: (
"lighter": #FFFFFF,
"light": #FAFAFA,
"neutral": #F0F0F0,
"dark": #E0E0E0,
"darker": #BDBDBD,
"primary": #264361,
"on-primary": #FFFFFF,
"secondary": #0e2033,
"on-secondary": #FFFFFF,
"tertiary": #000000,
"on-tertiary": #FFFFFF,
"accent": #0063cc,
"on-accent": #FFFFFF,
"highlight": #004fa3,
"on-highlight": #FFFFFF,
"success": #28a745,
"danger": #dc3545,
"warning": #ffc107,
"info": #17a2b8,
"white": #FFFFFF,
"black": #000000
);

$theme-dark: (
"lighter": #424242,
"light": #303030,
"neutral": #212121,
"dark": #151515,
"darker": #101010,
"primary": #cefff6,
"on-primary": #000000,
"secondary": rgb(147, 255, 236),
"on-secondary": #000000,
"tertiary": #FFFFFF,
"on-tertiary": #000000,
"accent": #00EAC0,
"on-accent": #000000,
"highlight": #00EAC0,
"on-highlight": #000000,
"success": #28a745,
"danger": #dc3545,
"warning": #ffc107,
"info": #17a2b8,
"white": #FFFFFF,
"black": #000000

);

@import "../../node_modules/@doubledotlabs/dot.css/scss/styles.scss";



+ 2
- 2
pages/index.html View File

@@ -23,14 +23,14 @@ permalink: /
{% assign links = "twitter fediverse github linkedin" | split: " " %}
{% for link in links %}
<a rel="me" class="link" href="{{ meta.links[link] }}">
<img class="link-img" src="/images/ic/{{ link }}.svg">
<img class="link-img" src="/images/ic/{{ link }}.svg" width="24" height="24" alt="{{ link }}">
</a>
{% endfor %}
</div>
</div>

<div class="d-none d-md-flex col-auto pr-5 align-items-center">
<img style="height: 200px;" class="border border-tertiary rounded-circle" src="/images/me.jpg" alt="My profile picture.">
<img style="height: 200px;" class="border border-tertiary rounded-circle" src="/images/me.jpg" width="200" height="200" alt="My profile picture.">
</div>
</div>



Loading…
Cancel
Save