Merge pull request #26 from nstringham/prettier

add continuous integration for Prettier

Author: Yohn

.editorconfig

@@ -5,7 +5,7 @@ root = true
 
 # Unix-style newlines with a newline ending every file
 [*]
-end_of_line = crlf
+end_of_line = lf
 insert_final_newline = true
 charset = utf-8
 trim_trailing_whitespace = true

.github/CONTRIBUTING.md

@@ -4,9 +4,10 @@ Thanks for your interest in contributing to Pico CSS! Please take a moment to re
 
 ## Bug reports
 
-The [issue tracker]((https://github.com/Yohn/PicoCSS/issues)) is the preferred channel for bug reports, but please respect the following restrictions:
+The [issue tracker](<(https://github.com/Yohn/PicoCSS/issues)>) is the preferred channel for bug reports, but please respect the following restrictions:
+
 - Please do not use the issue tracker for personal support requests. [Open a question in our discussion forums](https://github.com/Yohn/PicoCSS/discussions/categories/help) instead.
-- Please do not use the issue tracker for feature requests.  Instead, use our discussion forums to [suggest any ideas](https://github.com/Yohn/PicoCSS/discussions/categories/ideas) you have.
+- Please do not use the issue tracker for feature requests. Instead, use our discussion forums to [suggest any ideas](https://github.com/Yohn/PicoCSS/discussions/categories/ideas) you have.
 
 ## Pull requests
 

.github/FUNDING.yml

@@ -12,4 +12,4 @@ github: [Yohn] # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [u
 #polar: # Replace with a single Polar username
 #buy_me_a_coffee: # Replace with a single Buy Me a Coffee username
 #thanks_dev: # Replace with a single thanks.dev username
-custom: ['http://cash.me/$yohnjohn84'] # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']
+custom: ["http://cash.me/$yohnjohn84"] # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']

.github/ISSUE_TEMPLATE/bug_report.md

@@ -4,18 +4,22 @@ about: Create a bug report if you've already asked for help with a problem and c
 ---
 
 Please search for duplicate or closed issues first.
-  
+
 ## Describe the issue
-  
+
 ### Current Behavior
+
 A concise description of the bug.
 
 ### Expected Behavior
+
 A concise description of what you expected.
 
 ### Reproduction URL
+
 We recommend including a link to a minimal reproduction of the bug using CodePen or a similar tool.
 **Please do not link to your actual project.** Instead, we need a reduced test case in a new project without any unnecessary code.
 
 ### Environment
+
 Example: OS, versions, browser details.

.github/workflows/BuildCSS.yml

@@ -0,0 +1,53 @@
+name: Continues Integration
+
+on:
+  - push
+  - pull_request
+  - workflow_dispatch
+
+jobs:
+  prettier:
+    name: Prettier
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Prettier Check
+        run: npx prettier -c .
+
+  build:
+    name: Build CSS
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build CSS
+        run: npm run build
+
+      - name: Commit and push changes
+        uses: stefanzweifel/git-auto-commit-action@v5
+        with:
+          commit_message: Build CSS

.github/workflows/continues-integration.yml

@@ -0,0 +1,2 @@
+/css/
+/docs/*.css

.prettierignore

@@ -1,3 +1,4 @@
 {
-  "printWidth": 100
+  "printWidth": 100,
+  "endOfLine": "auto"
 }

.prettierrc

@@ -11,9 +11,11 @@
 [![Github release](https://img.shields.io/github/v/release/Yohn/PicoCSS?color=0172.ad&logo=github&logoColor=white)](https://github.com/Yohn/PicoCSS/releases/latest)
 [![npm version](https://img.shields.io/npm/v/@yohns/picocss?color=0172ad)](https://www.npmjs.com/package/@yohns/picocss)
 [![License](https://img.shields.io/badge/license-MIT-%230172ad)](https://github.com/Yohn/PicoCSS/blob/master/LICENSE.md)
+
 <!-- [![Twitter URL](https://img.shields.io/twitter/url/https/twitter.com/picocss.svg?style=social&label=Follow%20%40picocss)](https://twitter.com/picocss) -->
 
 ## Yohns Updated Version
+
 I'm not sure if the original [Pico CSS](https://github.com/picocss/pico) repository is abandoned or not, but I really liked what they had to offer, and wanted to help not let this awesomely simple and easy to use front end framework disappear, so I merged as many of open pull requests that fixed some issues, and / or enhanced the project that were available at the time. I'll try to help keep it viable and do some bug fixes if any arise, and would alway appreciate anyone elses help to continue keeping this alive!
 
 You can see the new features I, and many others have created pull requests for by going to [Yohns Pico CSS](https://yohn.github.io/PicoCSS). This page just has the demos of most of the features I have merged, or added to the project.
@@ -85,6 +87,7 @@ Alternatively, you can use [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@
 ```shell
 npm i @yohns/picocss
 ```
+
 <!--
 Or
 

README.md

@@ -199,19 +199,19 @@ input:not([type=submit],
   color-scheme: light;
   --pico-background-color: #fff;
   --pico-color: #373c44;
-  --pico-text-selection-color: rgba(129, 145, 181, 0.25);
+  --pico-text-selection-color: rgba(158, 146, 0, 0.25);
   --pico-muted-color: #646b79;
   --pico-muted-border-color: rgb(231, 234, 239.5);
-  --pico-primary: #5d6b89;
-  --pico-primary-background: #525f7a;
+  --pico-primary: #756b00;
+  --pico-primary-background: #f2df0d;
   --pico-primary-border: var(--pico-primary-background);
-  --pico-primary-underline: rgba(93, 107, 137, 0.5);
-  --pico-primary-hover: #48536b;
-  --pico-primary-hover-background: #48536b;
+  --pico-primary-underline: rgba(117, 107, 0, 0.5);
+  --pico-primary-hover: #5b5300;
+  --pico-primary-hover-background: #e8d600;
   --pico-primary-hover-border: var(--pico-primary-hover-background);
   --pico-primary-hover-underline: var(--pico-primary-hover);
-  --pico-primary-focus: rgba(129, 145, 181, 0.5);
-  --pico-primary-inverse: #fff;
+  --pico-primary-focus: rgba(158, 146, 0, 0.5);
+  --pico-primary-inverse: #000;
   --pico-secondary: #5d6b89;
   --pico-secondary-background: #525f7a;
   --pico-secondary-border: var(--pico-secondary-background);
@@ -275,7 +275,7 @@ input:not([type=submit],
   --pico-switch-background-color: #bfc7d9;
   --pico-switch-checked-background-color: var(--pico-primary-background);
   --pico-switch-color: #fff;
-  --pico-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+  --pico-switch-thumb-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.25);
   --pico-range-border-color: #dfe3eb;
   --pico-range-active-border-color: #bfc7d9;
   --pico-range-thumb-border-color: var(--pico-background-color);
@@ -305,12 +305,12 @@ input:not([type=submit],
 [data-theme=light] details summary[role=button]::after,
 :root:not([data-theme=dark]) details summary[role=button]::after,
 :host(:not([data-theme=dark])) details summary[role=button]::after {
-  filter: brightness(100) invert(0);
+  filter: brightness(100) invert(1);
 }
 [data-theme=light] [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before,
 :root:not([data-theme=dark]) [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before,
 :host(:not([data-theme=dark])) [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before {
-  filter: brightness(100) invert(0);
+  filter: brightness(0) invert(1);
 }
 [data-theme=light] input:is([type=submit],
 [type=button],
@@ -339,19 +339,19 @@ input:not([type=submit],
     color-scheme: dark;
     --pico-background-color: rgb(19, 22.5, 30.5);
     --pico-color: #c2c7d0;
-    --pico-text-selection-color: rgba(144, 158, 190, 0.1875);
+    --pico-text-selection-color: rgba(173, 159, 0, 0.1875);
     --pico-muted-color: #7b8495;
     --pico-muted-border-color: #202632;
-    --pico-primary: #909ebe;
-    --pico-primary-background: #525f7a;
+    --pico-primary: #ad9f00;
+    --pico-primary-background: #f2df0d;
     --pico-primary-border: var(--pico-primary-background);
-    --pico-primary-underline: rgba(144, 158, 190, 0.5);
-    --pico-primary-hover: #b0b9d0;
-    --pico-primary-hover-background: #5d6b89;
+    --pico-primary-underline: rgba(173, 159, 0, 0.5);
+    --pico-primary-hover: #caba01;
+    --pico-primary-hover-background: rgb(247.5, 232, 96.5);
     --pico-primary-hover-border: var(--pico-primary-hover-background);
     --pico-primary-hover-underline: var(--pico-primary-hover);
-    --pico-primary-focus: rgba(144, 158, 190, 0.375);
-    --pico-primary-inverse: #fff;
+    --pico-primary-focus: rgba(173, 159, 0, 0.375);
+    --pico-primary-inverse: #000;
     --pico-secondary: #969eaf;
     --pico-secondary-background: #525f7a;
     --pico-secondary-border: var(--pico-secondary-background);
@@ -415,7 +415,7 @@ input:not([type=submit],
     --pico-switch-background-color: #333c4e;
     --pico-switch-checked-background-color: var(--pico-primary-background);
     --pico-switch-color: #fff;
-    --pico-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+    --pico-switch-thumb-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.25);
     --pico-range-border-color: #202632;
     --pico-range-active-border-color: #2a3140;
     --pico-range-thumb-border-color: var(--pico-background-color);
@@ -458,30 +458,30 @@ input:not([type=submit],
   }
   :root:not([data-theme]) details summary[role=button]::after,
   :host(:not([data-theme])) details summary[role=button]::after {
-    filter: brightness(100) invert(0);
+    filter: brightness(100) invert(1);
   }
   :root:not([data-theme]) [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before,
   :host(:not([data-theme])) [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before {
-    filter: brightness(100) invert(1);
+    filter: brightness(100) invert(0);
   }
 }
 [data-theme=dark] {
   color-scheme: dark;
   --pico-background-color: rgb(19, 22.5, 30.5);
   --pico-color: #c2c7d0;
-  --pico-text-selection-color: rgba(144, 158, 190, 0.1875);
+  --pico-text-selection-color: rgba(173, 159, 0, 0.1875);
   --pico-muted-color: #7b8495;
   --pico-muted-border-color: #202632;
-  --pico-primary: #909ebe;
-  --pico-primary-background: #525f7a;
+  --pico-primary: #ad9f00;
+  --pico-primary-background: #f2df0d;
   --pico-primary-border: var(--pico-primary-background);
-  --pico-primary-underline: rgba(144, 158, 190, 0.5);
-  --pico-primary-hover: #b0b9d0;
-  --pico-primary-hover-background: #5d6b89;
+  --pico-primary-underline: rgba(173, 159, 0, 0.5);
+  --pico-primary-hover: #caba01;
+  --pico-primary-hover-background: rgb(247.5, 232, 96.5);
   --pico-primary-hover-border: var(--pico-primary-hover-background);
   --pico-primary-hover-underline: var(--pico-primary-hover);
-  --pico-primary-focus: rgba(144, 158, 190, 0.375);
-  --pico-primary-inverse: #fff;
+  --pico-primary-focus: rgba(173, 159, 0, 0.375);
+  --pico-primary-inverse: #000;
   --pico-secondary: #969eaf;
   --pico-secondary-background: #525f7a;
   --pico-secondary-border: var(--pico-secondary-background);
@@ -545,7 +545,7 @@ input:not([type=submit],
   --pico-switch-background-color: #333c4e;
   --pico-switch-checked-background-color: var(--pico-primary-background);
   --pico-switch-color: #fff;
-  --pico-switch-thumb-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+  --pico-switch-thumb-box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.25);
   --pico-range-border-color: #202632;
   --pico-range-active-border-color: #2a3140;
   --pico-range-thumb-border-color: var(--pico-background-color);
@@ -581,10 +581,10 @@ input:not([type=submit],
   --pico-form-element-focus-color: var(--pico-primary-focus);
 }
 [data-theme=dark] details summary[role=button]::after {
-  filter: brightness(100) invert(0);
+  filter: brightness(100) invert(1);
 }
 [data-theme=dark] [aria-busy=true]:not(input, select, textarea, html, form):is(button, [type=submit], [type=button], [type=reset], [role=button])::before {
-  filter: brightness(100) invert(1);
+  filter: brightness(100) invert(0);
 }
 
 progress,