doppelte btn Klasse in css entfernt; themebtn buttons mit btn erweitert

static/css/style.css

@@ -32,18 +32,6 @@ body {
     cursor: pointer;
 }
 
-  /* theme toggle button */
-.themebtn {
-position: relative;
-padding: 10px 16px;
-background-color: var(--color-background);
-border: var(--color-default) solid 3px;
-color: var(--color-default);
-border-radius: 6px;
-font-size: 18px;
-cursor: pointer;
-}
-
     /* SVG lightsabers */
 h1, p {
     color: var(--color-accent-1);

templates/base.html

@@ -12,7 +12,7 @@
                 <h1>Test Dark/Light<br> <i style="font-size: 1rem;">You can choose the button to override your system-settings and change the color theme!</i> </h1>
             </div></div>
             <div class="row"><div class="col">
-                <button class='themebtn'>Toggle mode</button>
+                <button class='themebtn btn'>Toggle mode</button>
             </div></div>
             <div class="row" style="margin-top: 5rem;"><div class="col-auto">
                 <h1>This is the first Page<br><i style="font-size: 1rem;">Goto the second Page</i></h1>
@@ -24,7 +24,7 @@
                 <h1><i style="font-size: 1rem;">Here is a second toggle button to change the color theme!</i> </h1>
             </div></div>
             <div class="row"><div class="col-auto">
-                <button class='themebtn'>Second Toggle button</button>
+                <button class='themebtn btn'>Second Toggle button</button>
             </div></div>
         </div>
     </body>

templates/second_page.html

@@ -12,7 +12,7 @@
                 <h1>Test Dark/Light<br> <i style="font-size: 1rem;">You can choose the button to override your system-settings and change the color theme!</i> </h1>
             </div></div>
             <div class="row"><div class="col-auto">
-                <button class='themebtn'>Toggle mode</button>
+                <button class='themebtn btn'>Toggle mode</button>
             </div></div>
             <div class="row"  style="margin-top: 5rem;"><div class="col-auto">
                 <h1>This is the second Page<br><i style="font-size: 1rem;">Goto the first Page</i><br></h1>
@@ -24,7 +24,7 @@
                 <h1><i style="font-size: 1rem;">Here is a second toggle button to change the color theme!</i> </h1>
             </div></div>
             <div class="row"><div class="col-auto">
-                <button class='themebtn'>Second Toggle button</button>
+                <button class='themebtn btn'>Second Toggle button</button>
             </div></div>
         </div>
     </body>