Lomanic/bibliogram
1
0
Fork 0
mirror of https://git.sr.ht/~cadence/bibliogram synced 2024-11-01 05:57:29 +00:00
Code Issues Releases Wiki Activity

Refactor sass for theming

Browse Source
This commit is contained in:
Cadence Ember 2020-05-09 21:34:00 +12:00
parent 710400c4f1
commit 23e2ffecbf
No known key found for this signature in database
GPG Key ID: 128B99B1B74A6412
14 changed files with 226 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
package-lock.json generated
View File

@ -2738,8 +2738,8 @@
"integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==" "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg=="
}, },
"pinski": { "pinski": {
"version": "github:cloudrac3r/pinski#342365c44b923d5e6c6c5c34bc9267d7652be2a9", "version": "github:cloudrac3r/pinski#61809e18606265ec47813f3bdab80928c70ae203",
"from": "github:cloudrac3r/pinski#342365c44b923d5e6c6c5c34bc9267d7652be2a9", "from": "github:cloudrac3r/pinski#61809e18606265ec47813f3bdab80928c70ae203",
"requires": { "requires": {
"mime": "^2.4.4", "mime": "^2.4.4",
"pug": "^2.0.3", "pug": "^2.0.3",

2
package.json
View File

@ -19,7 +19,7 @@
"mixin-deep": "^2.0.1", "mixin-deep": "^2.0.1",
"node-dir": "^0.1.17", "node-dir": "^0.1.17",
"node-fetch": "^2.6.0", "node-fetch": "^2.6.0",
"pinski": "github:cloudrac3r/pinski#342365c44b923d5e6c6c5c34bc9267d7652be2a9", "pinski": "github:cloudrac3r/pinski#61809e18606265ec47813f3bdab80928c70ae203",
"pug": "^2.0.4", "pug": "^2.0.4",
"semver": "^7.2.1", "semver": "^7.2.1",
"sharp": "^0.25.2", "sharp": "^0.25.2",

17
src/lib/constants.js
View File

@ -114,6 +114,21 @@ let constants = {
default: "", default: "",
boolean: true, boolean: true,
replaceEmptyWithDefault: true replaceEmptyWithDefault: true
},{
name: "save_data",
default: "automatic",
boolean: false,
replaceEmptyWithDefault: true
},{
name: "rewrite_youtube",
default: "",
boolean: false,
replaceEmptyWithDefault: true
},{
name: "rewrite_twitter",
default: "",
boolean: false,
replaceEmptyWithDefault: true
} }
], ],
@ -210,7 +225,7 @@ let constants = {
additional_routes: [], additional_routes: [],
database_version: 5 database_version: 6
} }
// Override values from config and export the result // Override values from config and export the result

11
src/lib/utils/upgradedb.js
View File

@ -75,6 +75,17 @@ const deltas = new Map([
.run() .run()
})() })()
}], }],
// version 5 to version 6
[6, function() {
db.transaction(() => {
db.prepare("ALTER TABLE UserSettings ADD COLUMN save_data TEXT NOT NULL DEFAULT 'automatic'")
.run()
db.prepare("ALTER TABLE UserSettings ADD COLUMN rewrite_youtube TEXT NOT NULL DEFAULt ''")
.run()
db.prepare("ALTER TABLE UserSettings ADD COLUMN rewrite_twitter TEXT NOT NULL DEFAULT ''")
.run()
})()
}]
]) ])
module.exports = async function() { module.exports = async function() {

10
src/site/api/routes.js
View File

@ -12,8 +12,10 @@ function getPageTitle(post) {
module.exports = [ module.exports = [
{ {
route: "/", methods: ["GET"], code: async () => { route: "/", methods: ["GET"], code: async ({req}) => {
const settings = getSettings(req)
return render(200, "pug/home.pug", { return render(200, "pug/home.pug", {
settings,
rssEnabled: constants.feeds.enabled, rssEnabled: constants.feeds.enabled,
allUnblocked: history.testNoneBlocked(), allUnblocked: history.testNoneBlocked(),
torAvailable: switcher.canUseTor(), torAvailable: switcher.canUseTor(),
@ -22,9 +24,11 @@ module.exports = [
} }
}, },
{ {
route: "/privacy", methods: ["GET"], code: async () => { route: "/privacy", methods: ["GET"], code: async ({req}) => {
if (constants.has_privacy_policy && pugCache.has("pug/privacy.pug")) { if (constants.has_privacy_policy && pugCache.has("pug/privacy.pug")) {
return render(200, "pug/privacy.pug") const settings = getSettings(req)
return render(200, "pug/privacy.pug", {settings})
} else { } else {
return render(404, "pug/friendlyerror.pug", { return render(404, "pug/friendlyerror.pug", {
statusCode: 404, statusCode: 404,

5
src/site/pug/includes/head.pug
View File

@ -1,5 +1,8 @@
meta(charset="utf-8") meta(charset="utf-8")
link(rel="stylesheet" type="text/css" href=getStaticURL("sass", "main.sass"))
- let theme = settings ? settings.theme : "classic"
link(rel="stylesheet" type="text/css" href=getStaticURL("sass", `${theme}.sass`))
meta(name="viewport" content="width=device-width, initial-scale=1") meta(name="viewport" content="width=device-width, initial-scale=1")
link(rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png") link(rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png")
link(rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png") link(rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png")

20
src/site/pug/settings.pug
View File

@ -6,10 +6,10 @@ mixin fieldset(name)
.fieldset-contents .fieldset-contents
block block
mixin input(id, description, disabled) mixin input(id, description, placeholder, disabled)
.field-row .field-row
label.description(for=id)= description label.description(for=id)= description
input(type="text" id=id name=id value=settings[id] disabled=disabled) input(type="text" id=id name=id value=settings[id] placeholder=placeholder disabled=disabled)
mixin checkbox(id, description, label, disabled) mixin checkbox(id, description, label, disabled)
.field-row.checkbox-row .field-row.checkbox-row
@ -45,6 +45,17 @@ html
{value: "en-us", text: "English (US)"} {value: "en-us", text: "English (US)"}
]) ])
+select("save_data", "Save data", true, [
{value: "automatic", text: "Automatic"},
{value: "off", text: "Off"},
{value: "lazy_load", text: "Lazy load"},
{value: "full", text: "Full"}
])
+input("rewrite_youtube", "Rewrite YouTube domain", "youtube.com", true)
+input("rewrite_twitter", "Rewrite Twitter domain", "twitter.com", true)
+checkbox("show_comments", "Display comments", "Display", true) +checkbox("show_comments", "Display comments", "Display", true)
+checkbox("link_hashtags", "Clickable hashtags", "Clickable", true) +checkbox("link_hashtags", "Clickable hashtags", "Clickable", true)
@ -52,8 +63,9 @@ html
+checkbox("spa", "Fast navigation", "Enabled", false) +checkbox("spa", "Fast navigation", "Enabled", false)
+fieldset("Appearance") +fieldset("Appearance")
+select("theme", "Theme", true, [ +select("theme", "Theme", false, [
{value: "classic", text: "Classic"} {value: "classic", text: "Classic"},
{value: "blue", text: "Classic blue"}
]) ])
+checkbox("display_top_nav", "Display top bar", "Always", false) +checkbox("display_top_nav", "Display top bar", "Always", false)

2
src/site/sass/blue.sass Normal file
View File

@ -0,0 +1,2 @@
@use "themes/blue" as *
@use "includes/main" with ($theme: $theme)

2
src/site/sass/classic.sass Normal file
View File

@ -0,0 +1,2 @@
@use "themes/classic" as *
@use "includes/main" with ($theme: $theme)

1
src/site/sass/_forms.sass → src/site/sass/includes/_forms.sass
View File

@ -96,6 +96,7 @@ button, select, input, .checkbox-row .pill
input[type="text"] input[type="text"]
width: 200px width: 200px
padding: 5px 8px
select select
padding: 4px 6px 4px 4px padding: 4px 6px 4px 4px

205
src/site/sass/main.sass → src/site/sass/includes/_main.sass
View File

@ -1,14 +1,12 @@
@use "forms" @use "forms"
$theme: () !default
$layout-a-max: 820px $layout-a-max: 820px
$layout-b-min: 821px $layout-b-min: 821px
$layout-c-max: 680px $layout-c-max: 680px
$layout-home-a-max: 520px $layout-home-a-max: 520px
$layout-home-b-min: 521px $layout-home-b-min: 521px
$main-theme-link-color: #085cae
$medium-red-bg: #6a2222
$light-red-bg: #bd4444
$solar-background: #fff4e8
@font-face @font-face
font-family: "Bariol" font-family: "Bariol"
@ -53,11 +51,11 @@ body
border-color: hsl(104, 51.4%, 43.5%) border-color: hsl(104, 51.4%, 43.5%)
.top-nav .top-nav
background-color: $light-red-bg background-color: map-get($theme, background-power-primary)
position: relative position: relative
z-index: 1 z-index: 1
box-shadow: 0px -2px 4px 4px rgba(0, 0, 0, 0.4) box-shadow: map-get($theme, "shadow-down")
border-bottom: 1px solid #333 border-bottom: map-get($theme, "edge-context-divider")
padding: 6px 12px padding: 6px 12px
justify-content: space-between justify-content: space-between
align-items: center align-items: center
@ -87,13 +85,13 @@ body
line-height: 1 line-height: 1
@media screen and (max-width: $layout-a-max) @media screen and (max-width: $layout-a-max)
border-bottom: 1px solid #333 border-bottom: map-get($theme, "edge-context-divider")
box-shadow: 0px -2px 4px 4px rgba(0, 0, 0, 0.4) box-shadow: map-get($theme, "shadow-down")
padding-bottom: 25px padding-bottom: 25px
@media screen and (min-width: $layout-b-min) @media screen and (min-width: $layout-b-min)
border-right: 1px solid #333 border-right: map-get($theme, "edge-context-divider")
box-shadow: -2px 0px 4px 4px rgba(0, 0, 0, 0.4) box-shadow: map-get($theme, "shadow-right")
.profile-sticky .profile-sticky
position: sticky position: sticky
@ -109,7 +107,7 @@ body
height: unset height: unset
a, a:visited a, a:visited
color: $main-theme-link-color color: map-get($theme, "link-primary")
.pfp .pfp
margin: 25px 0 margin: 25px 0
@ -153,17 +151,14 @@ body
.bibliogram-meta .bibliogram-meta
margin: 20px 10px margin: 20px 10px
border-top: 1px solid #333 border-top: map-get($theme, "edge-context-divider")
@media screen and (max-width: $layout-a-max) @media screen and (max-width: $layout-a-max)
display: none display: none
.timeline .timeline
--image-size: 260px --image-size: 260px
$image-size: var(--image-size) $image-size: var(--image-size)
$background: $solar-background
@media screen and (max-width: $layout-a-max) @media screen and (max-width: $layout-a-max)
--image-size: 150px --image-size: 150px
@ -172,7 +167,7 @@ body
@media screen and (max-width: $layout-c-max) @media screen and (max-width: $layout-c-max)
--image-size: calc(33vw - 10px) --image-size: calc(33vw - 10px)
background-color: $background background-color: map-get($theme, "background-primary")
padding: 15px 15px 40px padding: 15px 15px 40px
&.no-posts &.no-posts
@ -181,7 +176,7 @@ body
justify-content: center justify-content: center
.page-number .page-number
color: #444 color: map-get($theme, "foreground-timeline-page")
line-height: 1 line-height: 1
max-width: 600px max-width: 600px
margin: 0px auto margin: 0px auto
@ -202,7 +197,7 @@ body
position: relative position: relative
z-index: 1 z-index: 1
padding: 10px padding: 10px
background-color: $background background-color: map-get($theme, "background-primary")
.next-page-container .next-page-container
margin: 20px 0px margin: 20px 0px
@ -234,8 +229,9 @@ body
$margin: 5px $margin: 5px
margin: $margin margin: $margin
color: #111 color: map-get($theme, "foreground-thumbnail-alt")
background-color: rgba(40, 40, 40, 0.25) border: 0px map-get($theme, "edge-thumbnail-hover")
background-color: map-get($theme, "background-timeline-loading")
text-decoration: none text-decoration: none
overflow: hidden overflow: hidden
@include sized @include sized
@ -243,7 +239,7 @@ body
&:hover &:hover
$border-width: 3px $border-width: 3px
margin: $margin - $border-width margin: $margin - $border-width
border: $border-width solid #111 border-width: $border-width
@media screen and (max-width: $layout-c-max) @media screen and (max-width: $layout-c-max)
$margin: 2px $margin: 2px
@ -252,13 +248,13 @@ body
&:hover &:hover
$border-width: 2px $border-width: 2px
margin: $margin - $border-width margin: $margin - $border-width
border: $border-width solid #111 border-width: $border-width
.sized-image .sized-image
@include sized @include sized
.post-page .post-page
background-color: #505156 background-color: map-get($theme, "background-post-distraction")
.post-page-divider .post-page-divider
display: grid display: grid
@ -292,14 +288,14 @@ body
align-items: center align-items: center
grid-template-columns: auto 1fr auto grid-template-columns: auto 1fr auto
justify-content: center justify-content: center
background-color: #b3b3b3 background-color: map-get($theme, "background-post-header")
padding: 10px padding: 10px
position: sticky position: sticky
top: 0 top: 0
border-bottom: 1px solid #333 border-bottom: map-get($theme, "edge-context-divider")
@media screen and (max-width: $layout-a-max) @media screen and (max-width: $layout-a-max)
box-shadow: 0px -2px 4px 4px rgba(0, 0, 0, 0.4) box-shadow: map-get($theme, "shadow-down")
.navigate-posts .navigate-posts
-webkit-appearance: none -webkit-appearance: none
@ -330,23 +326,23 @@ body
width: $size width: $size
height: $size height: $size
margin-right: 10px margin-right: 10px
background-color: rgba(40, 40, 40, 0.25) background-color: map-get($theme, "background-post-pfp-loading")
.name .name
font-size: 20px font-size: 20px
color: black color: map-get($theme, "foreground-timeline-header")
text-decoration: none text-decoration: none
&:hover &:hover
text-decoration: underline text-decoration: underline
.relative-box .relative-box
background-color: #eee background-color: map-get($theme, "background-post-caption")
@media screen and (min-width: $layout-b-min) @media screen and (min-width: $layout-b-min)
.relative-box .relative-box
position: relative position: relative
box-shadow: 0px 6px 4px -4px rgba(0, 0, 0, .4) inset box-shadow: map-get($theme, "shadow-down-inset")
.scrolling-box .scrolling-box
position: absolute position: absolute
@ -374,7 +370,7 @@ body
flex-direction: column flex-direction: column
align-items: center align-items: center
justify-content: center justify-content: center
background-color: #262728 background-color: map-get($theme, "background-post-gallery")
padding: 10px padding: 10px
@media screen and (max-width: $layout-a-max) @media screen and (max-width: $layout-a-max)
@ -382,8 +378,8 @@ body
position: relative position: relative
.sized-image, .sized-video .sized-image, .sized-video
color: #eee color: map-get($theme, "foreground-gallery-alt")
background-color: #3b3c3d background-color: map-get($theme, "background-post-loading")
max-height: 94vh max-height: 94vh
max-width: 100% max-width: 100%
@ -401,7 +397,7 @@ body
.error-page .error-page
box-sizing: border-box box-sizing: border-box
min-height: 100vh min-height: 100vh
background: #191919 background: map-get($theme, "background-error-page")
padding: 10px padding: 10px
text-align: center text-align: center
display: flex display: flex
@ -410,7 +406,7 @@ body
align-items: center align-items: center
a, a:visited a, a:visited
color: #4a93d2 color: map-get($theme, "link-error-page")
.code, .message, .explanation, .back-link .code, .message, .explanation, .back-link
line-height: 1.2 line-height: 1.2
@ -418,18 +414,18 @@ body
.code .code
font-size: 80px font-size: 80px
color: #fff color: map-get($theme, "foreground-error-code")
margin-bottom: 25px margin-bottom: 25px
.message .message
font-size: 35px font-size: 35px
color: #ccc color: map-get($theme, "foreground-error-message")
.explanation .explanation
line-height: 1.3 line-height: 1.3
margin-top: 10px margin-top: 10px
font-size: 20px font-size: 20px
color: #bbb color: map-get($theme, "foreground-error-explanation")
white-space: pre-line white-space: pre-line
.back .back
@ -437,13 +433,11 @@ body
font-size: 25px font-size: 25px
.homepage .homepage
$link-color: #ffb8b8
display: flex display: flex
flex-direction: column flex-direction: column
min-height: 100vh min-height: 100vh
background-color: $light-red-bg background-color: map-get($theme, "background-power-primary")
color: #fff color: map-get($theme, "foreground-power-primary")
h1 h1
font-size: 48px font-size: 48px
@ -454,7 +448,7 @@ body
margin: 0px margin: 0px
a, a:visited a, a:visited
color: $link-color color: map-get($theme, "link-power")
.banner .banner
padding: 0px 5px padding: 0px 5px
@ -499,7 +493,8 @@ body
box-sizing: content-box box-sizing: content-box
font-size: 20px font-size: 20px
height: 20px height: 20px
border: 1px solid #333 border: map-get($theme, "edge-go-control")
color: map-get($theme, "foreground-go-control")
.text .text
border-radius: 6px 0px 0px 6px border-radius: 6px 0px 0px 6px
@ -515,15 +510,14 @@ body
padding-left: 12px padding-left: 12px
padding-right: 12px padding-right: 12px
cursor: pointer cursor: pointer
background-color: #ffbebe background-color: map-get($theme, "background-power-palest")
color: #111
&:hover &:hover
background-color: #ff7c7c background-color: map-get($theme, "background-power-pale")
.about-container .about-container
background-color: $medium-red-bg background-color: map-get($theme, "background-power-secondary")
color: #eee color: map-get($theme, "foreground-power-secondary")
padding: 50px 20px padding: 50px 20px
flex: 1 flex: 1
min-height: 60vh min-height: 60vh
@ -538,18 +532,18 @@ body
white-space: nowrap white-space: nowrap
.link-list .link-list
color: $link-color color: map-get($theme, "link-power")
.structured-text .structured-text
a, a:visited a, a:visited
color: $main-theme-link-color color: map-get($theme, "link-primary")
text-decoration: none text-decoration: none
a:link, a:link:visited a:link, a:link:visited
text-decoration: underline text-decoration: underline
.link-to-hashtag .link-to-hashtag
color: #127722 color: map-get($theme, "link-hashtag")
.privacy-policy .privacy-policy
max-width: 700px max-width: 700px
@ -558,31 +552,31 @@ body
padding: 0px 10px 80px padding: 0px 10px 80px
font-size: 20px font-size: 20px
line-height: 1.4 line-height: 1.4
background-color: #481717 background-color: map-get($theme, "background-power-tertiary")
color: #e2e2e2 color: map-get($theme, "foreground-power-tertiary")
h1, h2, h3 h1, h2, h3
color: #f4f4f4 color: map-get($theme, "foreground-header-privacy")
h1 h1
margin: 40px 0px margin: 40px 0px
font-size: 48px font-size: 48px
a, a:visited a, a:visited
color: #ffb8b8 color: map-get($theme, "link-power")
code code
font-size: 0.8em font-size: 0.8em
background-color: #141414 background-color: map-get($theme, "background-power-quote")
padding: 3px 5px padding: 3px 5px
border-radius: 5px border-radius: 5px
color: #eee color: map-get($theme, "foreground-power-secondary")
.return-home .return-home
line-height: 1 line-height: 1
margin-top: 45px margin-top: 45px
padding-top: 15px padding-top: 15px
border-top: 1px solid #714141 border-top: map-get($theme, "edge-power-divider")
.post-overlay .post-overlay
position: fixed position: fixed
@ -590,7 +584,7 @@ body
left: 0 left: 0
right: 0 right: 0
bottom: 0 bottom: 0
background: rgba(0, 0, 0, 0.7) background: map-get($theme, "background-post-overlay")
z-index: 10 z-index: 10
overflow-y: scroll overflow-y: scroll
@ -603,69 +597,37 @@ body
align-items: center align-items: center
.loading-inner .loading-inner
color: white color: map-get($theme, "foreground-alert")
font-size: 30px font-size: 30px
line-height: 1 line-height: 1
padding: 26px padding: 26px
border-radius: 20px border-radius: 20px
border: 2px solid #aaa border: map-get($theme, "edge-alert")
font-weight: bold font-weight: bold
background-color: #282828 background-color: map-get($theme, "background-alert")
@mixin article-code
code
font-size: 0.8em
letter-spacing: -0.2px
background: #ccc
color: #000
padding: 0px 4px
border-radius: 2px
.updater-page
@include article-code
font-size: 20px
max-width: 800px
margin: 0 auto
color: #222
.commits
border-left: 2px solid #555
margin: 10px 0px
padding-left: 10px
.hash
margin-right: 6px
.attention
border-left: 2px solid
padding-left: 8px
color: #700
.article-page .article-page
@include article-code background-color: map-get($theme, "background-primary")
background-color: #fff4e8
font-size: 22px font-size: 22px
line-height: 1.4 line-height: 1.4
color: #222 color: map-get($theme, "foreground-primary")
min-height: 100vh min-height: 100vh
header h1
background-color: $medium-red-bg
color: #fff
padding: 40px 10px
line-height: 1.2
h1, h2
text-align: center text-align: center
margin: 0 margin: 0
h1
font-size: 50px font-size: 50px
h2 h2
font-size: 30px font-size: 34px
margin: 0
color: map-get($theme, "foreground-header")
header
background-color: map-get($theme, "background-power-secondary")
color: map-get($theme, "foreground-power-primary")
padding: 40px 10px
line-height: 1.2
.article-main .article-main
max-width: 800px max-width: 800px
@ -673,13 +635,25 @@ body
padding: 20px 20px 100px padding: 20px 20px 100px
a, a:visited a, a:visited
color: $main-theme-link-color color: map-get($theme, "link-primary")
code
font-size: 0.8em
letter-spacing: -0.2px
background: map-get($theme, "background-primary-quote")
color: map-get($theme, "foreground-primary-quote")
padding: 0px 4px
border-radius: 2px
.settings-page .settings-page
background-color: #fff4e8 background-color: map-get($theme, "background-primary")
color: map-get($theme, "foreground-primary")
h1, legend
color: map-get($theme, "foreground-header")
a, a:visited a, a:visited
color: $main-theme-link-color color: map-get($theme, "link-primary")
.settings .settings
padding: 0px 10px 50px padding: 0px 10px 50px
@ -691,8 +665,8 @@ body
font-size: 24px font-size: 24px
line-height: 1 line-height: 1
text-align: center text-align: center
background-color: #0b420b background-color: map-get($theme, "background-banner-success")
color: #fff color: map-get($theme, "foreground-banner")
.action-container .action-container
margin-top: 20px margin-top: 20px
@ -701,8 +675,11 @@ body
align-items: center align-items: center
.save-button .save-button
@include forms.curve-out-major padding: 12px
width: 180px width: 180px
&:not(:active)
@include forms.curve-out-major
.home-link .home-link
font-size: 21px font-size: 21px

16
src/site/sass/themes/_blue.scss Normal file
View File

@ -0,0 +1,16 @@
// Defined in scss file instead of sass because indented syntax does not have multiline maps
// This is based on the classic theme, so it pulls that in as the base and then overwrites only the properties it cares about
// This also makes it future-proof because future additions to classic will be automatically available in this style too
@use "classic";
$theme: map-merge(classic.$theme, (
"background-power-primary": #3e73b7,
"background-power-secondary": #274771,
"background-power-tertiary": #1b233c,
"background-power-palest": #bee5ff,
"background-power-pale": #7cc4ff,
"background-banner-success": #173d6f,
"link-power": #91cbfd,
"edge-power-divider": 1px solid #3b496a
));

54
src/site/sass/themes/_classic.scss Normal file
View File

@ -0,0 +1,54 @@
// Defined in scss file instead of sass because indented syntax does not have multiline maps
// https://github.com/sass/sass/issues/216
$theme: (
"background-primary": #fff4e8,
"background-timeline-profile": #fff,
"background-timeline-loading": #c9c1b8,
"background-post-distraction": #505156,
"background-post-overlay": rgba(0, 0, 0, 0.7),
"background-post-header": #b3b3b3,
"background-post-pfp-loading": #999,
"background-post-caption": #eee,
"background-post-gallery": #262728,
"background-post-loading": #3b3c3d,
"background-power-primary": #bd4444,
"background-power-secondary": #6a2222,
"background-power-tertiary": #481717,
"background-power-palest": #ffbebe,
"background-power-pale": #ff7c7c,
"background-power-quote": #191919,
"background-primary-quote": #ccc,
"background-error-page": #191919,
"background-alert": #282828,
"background-banner-success": #0b420b,
"foreground-primary": #222,
"foreground-header": #000,
"foreground-power-primary": #fff,
"foreground-power-secondary": #eee,
"foreground-power-tertiary": #e2e2e2,
"foreground-go-control": #111,
"foreground-thumbnail-alt": #111,
"foreground-timeline-page": #444,
"foreground-timeline-header": #000,
"foreground-gallery-alt": #eee,
"foreground-error-code": #fff,
"foreground-error-message": #ccc,
"foreground-error-explanation": #bbb,
"foreground-header-privacy": #f4f4f4,
"foreground-alert": #eee,
"foreground-primary-quote": #000,
"foreground-banner": #fff,
"link-primary": #085cae,
"link-power": #ffb8b8,
"link-error-page": #4a93d2,
"link-hashtag": #127722,
"edge-context-divider": 1px solid #333,
"edge-thumbnail-hover": solid #111,
"edge-go-control": 1px solid #333,
"edge-power-divider": 1px solid #714141,
"edge-alert": 2px solid #aaa,
"shadow-down": 0px -2px 4px 4px rgba(0, 0, 0, 0.4),
"shadow-right": -2px 0px 4px 4px rgba(0, 0, 0, 0.4),
"shadow-down-inset": 0px 6px 4px -4px rgba(0, 0, 0, 0.4) inset,
);

5
src/site/server.js
View File

@ -21,10 +21,11 @@ subdirs("pug", async (err, dirs) => {
await require("../lib/utils/upgradedb")() await require("../lib/utils/upgradedb")()
pinski.setNotFoundTarget("/404") pinski.setNotFoundTarget("/404")
pinski.addRoute("/static/css/main.css", "sass/main.sass", "sass") pinski.addRoute("/static/css/classic.css", "sass/classic.sass", "sass")
pinski.addRoute("/static/css/blue.css", "sass/blue.sass", "sass")
pinski.addRoute("/settings", "pug/settings.pug", "pug") pinski.addRoute("/settings", "pug/settings.pug", "pug")
pinski.addPugDir("pug", dirs) pinski.addPugDir("pug", dirs)
pinski.addSassDir("sass") pinski.addSassDir("sass", ["sass/includes", "sass/themes"])
pinski.addStaticHashTableDir("html/static/js") pinski.addStaticHashTableDir("html/static/js")
pinski.muteLogsStartingWith("/imageproxy") pinski.muteLogsStartingWith("/imageproxy")
pinski.muteLogsStartingWith("/videoproxy") pinski.muteLogsStartingWith("/videoproxy")