add code block styling

static/css/style.css

@@ -94,6 +94,37 @@ article.h-entry .e-content {
     line-height: 1.8;
 }
 
+/* Code Block Styling */
+pre {
+    background-color: #f4f4f4; /* Light gray background */
+    border: 1px solid #ddd; /* Subtle border */
+    border-radius: 5px; /* Rounded corners */
+    padding: 15px; /* Inner padding */
+    overflow-x: auto; /* Horizontal scrolling for long lines */
+    font-family: 'Courier New', monospace; /* Monospace font for readability */
+    font-size: 0.9rem; /* Slightly smaller font size */
+    line-height: 1.6;
+    color: #333; /* Dark text */
+    margin: 20px 0; /* Space around the block */
+}
+
+code {
+    font-family: 'Courier New', monospace; /* Monospace font for inline code */
+    font-size: 0.9rem;
+    background-color: #f4f4f4; /* Same background as pre blocks */
+    padding: 2px 4px; /* Small padding for inline code */
+    border-radius: 3px; /* Rounded corners */
+    color: #c7254e; /* Distinct color for code text */
+}
+
+/* Optional: Highlight Inline Code */
+article h-entry code {
+    background-color: #fffbdd; /* Light yellow background for inline code */
+    color: #d6336c; /* Reddish text for contrast */
+    font-weight: bold;
+}
+
+
 /* Photos Section */
 .photo-grid {
     display: grid;