Skip to content
Snippets Groups Projects
Select Git revision
  • bd266eca8213587d4cbaa8a7e5edc42cb269859e
  • master default protected
  • 1.31
  • 4.27.0
  • 4.26.0
  • 4.25.5
  • 4.25.4
  • 4.25.3
  • 4.25.2
  • 4.25.1
  • 4.25.0
  • 4.24.3
  • 4.24.2
  • 4.24.1
  • 4.24.0
  • 4.23.6
  • 4.23.5
  • 4.23.4
  • 4.23.3
  • 4.23.2
  • 4.23.1
  • 4.23.0
  • 4.22.3
23 results

issue-210.js

Blame
    • 226.html 3.46 KiB 
    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>new slieder control #226</title>
    <script src="./226.mjs" type="module"></script>
    
    <style>

        :not(:defined) {
            display: none;
        }
        
        .slide {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
        }
        
        
        
          main {
              display: flex;
              justify-content: center;
              align-items: center;
              width: 100%;
              height: 100%;
          }
          
            monster-slider::part(prev) {
            }
            
            monster-slider::part(control) {
                
            }
            
            .container {
                padding: 10px;
                width: 1200px;
                height: 600px;
                background-color: #cccccc;
                box-sizing: border-box;
                overflow: hidden;
            }
        
    </style>
</head>
<body>
    <h1>new slieder control #226</h1>
    <p>user aborted</p>
    <ul>
        <li><a href="https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/226">Issue #226</a></li>
        <li><a href="/">Back to overview</a></li>
    </ul>
    <main>
        
        <div class="container">
          <monster-slider>
              <div slot="prev"><svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="currentColor" class="bi bi-arrow-left-square-fill" viewBox="0 0 16 16">
                      <path d="M16 14a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2zm-4.5-6.5H5.707l2.147-2.146a.5.5 0 1 0-.708-.708l-3 3a.5.5 0 0 0 0 .708l3 3a.5.5 0 0 0 .708-.708L5.707 8.5H11.5a.5.5 0 0 0 0-1"/>
                  </svg></div>
              <div class="slide" style="display:none;background-color: #ff6666;width:50px">
                  <h1>SLIDE 1</h1>
              </div>
              <div class="slide" style="background-color: #ff6666;width:50px">
                  <h1>SLIDE 1 a</h1>
              </div>