Template:Menu side: Difference between revisions

Latest revision as of 17:19, 1 May 2022

@@ Line 1: / Line 1: @@
-<div class="menu-side" id="image">
+<div class="menu-side infobox side">
 <div class="menu-side-header">{{{1}}}</div>
-<div class="menu-side-content" id="foo">{{{2}}}</div>
+<div class="menu-side-content">{{{2}}}</div>
 </div>
+<noinclude>[[Category:Menu Templates]]</noinclude>
+<html><style>.menu-side {
-<html>
-<style>
-.menu-side {
      background: #f8f9fa;
      border: 1px solid #a2a9b1;
      box-sizing: border-box;
      clear: both;
-    float: right;
-    margin: 0 0 1em 1em;
      text-align: center;
      width: 332px;
 }
+@media only screen and (max-width: 700px) {
+  .menu-side {
+    Width:100%;
+  }
+}
 .menu-side-header {
      background: #3498db;
      color: white;
      font-weight: bold;
+    font-size:1rem;
 }
 .menu-side-content {
@@ Line 34: / Line 37: @@
      margin-left: 0!important;
      line-height: 1.5rem;
-}
+}</style>
-</style>
-<script>
-const menu-side-header = document.querySelector('.menu-side-header');
-const menu-side-content = document.querySelector('.menu-side-content');
-function toggleStyle(el, prop, style1, style2) {
-  el.style[prop] = el.style[prop] === style1 ? style2 : style1;
-}
-menu-side-header.addEventListener('click', e => {
-  toggleStyle(menu-side-content, 'background', 'red', 'blue');
-});
-</script>
 </html>