Fixed css

2024-03-04 07:45:58 -05:00
parent 4991595995
commit 1bab668b98
3 changed files with 66 additions and 53 deletions
--- a/templates/base.html
+++ b/templates/base.html
@@ -2,58 +2,67 @@
 <html>
  <head>
    <title>{{ title }}</title>
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+    <!-- CSS Reset -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
+
+<!-- Milligram CSS -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">
+
 <style>
-table {
-            width: 100%;
-            border-collapse: collapse;
-        }

-        th, td {
-            padding: 8px;
-            text-align: left;
-            border-bottom: 1px solid #ddd;
-        }
+td {
+	padding: 0px 0px 0px 0px;
+	margin-left: 10px;
+	height: 50px;
+}

-        th {
-            background-color: #f2f2f2;
-        }
+.centered-cell {
+  text-align: center; /* Center the content horizontally within the cell */
+}

-        /* Responsive styles */
-        @media only screen and (max-width: 600px) {
-            table {
-                border: 0;
-            }
+.inputContainer {
+	  display: inline-block; /* Display as an inline block */
+	    vertical-align: middle; /* Center vertically within the cell */
+	    width: 120px;
+}

-            table caption {
-                font-size: 1.3em;
-            }
+.inputContainer form {
+	margin: 5% auto 5% auto;
+}

-            table thead {
-                display: none;
-            }
+.inputField {
+	  display: flex;
+  align-items: center; /* Align items vertically */
+  width: 100%; /* Ensure inputField fills out inputContainer */
+  height: 100%; /* Ensure inputField fills out inputContainer */
+}
+.inputField input {
+	flex: 1;
+	width: 70%;
+	padding: 0px;
+	margin: auto 2.5px auto 2.5px;
+}
+.inputField button {
+	width: 30%;
+	padding: 0px;
+	margin: 0 2.5px 0 2.5px;
+}

-            table tr {
-                border-bottom: 3px solid #ddd;
-                display: block;
-                margin-bottom: 10px;
-            }
+.square-button {
+	background-color: white;
+}

-            table td {
-                display: block;
-                text-align: right;
-                font-size: 13px;
-            }

-            table td::before {
-                content: attr(data-label);
-                font-weight: bold;
-                display: inline-block;
-                width: 50%;
-            }
-        }
+td img{
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+
+}
+
 </style>
+
  </head>
  <body>
    <div class="container">