add css

app/assets/stylesheets/_config.css

@@ -39,6 +39,7 @@ main {
   font-weight: 300;
   font-style: normal;
 }
+
 .container {
   width: 100%;
   max-width: 720px;
@@ -115,4 +116,4 @@ main {
   display: flex;
   flex-direction: column;
   gap: 10px;
-}
+}

app/assets/stylesheets/application.css

@@ -1,4 +1,4 @@
-/* 
+/*
  * This is a manifest file that'll be compiled into application.css, which will include all the files
  * listed below.
  *
@@ -12,4 +12,4 @@
  *
  *= require_tree .
  *= require_self
- */
+ */

app/assets/stylesheets/expenses.css

@@ -1,40 +1,40 @@
 .exp {
-    width: 96%;
-    background-color: white;
-    border-radius: 5px;
-    flex-wrap: wrap;
-    margin-top: 0.25rem;
-    height: 63px;
-  }
-  
-  .exp-name {
-    width: 50%;
-    font-size: 21px;
-    font-weight: 500;
-  }
-  
-  .exp-amount {
-    width: 25%;
-    font-size: 22px;
-    font-weight: 300;
-  }
-  
-  .exp-div {
-    width: 25%;
-    height: 90%;
-    text-align: right;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    flex-wrap: wrap;
-  }
-  
-  .exp-div a {
-    width: 100%;
-    font-size: large;
-  }
-  
-  .exp-icon {
-    width: 20%;
-    margin-right: 2px;
-  }
+  width: 96%;
+  background-color: white;
+  border-radius: 5px;
+  flex-wrap: wrap;
+  margin-top: 0.25rem;
+  height: 63px;
+}
+
+.exp-name {
+  width: 50%;
+  font-size: 21px;
+  font-weight: 500;
+}
+
+.exp-amount {
+  width: 25%;
+  font-size: 22px;
+  font-weight: 300;
+}
+
+.exp-div {
+  width: 25%;
+  height: 90%;
+  text-align: right;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  flex-wrap: wrap;
+}
+
+.exp-div a {
+  width: 100%;
+  font-size: large;
+}
+
+.exp-icon {
+  width: 20%;
+  margin-right: 2px;
+}

app/assets/stylesheets/forms.css

@@ -1,88 +1,88 @@
 form {
-    margin-top: 0.5rem;
-    width: 96%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-  }
-  
-  form div,
-  form.edit_user div,
-  form.new_user div {
-    margin: 0.15rem 0;
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-wrap: wrap;
-  }
-  
-  form input[type=number],
-  form input[type=text],
-  form input[type=email],
-  form input[type=password],
-  form textarea {
-    width: 99%;
-    background-color: white;
-    border: 1px solid #cbcbcb;
-    height: 45px;
-    padding-left: 9px;
-    text-align: left;
-    font-size: 18px;
-    font-weight: 200;
-  }
-  
-  form input[type=text],
-  form input[type=email]::placeholder,
-  form input[type=password]::placeholder {
-    text-align: left;
-    padding-left: 9px;
-    font-weight: 400;
-  }
-  
-  #user_remember_me {
-    margin: 0.25rem;
-  }
-  
-  .shared-links {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-wrap: wrap;
-  }
-  
-  .shared-links a {
-    width: 100%;
-    text-align: center;
-    margin-top: 0.5rem;
-    transition: color 200ms ease-in-out;
-  }
-  
-  .shared-links a:hover {
-    color: var(--color-main);
-  }
-  
-  .cancel-acc {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-wrap: wrap;
-    width: 100%;
-  }
-  
-  .cancel-acc p {
-    width: 90%;
-    text-align: center;
-    margin-top: 0.5rem;
-  }
-  
-  #category_icon {
-    font-size: 30px;
-  }
-  
-  form div label {
-    font-size: 16px;
-    font-weight: 400;
-    width: 100%;
-    text-align: center;
-  }
+  margin-top: 0.5rem;
+  width: 96%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+
+form div,
+form.edit_user div,
+form.new_user div {
+  margin: 0.15rem 0;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+form input[type=number],
+form input[type=text],
+form input[type=email],
+form input[type=password],
+form textarea {
+  width: 99%;
+  background-color: white;
+  border: 1px solid #cbcbcb;
+  height: 45px;
+  padding-left: 9px;
+  text-align: left;
+  font-size: 18px;
+  font-weight: 200;
+}
+
+form input[type=text],
+form input[type=email]::placeholder,
+form input[type=password]::placeholder {
+  text-align: left;
+  padding-left: 9px;
+  font-weight: 400;
+}
+
+#user_remember_me {
+  margin: 0.25rem;
+}
+
+.shared-links {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.shared-links a {
+  width: 100%;
+  text-align: center;
+  margin-top: 0.5rem;
+  transition: color 200ms ease-in-out;
+}
+
+.shared-links a:hover {
+  color: var(--color-main);
+}
+
+.cancel-acc {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.cancel-acc p {
+  width: 90%;
+  text-align: center;
+  margin-top: 0.5rem;
+}
+
+#category_icon {
+  font-size: 30px;
+}
+
+form div label {
+  font-size: 16px;
+  font-weight: 400;
+  width: 100%;
+  text-align: center;
+}

app/assets/stylesheets/groups.css

@@ -1,22 +1,22 @@
 #categories a {
-    width: 96%;
-    background-color: white;
-    border-radius: 5px;
-    flex-wrap: wrap;
-    margin-top: 0.25rem;
-    height: 63px;
-  }
-  
-  .cat-icon {
-    font-size: 36px;
-  }
-  
-  .cat-name {
-    width: 50%;
-    font-size: 20px;
-    font-weight: 300;
-  }
-  
-  .cat-total {
-    width: 30%;
-  }
+  width: 96%;
+  background-color: white;
+  border-radius: 5px;
+  flex-wrap: wrap;
+  margin-top: 0.25rem;
+  height: 63px;
+}
+
+.cat-icon {
+  font-size: 36px;
+}
+
+.cat-name {
+  width: 50%;
+  font-size: 20px;
+  font-weight: 300;
+}
+
+.cat-total {
+  width: 30%;
+}