css

static/css/simple-blog-template.css

@@ -9,9 +9,13 @@ body {
     Roboto,
     sans-serif;
   background-color: #fcfcfc;
-  color: #222; /* Darker for better contrast */
+  color: #222;
-  font-size: 18px; /* Larger body text for readability */
+  font-size: 16px;
-  line-height: 1.75; /* Increased breathing room between lines */
+  line-height: 1.5;
+}
+
+footer {
+  margin: 50px 0;
 }
 
 /* Narrower container improves readability by limiting line length */
@@ -93,9 +97,9 @@ nav {
 /* --- Buttons & UI --- */
 .btn-read-more {
   float: right;
-  background: #f8f9fa; /* Light gray background instead of white */
+  background: #f8f9fa;
   border: 1px solid #e1e4e8;
-  color: #0366d6; /* Use your brand blue for the text */
+  color: #666;
   border-radius: 6px;
   padding: 8px 20px;
   font-size: 0.85rem;
@@ -109,10 +113,8 @@ nav {
 }
 
 .btn-read-more:hover {
-  background-color: #0366d6;
+  background-color: #e1e4e8;
-  border-color: #0366d6;
   color: #ffffff; /* Invert colors on hover */
-  box-shadow: 0 4px 8px rgba(3, 102, 214, 0.2);
   transform: translateY(-1px);
 }
 
@@ -231,3 +233,55 @@ nav {
   pointer-events: none;
   opacity: 0.2;
 }
+
+/* Login, Sign up, New post */
+.login,
+.signup {
+  margin-top: 20px;
+}
+
+.login h1,
+.signup h1,
+.newpost h1 {
+  margin-bottom: 20px;
+  text-align: center;
+}
+
+.login .form-control,
+.signup .form-control,
+.newpost .form-control {
+  border-radius: 0;
+}
+
+.login button,
+.signup button {
+  margin-top: 20px;
+  margin-bottom: 10px;
+  width: 100%;
+}
+
+.form-group label {
+  font-weight: normal;
+}
+
+.newpost textarea {
+  max-width: 100%;
+}
+
+/* Basic terminal style */
+.terminal-style {
+  font-family: "Courier New", monospace; /* Monospaced font for terminal look */
+  background-color: #000; /* Black background */
+  color: #fff; /* Classic green text color */
+  padding: 10px; /* Padding around the text */
+  border-radius: 4px; /* Slightly rounded corners */
+  border: 1px solid #333; /* Light border for separation */
+  /*white-space: pre-wrap; */
+  white-space: pre-wrap;
+  overflow-x: auto;
+}
+
+.blog-content {
+  position: relative;
+  z-index: 1; /* Ensures text stays on top */
+}