From 94e3fb29be60da9dea081f1cc93cdc49d788c38e Mon Sep 17 00:00:00 2001 From: intergrav Date: Thu, 11 Jul 2024 21:04:15 -0400 Subject: [PATCH] chore: prettier --- .github/workflows/pages.yml | 2 +- README.md | 9 +++++---- theme/boilerplate.css | 30 +++++++++++++++--------------- theme/night.css | 24 ++++++++++++------------ theme/terminal.css | 30 +++++++++++++++--------------- 5 files changed, 48 insertions(+), 47 deletions(-) diff --git a/.github/workflows/pages.yml b/.github/workflows/pages.yml index db4f62f..b8537d2 100644 --- a/.github/workflows/pages.yml +++ b/.github/workflows/pages.yml @@ -37,7 +37,7 @@ jobs: uses: actions/upload-pages-artifact@v3 with: # Upload entire repository - path: '.' + path: "." - name: Deploy to GitHub Pages id: deployment uses: actions/deploy-pages@v4 diff --git a/README.md b/README.md index b0c7e02..23ed6ef 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ Extremely simple, small, classless CSS framework in the style of Vercel's Geist. Inspired by [xz/new.css](https://github.com/xz/new.css). -The minified stylesheet weighs only **~5kb** and can make any plain HTML file look clean and modern. +The minified stylesheet weighs only **~5kb** and can make any plain HTML file look clean and modern. It has a light and dark theme, and the header turns into a sidebar on wider displays so that you get more vertical space. @@ -57,7 +57,7 @@ For a link button, you can wrap the button in an `` tag. Here's a code exampl ```html - + ``` @@ -67,8 +67,8 @@ The `
` element can make a toggle-able dropdown without using any JavaSc ```html
- Click me! -

Lorem ipsum dolor sit amet.

+ Click me! +

Lorem ipsum dolor sit amet.

``` @@ -79,6 +79,7 @@ To learn about other HTML elements and how to write HTML, visit [W3Schools/html] ## Themes You can use custom colors and custom fonts in dev.css through themes. See the `/theme` folder to view some premade ones. You can also copy the `boilerplate.css` and make a theme yourself. Simply apply it after the dev.css stylesheet. For example, to apply the terminal theme, put this after your main stylesheet: + ```html ``` diff --git a/theme/boilerplate.css b/theme/boilerplate.css index b625c00..1cc5c1e 100644 --- a/theme/boilerplate.css +++ b/theme/boilerplate.css @@ -1,19 +1,19 @@ /* This theme is a template that you can modify */ :root { - /* Fonts */ - --dc-font-sans: sans-serif; /* Sans Serif */ - --dc-font-mono: monospace; /* Monospace */ - /* Colors */ - --dc-tx-1: #000000; /* Primary text */ - --dc-tx-2: #1a1a1a; /* Secondary text */ - --dc-bg-1: #fafafa; /* Main background */ - --dc-bg-2: #fff; /* Secondary background */ - --dc-bg-3: #ebebeb; /* Outlines */ - --dc-lk-1: #0068d6; /* Link text */ - --dc-lkb-1: #0072f5; /* Link button background */ - --dc-lkb-2: #0062d1; /* Link button background (hover) */ - --dc-lkb-tx: #ededed; /* Link button text */ - --dc-ac-1: #8e4ec6; /* Accent color */ - --dc-ac-tx: #ededed; /* Accent color text */ + /* Fonts */ + --dc-font-sans: sans-serif; /* Sans Serif */ + --dc-font-mono: monospace; /* Monospace */ + /* Colors */ + --dc-tx-1: #000000; /* Primary text */ + --dc-tx-2: #1a1a1a; /* Secondary text */ + --dc-bg-1: #fafafa; /* Main background */ + --dc-bg-2: #fff; /* Secondary background */ + --dc-bg-3: #ebebeb; /* Outlines */ + --dc-lk-1: #0068d6; /* Link text */ + --dc-lkb-1: #0072f5; /* Link button background */ + --dc-lkb-2: #0062d1; /* Link button background (hover) */ + --dc-lkb-tx: #ededed; /* Link button text */ + --dc-ac-1: #8e4ec6; /* Accent color */ + --dc-ac-tx: #ededed; /* Accent color text */ } diff --git a/theme/night.css b/theme/night.css index 1e14d6c..ab05068 100644 --- a/theme/night.css +++ b/theme/night.css @@ -1,16 +1,16 @@ /* This theme will make it always dark, regardless of device setting */ :root { - /* Colors */ - --dc-tx-1: #ededed; - --dc-tx-2: #a1a1a1; - --dc-bg-1: #000; - --dc-bg-2: #ffffff0f; - --dc-bg-3: #ffffff24; - --dc-lk-1: #52a8ff; - --dc-lkb-1: #0072f5; - --dc-lkb-2: #0062d1; - --dc-lkb-tx: #ededed; - --dc-ac-1: #8e4ec6; - --dc-ac-tx: #ededed; + /* Colors */ + --dc-tx-1: #ededed; + --dc-tx-2: #a1a1a1; + --dc-bg-1: #000; + --dc-bg-2: #ffffff0f; + --dc-bg-3: #ffffff24; + --dc-lk-1: #52a8ff; + --dc-lkb-1: #0072f5; + --dc-lkb-2: #0062d1; + --dc-lkb-tx: #ededed; + --dc-ac-1: #8e4ec6; + --dc-ac-tx: #ededed; } diff --git a/theme/terminal.css b/theme/terminal.css index fe7acd3..8bd999c 100644 --- a/theme/terminal.css +++ b/theme/terminal.css @@ -3,19 +3,19 @@ @import url("https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist-mono.min.css"); :root { - /* Fonts */ - --dc-font-sans: "Geist Mono", monospace; - --dc-font-mono: "Geist Mono", monospace; - /* Colors */ - --dc-tx-1: #ffffff; - --dc-tx-2: #eeeeee; - --dc-bg-1: #000000; - --dc-bg-2: #002700; - --dc-bg-3: #005800; - --dc-lk-1: #00ff00; - --dc-lkb-1: #00ff00; - --dc-lkb-2: #00d400; - --dc-lkb-tx: #000000; - --dc-ac-1: #00ff00; - --dc-ac-tx: #000000; + /* Fonts */ + --dc-font-sans: "Geist Mono", monospace; + --dc-font-mono: "Geist Mono", monospace; + /* Colors */ + --dc-tx-1: #ffffff; + --dc-tx-2: #eeeeee; + --dc-bg-1: #000000; + --dc-bg-2: #002700; + --dc-bg-3: #005800; + --dc-lk-1: #00ff00; + --dc-lkb-1: #00ff00; + --dc-lkb-2: #00d400; + --dc-lkb-tx: #000000; + --dc-ac-1: #00ff00; + --dc-ac-tx: #000000; } -- 2.51.2