bl-css 0.9.1 → 0.10.0

package/README.md

@@ -1,7 +1,9 @@
 # bl CSS
 A *lightweight*, **blueviolet**, ***small*** CSS framework!
-# 0.9.1 - Release notes(by Dev)
-Oops! I forgot to add ```@layer low{}``` to the CSS, well the patch is fixed (and you might want to read 0.9.0 for the cards :))
+# 0.10.0 - Release notes(by Dev)
+FORMS IN BL-CSS :D
+Now you can finally make your own form... with bl-css style :D
+```.form``` for form tag, ```.label``` for label tag and ```.in``` for input with a pretty nice placeholder! Now your sites can have **forms**
 # How to Change Accent Color?
 To change from the **original** blueviolet theme you have to open the main```bl.css``` file and you can change the following:
 ```css
@@ -11,6 +13,11 @@ To change from the **original** blueviolet theme you have to open the main```bl.
 	--_6: rgba(/* Your RGB */, 0.6)
 }
 ```
+# Repo
+The bl-css repo is on [GitHub](https://github.com/fg-xd/bl-CSS)
+
+You can also make an issue on GitHub to request features
 
 Have a Nice day Using it **:D**
-Forever Free **:D**
+
+Forever Free **:D**

package/bin/sc.js

@@ -8,10 +8,10 @@ const dest = path.join(process.cwd(), 'bl.css');
 // Actually doing the code lol
 try {
     fs.copyFileSync(src, dest);
-    console.log("bl CSS extracted from the Alien Trenches 🤣");
+    console.log("bl CSS extracted from the Alien Trenches");
 }
 catch (e) {
     console.log("The Alien has hidden the package!");
     console.log("run 'npm install bl-css' if you haven't yet")
     console.log("And don't you dare make it 'Global' bruh");
-}
+}

package/bl.css

@@ -16,7 +16,7 @@ body{
 	background: linear-gradient(
         to bottom,
         var(--_4),
-        var(--_), 
+        var(--_),
         var(--_4));
 	background-clip: text;
 	-webkit-background-clip: text;
@@ -151,4 +151,59 @@ body{
 	transform: translateY(-3px);
 	box-shadow: 0 0 10px var(--_);
 }
-}
+.card-row{
+	display: flex;
+	flex-direction: row;
+	gap: 10px;
+}
+.card-col{
+	display: flex;
+	flex-direction: column;
+	gap: 10px;
+}
+/* Form (NEW) */
+.form{
+	display: table;
+	padding: 12px;
+	border: var(--_4) 1px solid;
+	border-radius: 5px;
+	background-color: black;
+	transition: 0.4s ease;
+}
+.form:hover{
+	border: var(--_) 1px solid;
+}
+.form:focus-within{
+	border: var(--_) 1px solid;
+}
+.in{
+	display: table;
+	color: white;
+	font-family: "Cause";
+	padding: 5px;
+	background-color: black;
+	border: rgba(128,128,128,0.6) 1px solid;
+	border-radius: 5px;
+	transition: 0.4s ease;
+}
+.in:hover{
+	border: var(--_) 1px solid;
+}
+.in:focus{
+	border: var(--_) 1px solid;
+	outline: none;
+}
+.in::placeholder{
+	color: rgb(128,128,128);
+	font-family: "Cause";
+}
+.label{
+	font-family: "Cause";
+	padding: 4px 0;
+	color: white;
+	transition: 0.4s ease;
+}
+.label:focus-within{
+	color: var(--_);
+}
+}

package/package.json

@@ -1,14 +1,18 @@
 {
   "name": "bl-css",
-  "version": "0.9.1",
+  "version": "0.10.0",
   "description": "black - blueviolet lightweight CSS framework",
   "main": "bl.css",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
+  "repository":{
+    "type": "git",
+    "url": "https://github.com/fg-xd/bl-CSS.git"
+  },
   "bin": {
     "bl-css": "./bin/sc.js",
-    "bl": "./bin/sc.js"
+     "bl": "./bin/sc.js"
   },
   "files": ["bl.css", "README.md", "sc.js"],
   "exports": {