diff mrjunejune/src/tools/markdown_to_html/index.css @ 100:65e5a5b89a4e

[Seobeo] Migrated everything to this page.
author June Park <parkjune1995@gmail.com>
date Sat, 03 Jan 2026 07:48:07 -0800
parents 3bdfffaad162
children 902e29c38d66
line wrap: on
line diff
--- a/mrjunejune/src/tools/markdown_to_html/index.css	Fri Jan 02 20:38:02 2026 -0800
+++ b/mrjunejune/src/tools/markdown_to_html/index.css	Sat Jan 03 07:48:07 2026 -0800
@@ -38,7 +38,7 @@
 
 textarea {
   width: 100%;
-  height: 500px;
+  height: 700px;
   padding: 15px;
   background: rgb(var(--gray-light));
   color: var(--darkgray);
@@ -57,7 +57,6 @@
 
 .title {
   display: grid;
-  place-items: center;
   grid-template-columns: 1fr 1fr;
   margin-bottom: 10px;
 }
@@ -77,29 +76,29 @@
   background: rgb(var(--gray-light));
 }
 
-#output h1, #output h2, #output h3, #output h4, #output h5, #output h6 {
+h1, h2, h3, h4, h5, h6 {
   margin: 20px 0 10px 0;
   color: var(--darkgray);
 }
 
-#output h1 { font-size: 2em; }
-#output h2 { font-size: 1.5em; }
-#output h3 { font-size: 1.3em; }
+h1 { font-size: 2em; }
+h2 { font-size: 1.5em; }
+h3 { font-size: 1.3em; }
 
-#output p {
+p {
   margin: 10px 0;
 }
 
-#output ul, #output ol {
+ul, ol {
   margin: 10px 0;
   padding-left: 30px;
 }
 
-#output li {
+li {
   margin: 5px 0;
 }
 
-#output code {
+code {
   background: rgb(var(--gray-light));
   padding: 2px 6px;
   border-radius: 3px;
@@ -107,22 +106,23 @@
   font-size: 0.9em;
 }
 
-#output pre {
+pre {
   background: #282c34;
   color: #abb2bf;
   padding: 15px;
   border-radius: 4px;
   overflow-x: auto;
   margin: 10px 0;
+  text-wrap: auto;
 }
 
-#output pre code {
+pre code {
   background: none;
   color: inherit;
   padding: 0;
 }
 
-#output blockquote {
+blockquote {
   border-left: 4px solid rgb(var(--gray-light));
   padding-left: 15px;
   margin: 10px 0;
@@ -130,35 +130,35 @@
   font-style: italic;
 }
 
-#output a {
+a {
   color: var(--accent);
   text-decoration: none;
 }
 
-#output a:hover {
+a:hover {
   text-decoration: underline;
 }
 
-#output hr {
+hr {
   border: none;
   border-top: 2px solid rgb(var(--gray-light));
   margin: 20px 0;
 }
 
-#output img {
+img {
   max-width: 100%;
   height: auto;
 }
 
-#output strong {
+strong {
   font-weight: bold;
 }
 
-#output em {
+em {
   font-style: italic;
 }
 
-#output del {
+del {
   text-decoration: line-through;
 }
 
@@ -197,7 +197,7 @@
   }
 
   textarea {
-    height: 300px;
+    height: 400px;
     font-size: 16px;
   }
 
@@ -222,7 +222,7 @@
     font-size: 1rem;
   }
 
-  #output h1 { font-size: 1.75em; }
-  #output h2 { font-size: 1.5em; }
-  #output h3 { font-size: 1.25em; }
+  h1 { font-size: 1.75em; }
+  h2 { font-size: 1.5em; }
+  h3 { font-size: 1.25em; }
 }