feat: Initial thoughts generation in place

Author: ripixel

Diff for: assets/styles/styles.css

@@ -33,13 +33,17 @@ h6 {
   letter-spacing: 0.1em;
 }
 
-p {
+p,
+ol,
+ul {
   line-height: 1.5em;
   padding-bottom: 1em;
   /* letter-spacing: 0.05em; */
 }
 
-p:last-child {
+p:last-child,
+ol:last-child,
+ul:last-child {
   padding-bottom: 0;
 }
 
@@ -269,6 +273,14 @@ main.area.thoughts {
   background: rgb(0, 105, 79);
 }
 
+main.thoughts section h3 {
+  text-transform: none;
+}
+
+main.thoughts.details {
+  background: rgb(1, 65, 49);
+}
+
 main.profile {
   min-height: 0;
   background: rgb(17, 50, 143);
@@ -278,24 +290,26 @@ main.profile.details {
   background: rgb(12, 36, 102);
 }
 
-main.profile.employment .employment-details h3 {
+main .header-details h1,
+main .header-details h2,
+main .header-details h3 {
   text-transform: none;
   display: inline-block;
   padding-right: 10px;
   padding-bottom: 15px;
 }
 
-main.profile.employment .employment-details h4 {
+main .header-details h4 {
   padding-bottom: 10px;
 }
 
-main.profile.employment .employment-details p {
+main .header-details p {
   display: inline-block;
   margin-bottom: 15px;
 }
 
 @media only screen and (max-width: 600px) {
-  main.profile.employment .employment-details h3 {
+  main .header-details h3 {
     display: block;
   }
 }
@@ -437,23 +451,105 @@ section.area {
   }
 }
 
+.article section.area {
+  border-left: none;
+  padding-left: 0;
+}
+
+.article img {
+  max-width: 100%;
+}
+
+.article .header-details {
+  padding-left: 20px;
+  border-left: 5px solid #fff;
+  margin-bottom: 20px;
+}
+
+.article .header-details > * {
+  margin-bottom: 0;
+}
+
 section.area h2,
 h3 {
   padding-bottom: 1em;
   text-transform: lowercase;
 }
 
-.em {
+.em,
+strong {
   font-weight: bold;
 }
 
-.em2 {
+.em2,
+blockquote,
+em {
   padding-right: 0.1em;
   font-style: italic;
 }
 
 .tag {
   background: rgba(0, 0, 0, 0.2);
-  padding: 5px 10px;
+  padding: 5px 10px !important;
   font-size: 0.8em;
 }
+
+.article section.area h1 {
+  font-size: 1.8em;
+  line-height: 1.2em;
+}
+
+.article section.area h2,
+.article section.area h3,
+.article section.area h4,
+.article section.area h5,
+.article section.area h6 {
+  padding-left: 10px;
+  padding-bottom: 0;
+  margin-top: 10px;
+  margin-bottom: 5px;
+  text-transform: none;
+}
+
+.article section.area p {
+  text-align: justify;
+}
+
+.article section.area p,
+.article section.area img,
+.article section.area ol,
+.article section.area ul {
+  margin-left: 10px;
+}
+
+.article section.area ol li,
+.article section.area ul li {
+  display: block;
+  margin-bottom: 5px;
+}
+
+.article section.area ol li:before,
+.article section.area ul li:before {
+  content: " - ";
+  margin-left: 10px;
+}
+
+@media only screen and (max-width: 600px) {
+  .article section.area h2,
+  .article section.area h3,
+  .article section.area h4,
+  .article section.area h5,
+  .article section.area h6,
+  .article section.area p,
+  .article section.area img,
+  .article section.area ol li:before,
+  .article section.area ul li:before {
+    padding-left: 0;
+    margin-left: 0;
+  }
+
+  .article section.area {
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+}

Diff for: nodemon.json

@@ -2,8 +2,9 @@
   "watch": [
     "pages",
     "assets",
-    "templates"
+    "templates",
+    "thoughts"
   ],
-  "ext": "html,css",
+  "ext": "html,css,md",
   "exec": "npm run build:dev"
 }