mikewink/mw-site
Watch
1
0
Fork
You've already forked mw-site
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update site with dark mode

Browse source
This commit is contained in:
Mike Wink 2022-11-18 11:48:23 +01:00
commit 8a0c36dfdd
3 changed files with 36 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

27
public/build/styles.css
View file

File diff suppressed because one or more lines are too long

24
public/index.php
View file

@ -15,11 +15,11 @@
href="/build/styles.css">
</head>
<body class="pattern bg-lightCyan md:h-screen">
<body class="pattern bg-lightCyan dark:bg-black dark:text-white md:h-screen">
<div class="md:grid md:grid-cols-layout md:h-full">
<div class="p-8 md:order-2 md:col-start-2 md:col-end-3 bg-white shadow-md">
<article class="mb-10 prose font-din">
<h1 class="uppercase">Mike Wink</h1>
<div class="p-8 md:order-2 md:col-start-2 md:col-end-3 bg-white dark:bg-black shadow-md">
<article class="mb-10 prose dark:text-white font-din">
<h1 class="uppercase text-paleCerulean">Mike Wink</h1>
<p class="prose-2xl">Specializing in Craft CMS, Kirby CMS, Laravel, Statamic, Symfony, Livewire,
Alpine.js, HTMX and more.
</p>
@ -29,7 +29,7 @@
<p>
My current side project is to learn and productively use <a href="https://obsidian.md/" target="_blank" rel="nofollow noopen">Obsidian</a> as my second brain.
</p>
<p class="prose-bdazzledBlue">Working on several client projects, but there will be a full website
<p>Working on several client projects, but there will be a full website
soonish. You can reach me via email at
<a href="mailto:me@mikewink.de">me@mikewink.de</a>
if you want to.
@ -37,13 +37,13 @@
<p>Mike</p>
</article>
<ul class="flex flex-row space-x-4 align-center">
<ul class="flex flex-row space-x-4 align-center" aria-label="A list of my three social media account">
<li>
<a href="https://github.com/mikewink"
title="GitHub profile Mike Wink"
target="_blank">
<svg role="img"
class="w-6 h-6 opacity-50 fill-current text-burntSienna"
<svg aria-hidden="true"
class="w-6 h-6 fill-current text-burntSienna"
viewBox="0 0 24 24"
width="24px"
height="24px"
@ -57,8 +57,8 @@
<a href="https://twitter.com/mikewink"
title="Twitter profile Mike Wink"
target="_blank">
<svg role="img"
class="w-6 h-6 opacity-50 fill-current text-burntSienna"
<svg aria-hidden="true"
class="w-6 h-6 fill-current text-burntSienna"
viewBox="0 0 24 24"
width="24px"
height="24px"
@ -73,8 +73,8 @@
title="Mastodon profile Mike Wink"
target="_blank"
rel="me">
<svg role="img"
class="w-6 h-6 opacity-50 fill-current text-burntSienna"
<svg aria-hidden="true"
class="w-6 h-6 fill-current text-burntSienna"
viewBox="0 0 24 24"
width="24px"
height="24px"

8
tailwind.config.js
View file

@ -3,7 +3,7 @@ module.exports = {
purge: [
'./public/**/*.php',
],
darkMode: false, // or 'media' or 'class'
darkMode: 'media', // or 'media' or 'class'
theme: {
extend: {
gridTemplateColumns: {
@ -15,14 +15,13 @@ module.exports = {
typography: (theme) => ({
DEFAULT: {
css: {
color: theme('colors.gunMetal'),
h1: {
color: theme('colors.bdazzledBlue'),
},
a: {
color: theme('colors.burntSienna'),
color: theme('colors.darkPastelRed'),
'&:hover': {
color: theme('colors.burntSienna'),
color: theme('colors.darkPastelRed'),
},
},
},
@ -35,6 +34,7 @@ module.exports = {
paleCerulean: '#98c1d9',
lightCyan: '#e0fbfc',
burntSienna: '#ee6c4d',
darkPastelRed: '#c93d19',
gunMetal: '#293241',
},
},