Line 1: |
Line 1: |
− | {{Alexa-css}} | + | { |
| + | "ext.myExtension": { |
| + | "localBasePath": "modules/ext.MyExtension", |
| + | "remoteExtPath": "MyExtension/modules/ext.MyExtension", |
| + | "packageFiles": [ |
| + | "index.js", |
| + | "core.js", |
| + | "foobar.js" |
| + | ], |
| + | "styles": "myExtension.css", |
| + | "messages": [ |
| + | "myextension-hello-world", |
| + | "myextension-goodbye-world" |
| + | ], |
| + | "dependencies": [ |
| + | "oojs", |
| + | "mediawiki.util" |
| + | ] |
| + | } |
| + | } |
| + | |
| + | <!DOCTYPE html> |
| + | <html lang="en"> |
| + | <head> |
| + | <title>W3.CSS Template</title> |
| + | <meta charset="UTF-8"> |
| + | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| + | <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> |
| + | <link rel="stylesheet" href="https://www.w3schools.com/lib/w3-theme-black.css"> |
| + | <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto"> |
| + | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> |
| + | |
| + | |
| + | <style> |
| + | html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif;} |
| + | .w3-sidebar { |
| + | z-index: 3; |
| + | width: 250px; |
| + | top: 43px; |
| + | bottom: 0; |
| + | height: inherit; |
| + | } |
| + | </style> |
| + | </head> |
| + | <body> |
| + | |
| <!-- Navbar --> | | <!-- Navbar --> |
| <div class="w3-top"> | | <div class="w3-top"> |
Line 92: |
Line 137: |
| <!-- END MAIN --> | | <!-- END MAIN --> |
| </div> | | </div> |
| + | |
| + | <script> |
| + | // Get the Sidebar |
| + | var mySidebar = document.getElementById("mySidebar"); |
| + | |
| + | // Get the DIV with overlay effect |
| + | var overlayBg = document.getElementById("myOverlay"); |
| + | |
| + | // Toggle between showing and hiding the sidebar, and add overlay effect |
| + | function w3_open() { |
| + | if (mySidebar.style.display === 'block') { |
| + | mySidebar.style.display = 'none'; |
| + | overlayBg.style.display = "none"; |
| + | } else { |
| + | mySidebar.style.display = 'block'; |
| + | overlayBg.style.display = "block"; |
| + | } |
| + | } |
| + | |
| + | // Close the sidebar with the close button |
| + | function w3_close() { |
| + | mySidebar.style.display = "none"; |
| + | overlayBg.style.display = "none"; |
| + | } |
| + | </script> |
| + | |
| + | </body> |
| + | </html> |