update

.github/.pull_request_template.md

@@ -40,4 +40,4 @@ Include any updates to dependencies, frameworks, or tooling (e.g., `tailwindcss`
 
 ## Additional Comments
 
-Provide any additional context, considerations, or follow-up tasks related to this pull request.
+Provide any additional context, considerations, or follow-up tasks related to this pull request.

.github/ISSUE_TEMPLATE/bug_fix.yml

@@ -31,4 +31,4 @@ body:
         - Low
         - Medium
         - High
-        - Critical
+        - Critical

.github/ISSUE_TEMPLATE/config.yml

@@ -1 +1 @@
-blank_issues_enabled: true
+blank_issues_enabled: true

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -37,4 +37,4 @@ body:
         - Low
         - Medium
         - High
-        - Critical
+        - Critical

.github/ISSUE_TEMPLATE/question.yml

@@ -21,4 +21,4 @@ body:
       description: A little Elaboration of your question.
       placeholder: Provide additional detailed information.
     validations:
-      required: true
+      required: true

README.md

@@ -47,11 +47,11 @@ If you're using SCSS:
 @import "node_modules/@tfs-8/basecss/base.min.css";
 ```
 
-## Using BaseCSS via NPM
+## Using BaseCSS via CDN
 
 ### Installation
 
-To install the package, use the following command:
+To use the CDN, link to the following URL:
 
 ```url
 https://unpkg.com/@tfs-8/basecss/base.min.css

base.css

@@ -13,7 +13,7 @@
 
 :root {
   /* Colors */
-  --theme: #3e7bfc; /* UniveralThemeColor */
+  --theme: #3f7bfc; /* UniveralThemeColor */
   --bg: #f0f0f6; /* Background color for light mode */
   --fg: #17171f; /* Foreground color for light mode */
   --primary: #1f55f1; /* Primary color for buttons and links */
@@ -33,8 +33,8 @@
 .dark {
   --bg: #121212; /* Background color for dark mode */
   --fg: #e0e0e0; /* Foreground color for dark mode */
-  --primary: #1f55f1; /* Primary color for buttons and links in dark mode */
-  --primary-hover: #3e7bfc; /* Hover state for primary color in dark mode */
+  --primary: #1f54f1; /* Primary color for buttons and links in dark mode */
+  --primary-hover: #3f7bfc; /* Hover state for primary color in dark mode */
 }
 /*
  * ==============================================================
@@ -401,3 +401,42 @@ input[type="password"]:focus {
   cursor: not-allowed; /* Change cursor to not-allowed for disabled buttons */
   opacity: 0.6; /* Reduce opacity for disabled buttons */
 }
+/*
+ * ==============================================================
+ * Scroll
+ * ==============================================================
+*/
+
+/* Custom scrollbar styles for WebKit browsers */
+::-webkit-scrollbar {
+  width: 12px; /* Set the width of the scrollbar */
+  height: 12px; /* Set the height of the horizontal scrollbar */
+}
+
+/* Style for the scrollbar track (the area the scrollbar slides in) */
+::-webkit-scrollbar-track {
+  background-color: #eee; /* Light gray background for the track */
+  border-radius: 10px; /* Rounded corners for the track */
+}
+
+/* Style for the scrollbar thumb (the draggable part of the scrollbar) */
+::-webkit-scrollbar-thumb {
+  background-color: #888; /* Darker gray color for the thumb */
+  border-radius: 10px; /* Rounded corners for the thumb */
+}
+
+/* Style for the scrollbar thumb when hovered over */
+::-webkit-scrollbar-thumb:hover {
+  background-color: #555; /* Darker color for the thumb on hover */
+}
+
+/* Style for the corner where both horizontal and vertical scrollbars meet */
+::-webkit-scrollbar-corner {
+  background-color: #eee; /* Light gray background for the corner */
+}
+
+/* Custom scrollbar styles for Firefox */
+html {
+  scrollbar-width: thin; /* Set the scrollbar width to thin */
+  scrollbar-color: #888 #eee; /* Set the thumb and track colors */
+}

src/b_vars.css

@@ -6,7 +6,7 @@
 
 :root {
   /* Colors */
-  --theme: #3e7bfc; /* UniveralThemeColor */
+  --theme: #3f7bfc; /* UniveralThemeColor */
   --bg: #f0f0f6; /* Background color for light mode */
   --fg: #17171f; /* Foreground color for light mode */
   --primary: #1f55f1; /* Primary color for buttons and links */
@@ -26,6 +26,6 @@
 .dark {
   --bg: #121212; /* Background color for dark mode */
   --fg: #e0e0e0; /* Foreground color for dark mode */
-  --primary: #1f55f1; /* Primary color for buttons and links in dark mode */
-  --primary-hover: #3e7bfc; /* Hover state for primary color in dark mode */
+  --primary: #1f54f1; /* Primary color for buttons and links in dark mode */
+  --primary-hover: #3f7bfc; /* Hover state for primary color in dark mode */
 }

src/f_scroll.css

@@ -0,0 +1,39 @@
+/*
+ * ==============================================================
+ * Scroll
+ * ==============================================================
+*/
+
+/* Custom scrollbar styles for WebKit browsers */
+::-webkit-scrollbar {
+  width: 12px; /* Set the width of the scrollbar */
+  height: 12px; /* Set the height of the horizontal scrollbar */
+}
+
+/* Style for the scrollbar track (the area the scrollbar slides in) */
+::-webkit-scrollbar-track {
+  background-color: #eee; /* Light gray background for the track */
+  border-radius: 10px; /* Rounded corners for the track */
+}
+
+/* Style for the scrollbar thumb (the draggable part of the scrollbar) */
+::-webkit-scrollbar-thumb {
+  background-color: #888; /* Darker gray color for the thumb */
+  border-radius: 10px; /* Rounded corners for the thumb */
+}
+
+/* Style for the scrollbar thumb when hovered over */
+::-webkit-scrollbar-thumb:hover {
+  background-color: #555; /* Darker color for the thumb on hover */
+}
+
+/* Style for the corner where both horizontal and vertical scrollbars meet */
+::-webkit-scrollbar-corner {
+  background-color: #eee; /* Light gray background for the corner */
+}
+
+/* Custom scrollbar styles for Firefox */
+html {
+  scrollbar-width: thin; /* Set the scrollbar width to thin */
+  scrollbar-color: #888 #eee; /* Set the thumb and track colors */
+}