commit 9c50f8b310601a242b3bf1653de36286d5926263
parent 95ca8695e0ab7d0c6fc5faff7869ad6e6478fcc2
Author: triesap <137732411+triesap@users.noreply.github.com>
Date: Mon, 16 Sep 2024 12:53:55 +0000
Add `stylesheets` submodule, edit package.json scripts, update environment variables
Diffstat:
15 files changed, 38 insertions(+), 365 deletions(-)
diff --git a/.env.example b/.env.example
@@ -1,5 +1,5 @@
-PUBLIC_NOSTR_RELAY_DEFAULTS=
PUBLIC_DATABASE_NAME=
+PUBLIC_NOSTR_RELAY_DEFAULTS=
VITE_PUBLIC_KV_NAME=
VITE_PUBLIC_NDK_CACHE_NAME=
-VITE_PUBLIC_NDK_CLIENT_NAME=
-\ No newline at end of file
+VITE_PUBLIC_NDK_CLIENT_NAME=
diff --git a/.gitmodules b/.gitmodules
@@ -4,3 +4,6 @@
[submodule "static/phosphor-icons"]
path = static/phosphor-icons
url = git@github.com:72-61-64-72-6f-6f-74-73/phosphor-icons.git
+[submodule "static/stylesheets"]
+ path = static/stylesheets
+ url = git@github.com:72-61-64-72-6f-6f-74-73/stylesheets.git
diff --git a/package.json b/package.json
@@ -4,16 +4,21 @@
"private": true,
"license": "GPLv3",
"scripts": {
- "build": "just build && vite build",
- "build:native": "npm run build",
- "build:web": "npm run build",
- "build:sql:wasm": "rsync -u node_modules/sql.js/dist/sql-wasm.wasm static/",
+ "build:dev": "vite build --mode development",
+ "build:prod": "vite build --mode production",
+ "build:native": "npm run gen && npm run sql-wasm:rm && npm run build:prod",
+ "build:web": "npm run gen && npm run sql-wasm:cp && npm run build:prod",
"dev": "",
- "dev:web": "vite dev --debug hmr",
- "dev:native": "vite dev --debug hmr",
+ "dev:native": "npm run gen && npm run sql-wasm:rm && npm run serve:dev",
+ "dev:web": "npm run gen && npm run sql-wasm:cp && npm run serve:dev",
+ "serve:prod": "vite dev --mode production",
+ "serve:dev": "vite dev --mode development --debug hmr",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
- "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
+ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+ "sql-wasm:cp": "rsync -u node_modules/sql.js/dist/sql-wasm.wasm static/assets",
+ "sql-wasm:rm": "rm -rf static/assets/sql-wasm.wasm",
+ "gen": ""
},
"devDependencies": {
"@capacitor/cli": "^6.1.2",
diff --git a/src/app.css b/src/app.css
@@ -1,7 +1,7 @@
-@import "./lib/css/form.css";
-@import "./lib/css/spinner.css";
-@import "./lib/css/spinner-6.css";
-@import "./lib/css/spinner-12.css";
+@import "/static/stylesheets/tailwindcss-app.css";
+@import "/static/stylesheets/tailwindcss-app-form.css";
+@import "/static/stylesheets/tailwindcss-spinner.css";
+
@import "/static/webfonts/apercu-mono-pro/styles.css";
@import "/static/webfonts/sf-pro-display/styles.css";
@import "/static/webfonts/magda-text/styles.css";
@@ -9,137 +9,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
-
-@layer components {
- .font-mono-display {
- @apply font-mono tracking-tighter;
- }
-
- .map-marker-popup-simple-open {
- @apply h-40 w-72;
- }
-
- .nobg {
- @apply bg-transparent;
- }
-
- .form-input-invalid {
- @apply outline outline-[2px] outline-red-300/70;
- }
-
- .tap-scale {
- @apply active:scale-[94%];
- }
-
- .tap-scale,
- .tap-color {
- @apply active:opacity-80 transition-all;
- }
-
- .input-simple {
- @apply input flex flex-row w-full h-fit p-0 border-0 focus:border-0 outline-0 focus:outline-0 placeholder:font-[300] bg-layer-1-surface font-mono text-sm text-layer-2-glyph;
- }
-
- .button-submit {
- @apply h-[34px] min-w-[82px] w-fit rounded-xl active:bg-layer-1-surface_a;
- }
-
- .button-simple {
- @apply h-line w-line;
- }
-
- .button-base
- .button-simple,
- .button-submit {
- @apply flex flex-row justify-center items-center font-mono text-sm lowercase transition-all select-none cursor-none;
- }
-
- .button-simple,
- .button-submit {
- @apply bg-layer-1-surface text-layer-2-glyph;
- }
-
- .flex-fill {
- width: 100%;
- height: 100%;
- flex: 1 0 100%;
- }
-
- .scroll-hide::-webkit-scrollbar {
- display: none;
- }
-
- .scroll-hide {
- -ms-overflow-style: none;
- scrollbar-width: none;
- }
-
- @keyframes fade-in {
- from {
- opacity: 0;
- }
-
- to {
- opacity: 1;
- }
- }
-
- .fade-in {
- opacity: 0;
- animation: fade-in 250ms ease-in-out forwards;
- }
-
- .active-ring-blue {
- @apply active:ring-4 active:ring-slate-300/70;
- }
-
- .active-ring-gray {
- @apply active:ring-4 active:ring-stone-200/60;
- }
-
- .active-op {
- @apply active:opacity-60;
- }
-
- .tap-rise {
- @apply active:scale-[102%] group-active:scale-[102%] delay-[150ms] duration-[400ms] ease-in-out transition-all;
- }
-
- .tap-in {
- @apply active:scale-[97%] group-active:scale-[97%] delay-[150ms] duration-[300ms] ease-in-out transition-all;
- }
-}
-
-@layer base {
- :root {
- background-color: hsl(var(--layer-0-surface));
- }
-
- html {
- @apply select-none cursor-none;
- }
-
- select:focus {
- outline: none;
- }
-
- button:focus {
- outline: none;
- }
-
- select {
- appearance: none;
- -webkit-appearance: none;
- -moz-appearance: none;
- background: transparent;
- background-image: none;
- }
-
- select::-ms-expand {
- display: none;
- }
-
- div:focus {
- outline: 4px solid transparent;
- }
-}
-\ No newline at end of file
diff --git a/src/app.html b/src/app.html
@@ -8,7 +8,7 @@
<link rel="stylesheet" type="text/css" href="/phosphor-icons/fill.css" />
<link rel="stylesheet" type="text/css" href="/phosphor-icons/light.css" />
<link rel="stylesheet" type="text/css" href="/phosphor-icons/regular.css" />
- <link rel="stylesheet" type="text/css" href="/styles/maplibre_gl.css" />
+ <link rel="stylesheet" type="text/css" href="/stylesheets/maplibre-gl.css" />
<script src="/assets/keyva.min.js"></script>
diff --git a/src/lib/css/form.css b/src/lib/css/form.css
@@ -1,26 +0,0 @@
-@layer components {
- .form-invalid-layer-1 {
- @apply bg-red-300;
- }
-
- .form-line-select {
- @apply h-full w-full rounded-2xl;
- }
-
- .form-line-active {
- @apply focus:outline-[4px] focus:outline-gray-400/30;
- }
-
- .form-line-wrap {
- @apply flex flex-row h-form_line w-full rounded-2xl;
- }
-
- .form-input {
- @apply input w-full p-0 pl-2 placeholder:font-[400];
- }
-
- .form-select,
- .form-input {
- @apply flex flex-row justify-center items-center border-0 focus:border-0 outline-0 focus:outline-0 bg-transparent;
- }
-}
-\ No newline at end of file
diff --git a/src/lib/css/spinner-12.css b/src/lib/css/spinner-12.css
@@ -1,89 +0,0 @@
-@layer base {
- .spinner12 {
- position: relative;
- display: inline-block;
- width: 1em;
- height: 1em;
- }
-
- .spinner12.center {
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
- margin: auto;
- }
-
- .spinner12 .spinner12-blade {
- position: absolute;
- left: 0.4629em;
- bottom: 0;
- width: 0.074em;
- height: 0.2777em;
- border-radius: 0.0555em;
- background-color: transparent;
- transform-origin: center -0.2222em;
- animation: spinner-fade-base 1s infinite linear;
- }
-
- .spinner12 .spinner12-blade:nth-child(1) {
- animation-delay: 0s;
- transform: rotate(0deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(2) {
- animation-delay: 0.083s;
- transform: rotate(30deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(3) {
- animation-delay: 0.166s;
- transform: rotate(60deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(4) {
- animation-delay: 0.249s;
- transform: rotate(90deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(5) {
- animation-delay: 0.332s;
- transform: rotate(120deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(6) {
- animation-delay: 0.415s;
- transform: rotate(150deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(7) {
- animation-delay: 0.498s;
- transform: rotate(180deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(8) {
- animation-delay: 0.581s;
- transform: rotate(210deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(9) {
- animation-delay: 0.664s;
- transform: rotate(240deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(10) {
- animation-delay: 0.747s;
- transform: rotate(270deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(11) {
- animation-delay: 0.83s;
- transform: rotate(300deg);
- }
-
- .spinner12 .spinner12-blade:nth-child(12) {
- animation-delay: 0.913s;
- transform: rotate(330deg);
- }
-}
-\ No newline at end of file
diff --git a/src/lib/css/spinner-6.css b/src/lib/css/spinner-6.css
@@ -1,59 +0,0 @@
-@layer base {
- .spinner6 {
- position: relative;
- display: inline-block;
- width: 1em;
- height: 1em;
- }
-
- .spinner6.center {
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
- margin: auto;
- }
-
- .spinner6 .spinner6-blade {
- position: absolute;
- left: 0.4629em;
- bottom: 0;
- width: 0.074em;
- height: 0.2777em;
- border-radius: 0.0555em;
- background-color: transparent;
- transform-origin: center -0.2222em;
- animation: spinner-fade-base 1s infinite linear;
- }
-
- .spinner6 .spinner6-blade:nth-child(1) {
- animation-delay: 0s;
- transform: rotate(0deg);
- }
-
- .spinner6 .spinner6-blade:nth-child(2) {
- animation-delay: 0.1s;
- transform: rotate(60deg);
- }
-
- .spinner6 .spinner6-blade:nth-child(3) {
- animation-delay: 0.2s;
- transform: rotate(120deg);
- }
-
- .spinner6 .spinner6-blade:nth-child(4) {
- animation-delay: 0.3s;
- transform: rotate(180deg);
- }
-
- .spinner6 .spinner6-blade:nth-child(5) {
- animation-delay: 0.4s;
- transform: rotate(240deg);
- }
-
- .spinner6 .spinner6-blade:nth-child(6) {
- animation-delay: 0.5s;
- transform: rotate(300deg);
- }
-}
-\ No newline at end of file
diff --git a/src/lib/css/spinner.css b/src/lib/css/spinner.css
@@ -1,19 +0,0 @@
-@layer base {
- @keyframes spinner-fade-white {
- 0% {
- background-color: white;
- }
- 100% {
- background-color: transparent;
- }
- }
-
- @keyframes spinner-fade-base {
- 0% {
- background-color: hsl(var(--layer-2-glyph));
- }
- 100% {
- background-color: transparent;
- }
- }
-}
-\ No newline at end of file
diff --git a/src/lib/stores.ts b/src/lib/stores.ts
@@ -1,6 +1,11 @@
+import type { ColorMode, ThemeKey } from "@radroots/theme";
import { type NumberTuple } from "@radroots/utils";
import { writable } from "svelte/store";
+export const app_tok = writable<string>('');
+export const app_thc = writable<ColorMode>(`light`);
+export const app_th = writable<ThemeKey>(`earth`);
+
export const app_nostr_key = writable<string>(``);
export const app_pwa_polyfills = writable<boolean>(false);
export const app_sqlite = writable<boolean>(false);
diff --git a/src/routes/(app)/settings/+page.svelte b/src/routes/(app)/settings/+page.svelte
@@ -1,10 +1,10 @@
<script lang="ts">
import { lc } from "$lib/client";
import { _cf } from "$lib/conf";
+ import { app_thc } from "$lib/stores";
import { restart } from "$lib/utils";
import {
app_tabs_visible,
- app_thc,
LayoutTrellis,
LayoutView,
Nav,
diff --git a/src/routes/(map)/map/+page.svelte b/src/routes/(map)/map/+page.svelte
@@ -2,7 +2,8 @@
import { lc } from "$lib/client";
import MapControlFull from "$lib/components/map_control_full.svelte";
import { _cf } from "$lib/conf";
- import { app_thc, Fill, LoadingView, sleep } from "@radroots/svelte-lib";
+ import { app_thc } from "$lib/stores";
+ import { Fill, LoadingView, sleep } from "@radroots/svelte-lib";
import { MapLibre, Marker, Popup } from "@radroots/svelte-maplibre";
import { type NumberTuple } from "@radroots/utils";
import { onMount } from "svelte";
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -7,12 +7,16 @@
} from "$env/static/public";
import { lc } from "$lib/client";
import { _cf } from "$lib/conf";
- import { app_nostr_key, app_pwa_polyfills, app_sqlite } from "$lib/stores";
import {
- app_config,
- app_render,
+ app_nostr_key,
+ app_pwa_polyfills,
+ app_sqlite,
app_th,
app_thc,
+ } from "$lib/stores";
+ import {
+ app_config,
+ app_render,
AppConfig,
CssStatic,
kv,
diff --git a/static/styles/maplibre_gl.css b/static/styles/maplibre_gl.css
@@ -1,13 +0,0 @@
-.maplibregl-popup-tip {
- display: none !important;
-}
-
-.maplibregl-popup-content {
- background: hsl(var(--layer-1-surface)) !important;
- border-radius: 16px !important;
- box-shadow: 0 4px 8px rgba(0,0,0,.2) !important;
- padding: 0px !important;
- transition: background-color 250ms ease-in-out !important;
-}
-
-
diff --git a/static/stylesheets b/static/stylesheets
@@ -0,0 +1 @@
+Subproject commit 43fcdf6a1f1df99bcc948478824902c89535aa7d
