Merge pull request #28 from MysticalMike60t/dev

Added basic styling and structure to testing, and decreased border-ra…
MysticalMike60t · Sep 10, 2024 · 8366f9f · 8366f9f
2 parents a44bc92 + 07cad02
commit 8366f9f
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 3 deletions.
diff --git a/src/styles/css/index.css b/src/styles/css/index.css
@@ -2,7 +2,7 @@
   background: var(--primary-background);
   color: var(--primary-color);
   border: 1px solid var(--primary-border);
-  border-radius: 10px;
+  border-radius: 5px;
   padding: 10px 20px;
   transition: 100ms ease all;
   cursor: pointer;

diff --git a/testing/src/App.css b/testing/src/App.css
@@ -29,20 +29,43 @@
 }
 
 .container {
+  width: 100%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   flex-direction: column;
   gap: 10px;
+  padding: 20px;
   padding-top: 50px;
   padding-bottom: 100px;
 }
 
+.container > .section {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  flex-direction: column;
+}
+
+.container > .section > .section-title {
+  width: 100%;
+  text-align: left;
+}
+
+.container > .section > .section-content {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  flex-direction: column;
+  gap: 10px;
+}
+
 @keyframes App-logo-spin {
   from {
     transform: rotate(0deg);
   }
   to {
     transform: rotate(360deg);
   }
-}
+}
diff --git a/testing/src/App.js b/testing/src/App.js
@@ -5,7 +5,12 @@ import "caden/lib/styles/css/index.css";
 function App() {
   return (
     <div className="container">
-      <UI.Buttons.Submit>Submit</UI.Buttons.Submit>
+      <div className="section">
+        <h1 className="section-title">Buttons</h1>
+        <div className="section-content">
+          <UI.Buttons.Submit>Submit</UI.Buttons.Submit>
+        </div>
+      </div>
     </div>
   );
 }