feat: full rewrite of the project (#23)

- Refactor project structure and architecture
- Update dependencies
- Implement new features and improvements
- Clean up legacy code and remove deprecated components

Author: Sarmaged

.browserslistrc

@@ -0,0 +1,4 @@
+> 0.1%
+last 2 versions
+not dead
+IE > 5

.github/workflows/notify.yml

@@ -1,34 +1,19 @@
 name: Notify
 
 on:
-  pull_request:
-    types: [closed]
+  push:
+    branches:
+      - main
 
 jobs:
   notify:
-    if: github.event.pull_request.merged == true && contains(github.event.pull_request.labels.*.name, 'release')
     runs-on: ubuntu-latest
 
     steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Determine version update type
-        id: determine_version
-        run: |
-          COMMIT_MESSAGE=$(git log -1 --pretty=format:%B)
-          if [[ "$COMMIT_MESSAGE" == *"[major]"* ]]; then
-            echo "update_type=major" >> $GITHUB_ENV
-          elif [[ "$COMMIT_MESSAGE" == *"[minor]"* ]]; then
-            echo "update_type=minor" >> $GITHUB_ENV
-          else
-            echo "update_type=patch" >> $GITHUB_ENV
-          fi
-
-      - name: Send notification to style-forge
+      - name: Send notification
         run: |
           curl -X POST \
             -H "Accept: application/vnd.github.v3+json" \
             -H "Authorization: token ${{ secrets.NOTIFY_GITHUB_TOKEN }}" \
             https://api.github.com/repos/Style-Forge/hub/dispatches \
-            -d '{"event_type":"update-style-forge", "client_payload": {"update_type": "${{ env.update_type }}", "package_name": "style-forge.base"}}'
+            -d '{"event_type":"update-style-forge", "client_payload": {"package_name": "style-forge.base"}}'

.github/workflows/publish.yml

@@ -1,12 +1,12 @@
 name: Publish
 
 on:
-  pull_request:
-    types: [closed]
+  push:
+    tags:
+      - '*.*.*'
 
 jobs:
   publish:
-    if: github.event.pull_request.merged == true && contains(github.event.pull_request.labels.*.name, 'release')
     runs-on: ubuntu-latest
 
     steps:

.github/workflows/release.yml

@@ -1,16 +1,17 @@
 name: Release
 
 on:
-  push:
-    tags:
-      - 'v*.*.*'
+  pull_request:
+    types: [closed]
+    branches:
+      - main
 
 permissions:
   contents: write
-  pull-requests: write
 
 jobs:
   release:
+    if: github.event.pull_request.merged == true
     runs-on: ubuntu-latest
 
     steps:
@@ -26,57 +27,19 @@ jobs:
       - name: Install dependencies
         run: yarn install --frozen-lockfile
 
-      - name: Configure Git
+      - name: Extract version from package.json
+        id: extract_version
         run: |
-          git config --global user.name 'github-actions'
-          git config --global user.email '[email protected]'
-
-      - name: Fetch all tags
-        run: git fetch --tags
-
-      - name: Extract version and previous tag
-        id: extract_info
-        run: |
-          VERSION=${GITHUB_REF#refs/tags/v}
-          PREVIOUS_TAG=$(git describe --tags $(git rev-list --tags --skip=1 --max-count=1))
+          VERSION=$(jq -r '.version' package.json)
           echo "VERSION=$VERSION" >> $GITHUB_ENV
-          echo "PREVIOUS_TAG=$PREVIOUS_TAG" >> $GITHUB_ENV
-
-      - name: Determine update type
-        id: determine_update_type
-        run: |
-          IFS='.' read -r -a NEW_VERSION_PARTS <<< "${VERSION}"
-          IFS='.' read -r -a OLD_VERSION_PARTS <<< "${PREVIOUS_TAG#v}"
-
-          if [ "${NEW_VERSION_PARTS[0]}" != "${OLD_VERSION_PARTS[0]}" ]; then
-            UPDATE_TYPE=major
-          elif [ "${NEW_VERSION_PARTS[1]}" != "${OLD_VERSION_PARTS[1]}" ]; then
-            UPDATE_TYPE=minor
-          else
-            UPDATE_TYPE=patch
-          fi
-          echo "UPDATE_TYPE=$UPDATE_TYPE" >> $GITHUB_ENV
 
-      - name: Create and push new branch
+      - name: Create Git tag
         run: |
-          NEW_BRANCH=release-v${VERSION}
-          git checkout -b ${NEW_BRANCH}
-          git push origin ${NEW_BRANCH}
-          echo "NEW_BRANCH=$NEW_BRANCH" >> $GITHUB_ENV
-
-      - name: Update version in package.json
-        run: jq --arg new_version "$VERSION" '.version = $new_version' package.json > temp.json && mv temp.json package.json
+          git tag -a "$VERSION" -m "Release $VERSION"
+          git push origin "$VERSION"
 
       - name: Build the package
         run: yarn build
 
-      - name: Create Pull Request
-        uses: peter-evans/create-pull-request@v6
-        with:
-          token: ${{ secrets.GITHUB_TOKEN }}
-          commit-message: "Update version to ${{ env.VERSION }} [${{ env.UPDATE_TYPE }}] and upgrade dependencies"
-          branch: ${{ env.NEW_BRANCH }}
-          base: main
-          title: "Release ${{ env.VERSION }}"
-          body: "This PR updates the version to ${{ env.VERSION }} and upgrades dependencies."
-          labels: release
+      - name: Notify release
+        run: echo "Release ${{ env.VERSION }} has been successfully created."

builder.js

@@ -9,7 +9,7 @@ const [from, to] = ['src/all.css', 'base.css']
 const css = fs.readFileSync(from, 'utf8')
 
 const packageFile = JSON.parse(fs.readFileSync('package.json', 'utf8'))
-const title = packageFile.name + ' v' + packageFile.version
+const title = packageFile.name + ' ' + packageFile.version
 const license = packageFile.license + ' License'
 const link = packageFile.repository.url.replace('git+', '').replace('.git', '')
 const header = '/*! ' + [title, license, link].join(' | ') + ' */'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "style-forge.base",
-  "version": "5.3.6",
+  "version": "2025.01.03",
   "description": "Style-Forge.Base: foundational CSS variables, base styles, typography, colors, utilities for consistent design.",
   "type": "module",
   "main": "base.css",

src/form.css

@@ -1,4 +1,3 @@
-::file-selector-button,
 button,
 input,
 optgroup,
@@ -12,57 +11,97 @@ textarea
   line-height: 1;
 
   text-transform: none;
+  vertical-align: top;
 }
 
-button,
-:where(input:not(
-  [type='checkbox'],
-  [type='color'],
-  [type='file'],
-  [type='hidden'],
-  [type='image'],
-  [type='radio'],
-  [type='range']
-)),
-optgroup,
-option,
 select,
+button,
+input,
 textarea
-{ padding: 0.25em 0.5em }
-
-::file-selector-button,
-:where(button, select),
-:where(input):where(
-  [type='button'],
-  [type='checkbox'],
-  [type='color'],
-  [type='file'],
-  [type='image'],
-  [type='radio'],
-  [type='range'],
-  [type='reset'],
-  [type='submit']
-)
-{ cursor: pointer }
-
-:disabled,
-:disabled::file-selector-button
 {
-  cursor: not-allowed;
-  -webkit-tap-highlight-color: transparent;
+  padding: 0 0.75em;
+  min-height: 32px;
 }
 
-fieldset {
-  padding: 1em;
-  border: 1px solid hsl(var(--sf-fieldset-c-bd));
+select[multiple] option,
+select[multiple] optgroup
+{
+  margin: 0 -0.75em;
+  padding: 0.4em 0.75em;
 }
+select[multiple] optgroup option { margin: 0 }
 
-legend {
-  color: inherit;
-  padding: 0 0.5em;
+input[type='checkbox'],
+input[type='color'],
+input[type='file'],
+input[type='hidden'],
+input[type='image'],
+input[type='radio'],
+input[type='range']
+{
+  margin: 0;
+  padding: 0;
+  min-height: 32px;
 }
 
-progress { vertical-align: baseline }
+input[type='checkbox'],
+input[type='radio'],
+textarea
+{ min-height: auto }
+
+
+button,
+select,
+input[type='button'],
+input[type='reset'],
+input[type='submit'],
+input[type='checkbox'],
+input[type='color'],
+input[type='file'],
+input[type='image'],
+input[type='radio'],
+input[type='range']
+{ cursor: pointer }
+
+button,
+input[type='button'],
+input[type='reset'],
+input[type='submit'],
+input[type='checkbox'],
+input[type='radio']
+{ vertical-align: baseline }
+
+input[type='checkbox'] { margin: 0 3px 0 0.5em }
+input[type='radio'] { margin: 0 3px 0 0.5em }
 
+fieldset { padding: 1em; border: 0 }
+legend { color: inherit; padding: 0 0.5em }
 textarea { overflow: auto }
 
+::file-selector-button {
+  cursor: pointer;
+  font-size: inherit;
+  font-family: inherit;
+  font-weight: 400;
+  line-height: 1;
+
+  padding: 0 0.75em;
+  min-height: 32px;
+
+  text-transform: none;
+  vertical-align: baseline;
+}
+
+::file-selector-button:disabled {
+  cursor: not-allowed;
+  -webkit-tap-highlight-color: transparent;
+}
+
+:disabled,
+input:disabled,
+button:disabled,
+select:disabled
+{
+  cursor: not-allowed;
+  -webkit-tap-highlight-color: transparent;
+}

src/link.css

@@ -10,3 +10,8 @@ a:not([href]) {
   opacity: var(--sf-disabled);
   -webkit-tap-highlight-color: transparent;
 }
+
+/* /// */
+
+html.var a { color: hsl(225, 73%, 57%) }
+html.var a:not([href]) { opacity: 0.4 }

src/table.css

@@ -1,25 +1,27 @@
 table {
   display: table;
   border-collapse: collapse;
+
+  font-size: inherit;
+  line-height: var(--sf-lh-normal);
+
+  border-width: 0 1px 1px 0;
+
   border-spacing: 0;
 }
 
-tbody,
-tfoot,
-thead
-{ background: none }
+table, td, th { border: 1px solid hsl(var(--sf-table-c-bd)) }
+tbody, tfoot, thead { background: none }
+td, th { padding: 0.5em 0.75em }
 
-td,
-th
-{
-  padding: 0.5em 0.75em;
-  border: 1px solid hsl(var(--sf-table-c-bd));
-}
+td:not([align]), th:not([align]) { text-align: start }
+td:not([valign]), th:not([valign]) { vertical-align: top }
+
+/* /// */
 
-td:not([align]),
-th:not([align])
-{ text-align: start }
+html.var table,
+html.var td,
+html.var th
+{ border: 1px solid hsl(0, 0%, 75%) }
 
-td:not([valign]),
-th:not([valign])
-{ vertical-align: top }
+html.var table { line-height: 1.1875 }