lytedev
/
site.lyte.dev
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Lots of cleanup

master
Daniel Flanagan 1 month ago
parent
aa9006bf69
commit
e858b4f59b
Signed by: lytedev GPG Key ID: 5B2020A0F9921EF4
24 changed files with 353 additions and 370 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +3
    -3
      .gitignore
  2. +0
    -1
      config.yaml
  3. +22
    -22
      content/blog/ecto-reflection-for-simple-admin-crud-forms.md
  4. +1
    -1
      content/blog/weechat-matrix-encryption-guide.md
  5. +18
    -26
      layouts/_default/baseof.html
  6. +0
    -0
      layouts/_default/list.html
  7. +17
    -0
      layouts/_default/logo.svg.html
  8. +0
    -0
      layouts/_default/single.html
  9. +59
    -57
      layouts/index.html
  10. +8
    -6
      makefile
  11. +54
    -0
      src/stylus/font.styl
  12. +17
    -14
      src/stylus/styles.styl
  13. +63
    -0
      src/stylus/syntax-highlighting.styl
  14. +88
    -0
      src/stylus/theme.styl
  15. +0
    -0
      static/.gitignore
  16. +0
    -0
      static/font/iosevka/LICENSE.md
  17. +0
    -0
      static/font/iosevka/ss07-bold-italic.woff2
  18. +0
    -0
      static/font/iosevka/ss07-bold.woff2
  19. +0
    -0
      static/font/iosevka/ss07-italic.woff2
  20. +0
    -0
      static/font/iosevka/ss07-regular.woff2
  21. +3
    -3
      static/global.js
  22. +0
    -83
      themes/lyte/font.styl
  23. +0
    -67
      themes/lyte/syntax-highlighting.styl
  24. +0
    -87
      themes/lyte/theme.styl

+ 3
- 3
.gitignore View File

@ -1,5 +1,5 @@
resources/
public/
/resources
/public
# Local Netlify folder
.netlify
/.netlify

+ 0
- 1
config.yaml View File

@ -1,7 +1,6 @@
baseURL: https://lyte.dev
languageCode: en-us
title: lyte.dev
theme: lyte
pygmentsCodeFences: true
pygmentsCodeFencesGuessSyntax: true
pygmentsUseClasses: true


+ 22
- 22
content/blog/ecto-reflection-for-simple-admin-crud-forms.md View File

@ -59,21 +59,21 @@ iex(4)> MyApp.Accounts.User.__schema__ :type, :email
:string
iex(5)> MyApp.Accounts.User.__schema__ :association, :roles
%Ecto.Association.ManyToMany{
cardinality: :many,
defaults: [],
field: :roles,
join_keys: [user_id: :id, role_id: :id],
join_through: MyApp.Accounts.UserRole,
on_cast: nil,
on_delete: :nothing,
on_replace: :raise,
owner: MyApp.Accounts.User,
owner_key: :id,
queryable: MyApp.Accounts.Role,
related: MyApp.Accounts.Role,
relationship: :child,
unique: false,
where: []
cardinality: :many,
defaults: [],
field: :roles,
join_keys: [user_id: :id, role_id: :id],
join_through: MyApp.Accounts.UserRole,
on_cast: nil,
on_delete: :nothing,
on_replace: :raise,
owner: MyApp.Accounts.User,
owner_key: :id,
queryable: MyApp.Accounts.Role,
related: MyApp.Accounts.Role,
relationship: :child,
unique: false,
where: []
}
iex(6)> "siiiiiiiiiick"
...
@ -181,7 +181,7 @@ h1
= form_for @changeset, action_path, [as: :data], fn f ->
h2 Fields
= for field <- @schema_module.__schema__(:fields) do
= for field <- @schema_module.__schema__(:fields) do
.field
label
.label-text #{String.capitalize(to_string(field))}
@ -265,14 +265,14 @@ practice on my end.
# accounts/user.ex
defimpl MyApp.AdminEditable, for: MyApp.Accounts.User do
@readable [:id, :email, :full_name, :inserted_at, :updated_at]
@editable [:verified]
@readable [:id, :email, :full_name, :inserted_at, :updated_at]
@editable [:verified]
def admin_readable_fields(_s), do: @readable ++ @editable
def admin_editable_fields(_s), do: @editable
def admin_readable_fields(_s), do: @readable ++ @editable
def admin_editable_fields(_s), do: @editable
# this controls what shows up on the index for a given schema
def admin_index_fields(s), do: admin_readable_fields(s)
def admin_index_fields(s), do: admin_readable_fields(s)
end
```
@ -391,7 +391,7 @@ end
= form_for @changeset, Routes.admin_path(@conn, :update, @schema, @id), [as: :data], fn f ->
h2 Fields
= for field <- @schema_module.__schema__(:fields) do
= for field <- @schema_module.__schema__(:fields) do
.field
label
.label-text #{String.capitalize(to_string(field))}


+ 1
- 1
content/blog/weechat-matrix-encryption-guide.md View File

@ -115,7 +115,7 @@ Done!
The rest is up to you! You'll need to [configure your Matrix servers within
WeeChat][weechat-matrix-config] and then verify keys. Verifying keys isn't
a particularly clean process at the moment, but I expect it shall improve. For
a particularly clean process at the moment, but I expect it shall improve. For
now, I followed this basic process in WeeChat:
+ Open a split at your status window so you can see it and the encrypted channel


themes/lyte/layouts/_default/baseof.html → layouts/_default/baseof.html View File

@ -3,20 +3,17 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
{{ block "head-begin" . }}{{ end }}
<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
<link rel="shortcut icon" href="/icon.png" />
<link rel="stylesheet" href="/styles.css" />
<script defer src="/global.js"></script>
<script defer src="//a.lyte.dev/matomo.js"></script>
<script defer src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBzVPnkLHw"></script>
{{ block "head-end" . }}{{ end }}
</head>
<body>
{{ block "body-begin" . }}{{ end }}
<header>
<a href="#start-of-content" class="hidden-in-browsers js-disabled-only">Skip to Content</a>
<section>
<section>
<a href="/" id="logo">
<svg version="1.1" viewBox="0 0 70 60" width="48" height="48" alt="lyte.dev LED icon">
<linearGradient id="logo-gradient" x1="0" x2="0" y1="0" y2="1">
@ -35,11 +32,11 @@
<use href="#logo-path" style="filter: url(#logo-shadow);" id="icon-shadow"></use>
<use href="#logo-path" stroke="url(#logo-gradient)"></use>
</svg>
</a>
<a href="/">
<h1>lyte.dev</h1>
</a>
</section>
</a>
<a href="/">
<h1>lyte.dev</h1>
</a>
</section>
<section>
{{ $currentPage := . }}
{{ range .Site.Menus.main }}
@ -50,23 +47,18 @@
<a href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</section>
<section style="position:absolute;height:100%;right:0">
<button class="no-bg theme-toggler js-only centerize">
<svg class="hide-in-light-theme" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path style="fill:var(--fg)" d="M20 8.69V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69zm-2 5.79V18h-3.52L12 20.48 9.52 18H6v-3.52L3.52 12 6 9.52V6h3.52L12 3.52 14.48 6H18v3.52L20.48 12 18 14.48zM12 6c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm0 10c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z"/></svg>
<svg class="hide-in-dark-theme" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path style="stroke:var(--fg)" d="M10 4c4.41 0 8 3.59 8 8s-3.59 8-8 8c-.34 0-.68-.02-1.01-.07C10.9 17.77 12 14.95 12 12s-1.1-5.77-3.01-7.93C9.32 4.02 9.66 4 10 4m0-2c-1.82 0-3.53.5-5 1.35C7.99 5.08 10 8.3 10 12s-2.01 6.92-5 8.65C6.47 21.5 8.18 22 10 22c5.52 0 10-4.48 10-10S15.52 2 10 2z"/></svg>
</button>
<button class="no-bg align-toggler js-only hidden-on-mobile centerize">
<svg class="hide-in-align-left" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><rect fill="none" height="24" width="24"/><path style="fill:var(--fg)" d="M4,22H2V2h2V22z M22,7H6v3h16V7z M16,14H6v3h10V14z"/></svg>
<svg class="hide-in-align-center" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path style="fill:var(--fg)" d="M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z"/></svg>
</button>
</section>
<section style="position:absolute;height:100%;right:0">
<button class="no-bg theme-toggler js-only centerize">
<svg class="hide-in-light-theme" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path style="fill:var(--fg)" d="M20 8.69V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69zm-2 5.79V18h-3.52L12 20.48 9.52 18H6v-3.52L3.52 12 6 9.52V6h3.52L12 3.52 14.48 6H18v3.52L20.48 12 18 14.48zM12 6c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm0 10c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z"/></svg>
<svg class="hide-in-dark-theme" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path style="stroke:var(--fg)" d="M10 4c4.41 0 8 3.59 8 8s-3.59 8-8 8c-.34 0-.68-.02-1.01-.07C10.9 17.77 12 14.95 12 12s-1.1-5.77-3.01-7.93C9.32 4.02 9.66 4 10 4m0-2c-1.82 0-3.53.5-5 1.35C7.99 5.08 10 8.3 10 12s-2.01 6.92-5 8.65C6.47 21.5 8.18 22 10 22c5.52 0 10-4.48 10-10S15.52 2 10 2z"/></svg>
</button>
<button class="no-bg align-toggler js-only hidden-on-mobile centerize">
<svg class="hide-in-align-left" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><rect fill="none" height="24" width="24"/><path style="fill:var(--fg)" d="M4,22H2V2h2V22z M22,7H6v3h16V7z M16,14H6v3h10V14z"/></svg>
<svg class="hide-in-align-center" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path style="fill:var(--fg)" d="M7 15v2h10v-2H7zm-4 6h18v-2H3v2zm0-8h18v-2H3v2zm4-6v2h10V7H7zM3 3v2h18V3H3z"/></svg>
</button>
</section>
</header>
<main>
{{ block "main" . }}{{ .Content }}{{ end }}
</main>
{{ block "body-end" . }}
<footer style="padding-bottom: 5em">
</footer>
{{ end }}
<main>{{ block "main" . }}{{ .Content }}{{ end }}</main>
<footer style="padding-bottom: 5em"></footer>
</body>
</html>

themes/lyte/layouts/_default/list.html → layouts/_default/list.html View File


+ 17
- 0
layouts/_default/logo.svg.html View File

@ -0,0 +1,17 @@
<svg version="1.1" viewBox="0 0 70 60" width="48" height="48" alt="lyte.dev LED icon">
<linearGradient id="logo-gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="50%" style="stop-color:var(--pc)"></stop>
<stop offset="100%" style="stop-color:var(--pcd)"></stop>
</linearGradient>
<filter id="logo-shadow">
<feGaussianBlur stdDeviation="1"></feGaussianBlur>
<feOffset dx="0" dy="1.5" result="offsetblur"></feOffset>
<feMerge>
<feMergeNode></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
</filter>
<path id="logo-path" stroke-width="3.5" fill-opacity="0" stroke-linecap="round" stroke-linejoin="round" d="M 19.5 44.6 h 30 v -12.3 a 15.0 14.057142857142859 0 0 0 -30 0 v 12.3 M 19.5 44.6 m 8 0 v 7 m 14 -7 v 7 M 19.5 44.6 m -9 -13.3 h -5 M 19.5 44.6 m -2.6999999999999997 -28.3 l -3.55 -3.55 M 19.5 44.6 m 15.0 -35.6 v -5 M 19.5 44.6 m 32.7 -28.3 l 3.55 -3.55 M 19.5 44.6 m 39 -13.3 h 5 M 19.5 44.6 m 8.0 -12.3 a 7.5 6.15 0 0 1 7.0 -6.5"></path>
<use href="#logo-path" style="filter: url(#logo-shadow);" id="icon-shadow"></use>
<use href="#logo-path" stroke="url(#logo-gradient)"></use>
</svg>

themes/lyte/layouts/_default/single.html → layouts/_default/single.html View File


+ 59
- 57
layouts/index.html View File

@ -1,59 +1,61 @@
{{ define "main" }}
<h2>Hi! I'm Daniel.</h2>
<p>
<img class="rounded" src="/img/avatar-256.jpg" height=256 width=256 />
</p>
<p>
I live in Kansas City where I help run
<a target="_blank" href="https://kcrising.church">a small Christian church</a>,
raise two kids with my
<a target="_blank" href="https://www.instagram.com/valerielauren93">awesome wife</a>,
and write software for
<a target="_blank" href="https://postmates.com">Postmates</a>
(now <a target="_blank" href="https://uber.com">Uber</a>).
</p>
<p>
Occasionally, I post technical blog posts here.
</p>
<h2>Latest Posts</h2>
<ul>
{{ range (where .Site.RegularPages "Section" "blog") }}
{{ .Render "li" }}
{{ else }}
<p>Looks like there's nothing here!... yet!</p>
{{ end }}
</ul>
<h2>More Me</h2>
<ul>
<li>
<a href="https://discord.gg/jUCXCYp">Discord</a>
</li>
<li>
<a href="mailto:daniel@lyte.dev">Email</a>
</li>
<li>
<a href="https://github.com/lytedev">GitHub</a>
</li>
<li>
<a href="https://git.lyte.dev/lytedev">git.lyte.dev</a>
</li>
</ul>
<h2>Meta</h2>
<ul>
<li>
<a href="/privacy">Privacy Policy</a>
</li>
<li>
<a href="https://git.lyte.dev/lytedev/site.lyte.dev">Site Code</a>
</li>
</ul>
<h2 class="with-align">Hi! I'm Daniel.</h2>
<p>
<img class="rounded" src="/img/avatar-256.jpg" height=256 width=256 />
</p>
<p>
I live in Kansas City where I help run
<a target="_blank" href="https://kcrising.church">a small Christian church</a>,
raise two kids with my
<a target="_blank" href="https://www.instagram.com/valerielauren93">awesome wife</a>,
and write software for
<a target="_blank" href="https://postmates.com">Postmates</a>
(now <a target="_blank" href="https://uber.com">Uber</a>).
</p>
<p>
Occasionally, I post technical blog posts here.
</p>
<h2>Latest Posts</h2>
<ul>
{{ range (where .Site.RegularPages "Section" "blog") }}
{{ .Render "li" }}
{{ else }}
<p>Looks like there's nothing here!... yet!</p>
{{ end }}
</ul>
<h2>More Me</h2>
<ul>
<li>
<a href="https://discord.gg/jUCXCYp">Discord</a>
</li>
<li>
<a href="mailto:daniel@lyte.dev">Email</a>
</li>
<li>
<a href="https://github.com/lytedev">GitHub</a>
</li>
<li>
<a href="https://git.lyte.dev/lytedev">git.lyte.dev</a>
</li>
</ul>
<h2>Meta</h2>
<ul>
<li>
<a href="/privacy">Privacy Policy</a>
</li>
<li>
<a href="https://git.lyte.dev/lytedev/site.lyte.dev">Site Code</a>
</li>
</ul>
{{ end }}

+ 8
- 6
makefile View File

@ -1,23 +1,25 @@
HUGO ?= hugo
DEV_SERVE ?= serve --buildDrafts --buildFuture --buildExpired
NETLIFY_DEPLOY ?= deploy -d public
NETLIFY_DEPLOY ?= deploy -d public
.PHONY: all
all: build
.PHONY: build
build: themes/lyte/static/styles.css ; @${HUGO}
build: static/styles.css ; @${HUGO}
.PHONY: public
public: build
.PHONY: dev
dev:
@stylus -w themes/lyte/styles.styl --sourcemap -o themes/lyte/static/styles.css &
@stylus -w src/stylus/styles.styl --sourcemap -o static/styles.css &
@${HUGO} ${DEV_SERVE}
.PHONY: dev-ext
dev-ext: ; @${HUGO} ${DEV_SERVE} --bind 0.0.0.0
dev-ext:
@stylus -w src/stylus/styles.styl --sourcemap -o static/styles.css &
@${HUGO} ${DEV_SERVE} --bind $(shell ip a | grep -oP '192\.168\.\d+\.\d+/' | head -n 1 | tr -d '/')
.PHONY: clean
clean: ; @rm -r public
@ -28,8 +30,8 @@ publish: clean-css public ; @netlify ${NETLIFY_DEPLOY} && echo "Run \`make publi
.PHONY: publish-prod
publish-prod: clean-css public ; @netlify ${NETLIFY_DEPLOY} --prod
themes/lyte/static/styles.css: themes/lyte/styles.styl $(shell find ./themes/lyte -regex ".*\.styl")
static/styles.css: src/stylus/styles.styl $(shell find src/stylus -regex ".*\.styl")
stylus --compress $< -o $@
.PHONY: clean-css
clean-css: ; rm -f themes/lyte/static/styles.css
clean-css: ; rm -f static/styles.css

+ 54
- 0
src/stylus/font.styl View File

@ -0,0 +1,54 @@
// Jonathan Neal's system font stack
// https://github.com/jonathantneal/system-font-css/blob/gh-pages/system-font.css
font-sources(sources)
result = ()
for s in sources
push(result, unquote("local('" + s + "'),"))
push(result, sans-serif)
(result)
system-font-face(style, weight, sources...)
font-family system-ui
font-style normal
font-weight 300
src font-sources(sources)
@font-face
system-font-face(normal, 300, ".SFNS-Light", ".SFNSText-Light", ".HelveticaNeueDeskInterface-Light", ".LucidaGrandeUI", "Segoe UI Light", "Ubuntu Light", "Roboto-Light", "DroidSans", "Tahoma")
@font-face
system-font-face(italic, 300, ".SFNS-LightItalic", ".SFNSText-LightItalic", ".HelveticaNeueDeskInterface-Italic", ".LucidaGrandeUI", "Segoe UI Light Italic", "Ubuntu Light Italic", "Roboto-LightItalic", "DroidSans", "Tahoma")
@font-face
system-font-face(normal, 400, ".SFNS-Regular", ".SFNSText-Regular", ".HelveticaNeueDeskInterface-Regular", ".LucidaGrandeUI", "Segoe UI", "Ubuntu", "Roboto-Regular", "DroidSans", "Tahoma")
@font-face
system-font-face(italic, 400, ".SFNS-Italic", ".SFNSText-Italic", ".HelveticaNeueDeskInterface-Italic", ".LucidaGrandeUI", "Segoe UI Italic", "Ubuntu Italic", "Roboto-Italic", "DroidSans", "Tahoma")
@font-face
system-font-face(normal, 500, ".SFNS-Medium", ".SFNSText-Medium", ".HelveticaNeueDeskInterface-MediumP4", ".LucidaGrandeUI", "Segoe UI Semibold", "Ubuntu Medium", "Roboto-Medium", "DroidSans-Bold", "Tahoma Bold")
@font-face
system-font-face(italic, 500, ".SFNS-MediumItalic", ".SFNSText-MediumItalic", ".HelveticaNeueDeskInterface-MediumItalicP4", ".LucidaGrandeUI", "Segoe UI Semibold Italic", "Ubuntu Medium Italic", "Roboto-MediumItalic", "DroidSans-Bold", "Tahoma Bold")
@font-face
system-font-face(normal, 700, ".SFNS-Bold", ".SFNSText-Bold", ".HelveticaNeueDeskInterface-Bold", ".LucidaGrandeUI", "Segoe UI Bold", "Ubuntu Bold", "Roboto-Bold", "DroidSans-Bold", "Tahoma Bold")
@font-face
system-font-face(italic, 700, ".SFNS-BoldItalic", ".SFNSText-BoldItalic", ".HelveticaNeueDeskInterface-BoldItalic", ".LucidaGrandeUI", "Segoe UI Bold Italic", "Ubuntu Bold Italic", "Roboto-BoldItalic", "DroidSans-Bold", "Tahoma Bold")
iosevka-font-face(style, weight, src)
font-family iosevka
font-style style
font-weight weight
src url(src), monospace
font-display swap
@font-face
iosevka-font-face(normal, 300, "/font/iosevka/ss07-regular.woff2")
@font-face
iosevka-font-face(italic, 300, "/font/iosevka/ss07-italic.woff2")
@font-face
iosevka-font-face(italic, 500, "/font/iosevka/ss07-bold-italic.woff2")

themes/lyte/styles.styl → src/stylus/styles.styl View File

@ -3,8 +3,8 @@
padding 0
box-sizing border-box
@import theme
@import font
@import theme
code, pre { font-family: var(--msff) }
ul, ol { padding-left: 2em }
@ -45,7 +45,7 @@ body
font-family var(--msff), monospace
position relative
display flex
background-color var(--bg-header)
background-color var(--header-bg)
color var(--fg)
box-shadow 0 0 0.5em rgba(0, 0, 0, 0.25)
margin-bottom 0.5em
@ -124,20 +124,23 @@ form
.hidden-on-mobile { display: none }
@media (min-width 600px)
body.align-left .hide-in-align-left { display: none }
body.align-center .hide-in-align-center { display: none }
body.align-center > main
max-width 60ch
margin 0 auto
body.align-left
.hide-in-align-left { display: none }
.with-align { text-align: left }
body.align-center
&> main img,
&> main embed,
&> main frame,
&> main iframe
max-width 100%
.hide-in-align-center { display: none }
.with-align { text-align: center }
&> main
max-width 60ch
margin 0 auto
display block
img,
embed,
frame,
iframe
max-width 100%
margin 0 auto
display block
@import syntax-highlighting

+ 63
- 0
src/stylus/syntax-highlighting.styl View File

@ -0,0 +1,63 @@
main > .highlight pre.chroma
border 0
padding 0.25em 0.5em
border-left solid 0.25em var(--syntax-left-edge)
overflow-x auto
background-color var(--syntax-bg)
-moz-tab-size 2
tab-size 2
color var(--fg)
.chroma
.err
color var(--syntax-err)
background-color var(--syntax-bg)
// Line Table Cell
.lntd
vertical-align top
padding 0
margin 0
border 0
// Line Table
.lntable
border-spacing 0
padding 0
margin 0
border 0
width auto
overflow auto
display block
// Line Highlight
.hl
display block
width 100%
background-color var(--syntax-lhl)
// Line Numbers and Line Number Table
.ln, .lnt
margin-right 0.4em
padding 0 0.4em 0 0.4em
.ge { font-style: italic } // GenericEmph
.gs { font-weight: bold } // GenericStrong
for c in k kc kd kp kr kt no
.{c} { color: var(--syntax-aq) }
for c in na nc nd ne gi nf nx
.{c} { color: var(--syntax-name) }
for c in l se m mb mf mh mi il mo
.{c} { color: var(--syntax-lit) }
for c in ld s sa sb sc dl sd s2 sh si sx sr s1 ss
.{c} { color: var(--syntax-lits) }
for c in kn nt o gd ow
.{c} { color: var(--syntax-mag) }
for c in c ch cm c1 cs cp cpf gu
.{c} { color: var(--syntax-sh) }

+ 88
- 0
src/stylus/theme.styl View File

@ -0,0 +1,88 @@
light-syntax = {
brd: rgba(255, 255, 255, 0.2),
bg: rgba(0, 0, 0, 0.05),
ledg: #ccc,
sh: #775,
name: #480,
mag: #d04,
lit: #40f,
lits: #660,
aq: #04d,
err: #960050,
}
dark-syntax = {
brd: rgba(255, 255, 255, 0.2),
bg: rgba(255, 255, 255, 0.03),
ledg: #333,
sh: #75715e,
name: #a6e22e,
mag: #f92672,
lit: #ae81ff,
lits: #e6db74,
aq: #66d9ef,
err: #960050,
}
theme-colors = {
heading-fg: #333,
icon-shadow: #fff,
input-bg: rgba(0, 0, 0, 0.08),
input-hover-bg: rgba(0, 0, 0, 0.16),
}
:root
--ff system-ui
--msff iosevka
--pc #df3c59
--pcd #8e293b
--input-focus-bg var(--input-bg)
--button-bg var(--input-bg)
--button-hover-bg var(--input-hover-bg)
--button-focus-bg var(--input-bg)
--link-fg var(--fg)
--link-visited-fg var(heading-fg)
light-theme =
for k, v in light-syntax
--syntax-{k}: v
for k2, v2 in theme-colors
{unquote("--" + k2)}: v2
--bg #fff
--header-bg #eee
--fg #111
dark-theme =
for k, v in dark-syntax
--syntax-{k}: v
for k2, v2 in theme-colors
{unquote("--" + k2)}: invert(v2)
--bg #111
--header-bg #191919
--fg #fff
--link-visited-fg #aaa
:root, body.light-theme
{light-theme}
body.dark-theme
{dark-theme}
:root
@media (prefers-color-scheme dark)
{dark-theme}
.hide-in-light-theme
display none
@media (prefers-color-scheme dark)
.hide-in-dark-theme
display none
.hide-in-light-theme { display: inherit }
body.light-theme .hide-in-dark-theme { display: inherit }
body.dark-theme .hide-in-light-theme { display: none }
body.dark-theme .hide-in-dark-theme { display: none }
body.dark-theme .hide-in-light-theme { display: inherit }
body.light-theme .hide-in-dark-theme { display: inherit }
body.light-theme .hide-in-light-theme { display: none }

themes/lyte/static/.gitignore → static/.gitignore View File


themes/lyte/static/font/iosevka/LICENSE.md → static/font/iosevka/LICENSE.md View File


themes/lyte/static/font/iosevka/ss07-bold-italic.woff2 → static/font/iosevka/ss07-bold-italic.woff2 View File


themes/lyte/static/font/iosevka/ss07-bold.woff2 → static/font/iosevka/ss07-bold.woff2 View File


themes/lyte/static/font/iosevka/ss07-italic.woff2 → static/font/iosevka/ss07-italic.woff2 View File


themes/lyte/static/font/iosevka/ss07-regular.woff2 → static/font/iosevka/ss07-regular.woff2 View File


themes/lyte/static/global.js → static/global.js View File

@ -20,14 +20,14 @@ document.querySelectorAll(".js-disabled-only").forEach(a => a.remove())
const initAlign = () => {
const cur = localStorage.getItem("align")
const prev = cur == "left" ? "center" : "left"
const prev = cur == "center" ? "left" : "center"
document.body.classList.add("align-" + cur)
document.body.classList.remove("align-" + prev)
}
if (localStorage.getItem("align") === null) localStorage.setItem("align", "left")
if (localStorage.getItem("align") === null) localStorage.setItem("align", "center")
initAlign()
const toggleAlign = ev => {
localStorage.setItem("align", localStorage.getItem("align") == "left" ? "center" : "left")
localStorage.setItem("align", localStorage.getItem("align") == "center" ? "left" : "center")
initAlign()
if (!!ev.target) ev.preventDefault()
return false

+ 0
- 83
themes/lyte/font.styl View File

@ -1,83 +0,0 @@
// Jonathan Neal's system font stack
// https://github.com/jonathantneal/system-font-css/blob/gh-pages/system-font.css
// TODO: condense with stylus
@font-face {
font-family system-ui
font-style normal
font-weight 300
src local(".SFNS-Light"), local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Segoe UI Light"), local("Ubuntu Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma"), sans-serif
}
@font-face {
font-family system-ui
font-style italic
font-weight 300
src local(".SFNS-LightItalic"), local(".SFNSText-LightItalic"), local(".HelveticaNeueDeskInterface-Italic"), local(".LucidaGrandeUI"), local("Segoe UI Light Italic"), local("Ubuntu Light Italic"), local("Roboto-LightItalic"), local("DroidSans"), local("Tahoma"), sans-serif
}
@font-face {
font-family system-ui
font-style normal
font-weight 400
src local(".SFNS-Regular"), local(".SFNSText-Regular"), local(".HelveticaNeueDeskInterface-Regular"), local(".LucidaGrandeUI"), local("Segoe UI"), local("Ubuntu"), local("Roboto-Regular"), local("DroidSans"), local("Tahoma"), sans-serif
}
@font-face {
font-family system-ui
font-style italic
font-weight 400
src local(".SFNS-Italic"), local(".SFNSText-Italic"), local(".HelveticaNeueDeskInterface-Italic"), local(".LucidaGrandeUI"), local("Segoe UI Italic"), local("Ubuntu Italic"), local("Roboto-Italic"), local("DroidSans"), local("Tahoma"), sans-serif
}
@font-face {
font-family system-ui
font-style normal
font-weight 500
src local(".SFNS-Medium"), local(".SFNSText-Medium"), local(".HelveticaNeueDeskInterface-MediumP4"), local(".LucidaGrandeUI"), local("Segoe UI Semibold"), local("Ubuntu Medium"), local("Roboto-Medium"), local("DroidSans-Bold"), local("Tahoma Bold"), sans-serif
}
@font-face {
font-family system-ui
font-style italic
font-weight 500
src local(".SFNS-MediumItalic"), local(".SFNSText-MediumItalic"), local(".HelveticaNeueDeskInterface-MediumItalicP4"), local(".LucidaGrandeUI"), local("Segoe UI Semibold Italic"), local("Ubuntu Medium Italic"), local("Roboto-MediumItalic"), local("DroidSans-Bold"), local("Tahoma Bold"), sans-serif
}
@font-face {
font-family system-ui
font-style normal
font-weight 700
src local(".SFNS-Bold"), local(".SFNSText-Bold"), local(".HelveticaNeueDeskInterface-Bold"), local(".LucidaGrandeUI"), local("Segoe UI Bold"), local("Ubuntu Bold"), local("Roboto-Bold"), local("DroidSans-Bold"), local("Tahoma Bold"), sans-serif
}
@font-face {
font-family system-ui
font-style italic
font-weight 700
src local(".SFNS-BoldItalic"), local(".SFNSText-BoldItalic"), local(".HelveticaNeueDeskInterface-BoldItalic"), local(".LucidaGrandeUI"), local("Segoe UI Bold Italic"), local("Ubuntu Bold Italic"), local("Roboto-BoldItalic"), local("DroidSans-Bold"), local("Tahoma Bold"), sans-serif
}
// TODO: condense with stylus
@font-face {
font-family iosevka
font-style normal
font-weight 300
src url("/font/iosevka/ss07-regular.woff2"), monospace
font-display swap
}
@font-face {
font-family iosevka
font-style italic
font-weight 300
src url("/font/iosevka/ss07-italic.woff2"), monospace
font-display swap
}
@font-face {
font-family iosevka
font-style italic
font-weight 500
src url("/font/iosevka/ss07-bold-italic.woff2"), monospace
font-display swap
}

+ 0
- 67
themes/lyte/syntax-highlighting.styl View File

@ -1,67 +0,0 @@
main > .highlight pre.chroma
border 0
padding 0.25em 0.5em
border-left solid 0.25em var(--syntax-left-edge)
overflow-x auto
background-color var(--syntax-bg)
/* TabSize */ .chroma { -moz-tab-size: 2; tab-size: 2 }
/* Background */ .chroma { color: var(--fg); border: solid 0.05em var(--syntax-border) }
/* Error */ .chroma .err { color: var(--syntax-err); background-color: var(--syntax-bg) }
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
/* LineHighlight */ .chroma .hl { display: block; width: 100%; background-color: var(--syntax-lhl) }
/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; }
/* Keyword */ .chroma .k { color: var(--syntax-aq) }
/* KeywordConstant */ .chroma .kc { color: var(--syntax-aq) }
/* KeywordDeclaration */ .chroma .kd { color: var(--syntax-aq) }
/* KeywordNamespace */ .chroma .kn { color: var(--syntax-mag) }
/* KeywordPseudo */ .chroma .kp { color: var(--syntax-aq) }
/* KeywordReserved */ .chroma .kr { color: var(--syntax-aq) }
/* KeywordType */ .chroma .kt { color: var(--syntax-aq) }
/* NameAttribute */ .chroma .na { color: var(--syntax-name) }
/* NameClass */ .chroma .nc { color: var(--syntax-name) }
/* NameConstant */ .chroma .no { color: var(--syntax-aq) }
/* NameDecorator */ .chroma .nd { color: var(--syntax-name) }
/* NameException */ .chroma .ne { color: var(--syntax-name) }
/* NameFunction */ .chroma .nf { color: var(--syntax-name) }
/* NameOther */ .chroma .nx { color: var(--syntax-name) }
/* NameTag */ .chroma .nt { color: var(--syntax-mag) }
/* Literal */ .chroma .l { color: var(--syntax-lit) }
/* LiteralDate */ .chroma .ld { color: var(--syntax-lits) }
/* LiteralString */ .chroma .s { color: var(--syntax-lits) }
/* LiteralStringAffix */ .chroma .sa { color: var(--syntax-lits) }
/* LiteralStringBacktick */ .chroma .sb { color: var(--syntax-lits) }
/* LiteralStringChar */ .chroma .sc { color: var(--syntax-lits) }
/* LiteralStringDelimiter */ .chroma .dl { color: var(--syntax-lits) }
/* LiteralStringDoc */ .chroma .sd { color: var(--syntax-lits) }
/* LiteralStringDouble */ .chroma .s2 { color: var(--syntax-lits) }
/* LiteralStringEscape */ .chroma .se { color: var(--syntax-lit) }
/* LiteralStringHeredoc */ .chroma .sh { color: var(--syntax-lits) }
/* LiteralStringInterpol */ .chroma .si { color: var(--syntax-lits) }
/* LiteralStringOther */ .chroma .sx { color: var(--syntax-lits) }
/* LiteralStringRegex */ .chroma .sr { color: var(--syntax-lits) }
/* LiteralStringSingle */ .chroma .s1 { color: var(--syntax-lits) }
/* LiteralStringSymbol */ .chroma .ss { color: var(--syntax-lits) }
/* LiteralNumber */ .chroma .m { color: var(--syntax-lit) }
/* LiteralNumberBin */ .chroma .mb { color: var(--syntax-lit) }
/* LiteralNumberFloat */ .chroma .mf { color: var(--syntax-lit) }
/* LiteralNumberHex */ .chroma .mh { color: var(--syntax-lit) }
/* LiteralNumberInteger */ .chroma .mi { color: var(--syntax-lit) }
/* LiteralNumberIntegerLong */ .chroma .il { color: var(--syntax-lit) }
/* LiteralNumberOct */ .chroma .mo { color: var(--syntax-lit) }
/* Operator */ .chroma .o { color: var(--syntax-mag) }
/* OperatorWord */ .chroma .ow { color: var(--syntax-mag) }
/* Comment */ .chroma .c { color: var(--syntax-sh) }
/* CommentHashbang */ .chroma .ch { color: var(--syntax-sh) }
/* CommentMultiline */ .chroma .cm { color: var(--syntax-sh) }
/* CommentSingle */ .chroma .c1 { color: var(--syntax-sh) }
/* CommentSpecial */ .chroma .cs { color: var(--syntax-sh) }
/* CommentPreproc */ .chroma .cp { color: var(--syntax-sh) }
/* CommentPreprocFile */ .chroma .cpf { color: var(--syntax-sh) }
/* GenericDeleted */ .chroma .gd { color: var(--syntax-mag) }
/* GenericEmph */ .chroma .ge { font-style: italic }
/* GenericInserted */ .chroma .gi { color: var(--syntax-name) }
/* GenericStrong */ .chroma .gs { font-weight: bold }
/* GenericSubheading */ .chroma .gu { color: var(--syntax-sh) }

+ 0
- 87
themes/lyte/theme.styl View File

@ -1,87 +0,0 @@
:root, body.light-theme
--syntax-border rgba(255, 255, 255, 0.2)
--syntax-bg rgba(0, 0, 0, 0.05)
--syntax-left-edge #ccc
--syntax-sh #775
--syntax-name #480
--syntax-mag #d04
--syntax-lit #40f
--syntax-lits #660
--syntax-aq #04d
--syntax-err #960050
--ff system-ui
--msff iosevka
/* primary "brand" colors */
--pc #0af
--pcd #0cf
--bg #fff
--fg #111
--heading-fg #333
--bg-header #eee
--icon-shadow #4df
--input-bg #eee
--input-hover-bg #ddd
--input-focus-bg var(--input-bg)
--button-bg #eee
--button-hover-bg #ddd
--button-focus-bg var(--input-bg)
--link-fg var(--pc)
--link-visited-fg var(--pcd)
dark-theme =
--syntax-border rgba(255, 255, 255, 0.2)
--syntax-bg rgba(255, 255, 255, 0.03)
--syntax-left-edge #333
--syntax-sh #75715e
--syntax-name #a6e22e
--syntax-mag #f92672
--syntax-lit #ae81ff
--syntax-lits #e6db74
--syntax-aq #66d9ef
--syntax-err #960050
--ff system-ui
--msff iosevka
// primary "brand" colors
// --pc #df3c59
// --pcd #8e293b
--pc #0af
--pcd #0cf
--bg #111
--fg #fff
--heading-fg #ccc
--bg-header #191919
--icon-shadow #000
--input-bg #222
--input-hover-bg #333
--input-focus-bg var(--input-bg)
--button-bg #222
--button-hover-bg #333
--button-focus-bg var(--input-bg)
body.dark-theme
{dark-theme}
:root
@media (prefers-color-scheme dark)
{dark-theme}
.hide-in-light-theme
display none
@media (prefers-color-scheme dark)
.hide-in-dark-theme
display none
.hide-in-light-theme { display: inherit }
body.light-theme .hide-in-dark-theme { display: inherit }
body.dark-theme .hide-in-light-theme { display: none }
body.dark-theme .hide-in-dark-theme { display: none }
body.dark-theme .hide-in-light-theme { display: inherit }
body.light-theme .hide-in-dark-theme { display: inherit }
body.light-theme .hide-in-light-theme { display: none }

Write Preview
Loading…
Cancel
Save