feat: components (buttons, inputfields, dropdowns, quotes / codes)

1 files changed, 57 insertions, 0 deletions

diff --git a/CSS/inputfield.css b/CSS/inputfield.css
new file mode 100644
index 0000000..4f01ad5
--- /dev/null
+++ b/CSS/inputfield.css
@@ -0,0 +1,57 @@
+/* Inputfield style */
+
+input[type=text], input[type=password], input[type=number], input[type=email], input[type=month], input[type=search], input[type=tel], input[type=time], input[type=url], input[type=week], textarea
+{
+	padding: 0.1rem 1rem;
+	margin: 0rem 0.3rem;
+
+	box-sizing: border-box;
+	
+	background-color: var(--bg-color);
+	color: var(--text-color);
+	border: 2px solid var(--title-color);
+}
+
+input[type=button], input[type=submit], input[type=reset], input[type=date], input[type=file], input[type=datetime-local], input[type=image]
+{
+    padding: 0.1rem 1rem;
+    margin: 0rem 0.3rem;
+
+	cursor: pointer;
+
+    text-align: center;
+    text-decoration: none;
+    text-transform: uppercase;
+	font-weight: bold;
+
+    background-color: var(--link-bg-color);
+    color: var(--link-color); 
+	border: 1px solid var(--link-bg-color);
+}
+
+input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, input[type=date]:hover, input[type=datetime-local]:hover
+
+{ 
+    color: var(--link-bg-color);
+    background-color: var(--link-color);
+}
+
+input[type="file"]::file-selector-button
+{ 
+	text-align: center;
+    text-decoration: none;
+    text-transform: uppercase;
+	font-weight: bold;
+
+    color: var(--link-bg-color);
+    background-color: var(--link-color);
+	border: 1px solid var(--link-color);
+}
+
+input[type=color]
+{
+	cursor: pointer;
+
+    background-color: var(--link-bg-color);
+	border: 1px solid var(--link-bg-color);
+}