Add more commands

glauberramos · Feb 19, 2024 · 83cc640 · 83cc640
1 parent 1e12bab
commit 83cc640
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 12 deletions.
diff --git a/index.html b/index.html
@@ -12,9 +12,24 @@
   </head>
   <body>
     <section>
-      <h1>Pastee</h1>
+      <h1 class="logo">Pastee</h1>
       <small> Simple way to keep a text</small>
       <ul class="commands">
+        <li>
+          <button onclick="document.execCommand('formatBlock', false, 'h1')">
+            H1
+          </button>
+        </li>
+        <li>
+          <button onclick="document.execCommand('formatBlock', false, 'h2')">
+            H2
+          </button>
+        </li>
+        <li>
+          <button onclick="document.execCommand('formatBlock', false, 'h3')">
+            H3
+          </button>
+        </li>
         <li>
           <button onclick="document.execCommand('bold', false, null)">B</button>
         </li>
@@ -33,6 +48,34 @@ <h1>Pastee</h1>
             –
           </button>
         </li>
+        <li>
+          <button
+            onclick="document.execCommand('insertUnorderedList', false, null)"
+          >
+            <svg
+              height="21"
+              viewBox="0 0 21 21"
+              width="21"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <g fill="none" fill-rule="evenodd" transform="translate(4 5)">
+                <g
+                  stroke="currentColor"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                >
+                  <path d="m11.5 5.5h-7" />
+                  <path d="m11.5 9.5h-7" />
+                  <path d="m11.5 1.5h-7" />
+                </g>
+                <path
+                  d="m1.49884033 2.5c.5 0 1-.5 1-1s-.5-1-1-1-.99884033.5-.99884033 1 .49884033 1 .99884033 1zm0 4c.5 0 1-.5 1-1s-.5-1-1-1-.99884033.5-.99884033 1 .49884033 1 .99884033 1zm0 4c.5 0 1-.5 1-1s-.5-1-1-1-.99884033.5-.99884033 1 .49884033 1 .99884033 1z"
+                  fill="currentColor"
+                />
+              </g>
+            </svg>
+          </button>
+        </li>
       </ul>
       <div
         name="paste"

diff --git a/style.css b/style.css
@@ -8,7 +8,7 @@ body {
   margin: 0;
 }
 
-h1 {
+.logo {
   font-size: 26px;
   font-weight: 700;
   color: rgb(19, 71, 71);
@@ -30,18 +30,11 @@ p {
   margin: 0 auto;
 }
 
-b {
-  font-size: 24px;
-  margin-top: 5px;
-  margin-bottom: 5px;
-  display: block;
-}
-
 .textarea {
   background: #2c3a4d;
   color: #c3d7ef;
-  font-size: 20px;
-  padding: 15px;
+  font-size: 18px;
+  padding: 20px;
   width: 95%;
   height: 90vh;
   border-radius: 2px;
@@ -53,7 +46,8 @@ b {
   margin: 0 auto;
 }
 
-a {
+a,
+svg {
   color: #c3d7ef;
 }