Fixing demo

2025-08-13 08:34:50 +02:00 · 2017-04-19 10:23:40 +02:00
parent c3100f5d44
commit b78b791865
1 changed files with 39 additions and 39 deletions
--- a/demos/media.html
+++ b/demos/media.html
@@ -3,72 +3,72 @@
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
-    
+
    <!-- CLEAN MARKUP = GOOD KARMA.
      Hi source code lover,
-      
+
      you're a curious person and a fast learner ;)
      Let's make something beautiful together. Contribute on Github:
      https://github.com/webslides/webslides
-      
+
      Thanks!
    -->
-    
+
    <!-- SEO -->
    <title>WebSlides Tutorial: Videos, Images, and Maps</title>
    <meta name="description" content="How to embed images, videos, and maps in your presentation.">
-    
+
    <!-- URL CANONICAL -->
    <!-- <link rel="canonical" href="http://your-url.com/permalink"> -->
-    
+
    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,700,700i%7CMaitree:200,300,400,600,700&amp;subset=latin-ext" rel="stylesheet">
-    
+
    <!-- CSS Base -->
    <link rel="stylesheet" type='text/css' media='all' href="../static/css/base.css">
-    
+
    <!-- CSS Colors -->
    <link rel="stylesheet" type='text/css' media='all' href="../static/css/colors.css">
-    
+
    <!-- Optional - CSS SVG Icons (Font Awesome) -->
    <link rel="stylesheet" type='text/css' media='all' href="../static/css/svg-icons.css">
-    
+
    <!-- SOCIAL CARDS (ADD YOUR INFO) -->
-    
+
    <!-- FACEBOOK -->
    <meta property="og:url" content="/" />
    <meta property="og:type" content="article" />
    <meta property="og:title" content="WebSlides Tutorial: Media" />
-    
+
    <!-- EDIT -->
    <meta property="og:description" content="How to embed images, videos, and maps in your presentation.">
-    
+
    <!-- EDIT -->
    <meta property="og:updated_time" content="2017-01-04T17:25:31">
-    
+
    <!-- EDIT -->
    <meta property="og:image" content="../static/images/share-webslides.jpg" >
-    
+
    <!-- EDIT -->
-    
+
    <!-- TWITTER -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@webslides">
-    
+
    <!-- EDIT -->
    <meta name="twitter:creator" content="@jlantunez">
-    
+
    <!-- EDIT -->
    <meta name="twitter:title" content="WebSlides Tutorial: Media">
-    
+
    <!-- EDIT -->
    <meta name="twitter:description" content="How to embed images, videos, and maps in your presentation.">
-    
+
    <!-- EDIT -->
    <meta name="twitter:image" content="../static/images/share-webslides.jpg">
-    
+
    <!-- EDIT -->
-    
+
    <!-- FAVICONS -->
    <link rel="shortcut icon" sizes="16x16" href="../static/images/favicons/favicon.png">
    <link rel="shortcut icon" sizes="32x32" href="../static/images/favicons/favicon-32.png">
@@ -77,11 +77,11 @@
    <link rel="apple-touch-icon icon" sizes="152x152" href="../static/images/favicons/favicon-152.png">
    <link rel="apple-touch-icon icon" sizes="180x180" href="../static/images/favicons/favicon-180.png">
    <link rel="apple-touch-icon icon" sizes="192x192" href="../static/images/favicons/favicon-192.png">
-    
+
    <!-- Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="theme-color" content="#333333">
-  
+
  </head>
  <body>
    <header role="banner">
@@ -108,16 +108,16 @@
        </ul>
      </nav>
    </header>
-    
+
    <main role="main">
      <article id="webslides">
-      
+
        <!-- Quick Guide
          - Each parent <section> in the <article id="webslides"> element is an individual slide.
          - Vertical sliding = <article id="webslides" class="vertical">
          - <div class="wrap"> = container 90% / <div class="wrap size-50"> = 45%;
        -->
-        
+
        <section class="bg-black-blue aligncenter">
          <span class="background dark" style="background-image:url('https://source.unsplash.com/Zq_K89I9E-8/)"></span>
          <!--.wrap = container (width: 90%) -->
@@ -722,7 +722,7 @@
            <div class="grid">
              <div class="column">
                <pre>&lt;div class="embed"&gt;
-  <strong>&lt;div data-youtube data-youtube-id=&quot;CQY3KUR3VzM&quot; data-autoplay data-loop&gt; 
+  <strong>&lt;div data-youtube data-youtube-id=&quot;CQY3KUR3VzM&quot; data-autoplay data-loop&gt;
  &lt;/div&gt;</strong>
 &lt;/div&gt;</pre>
                <p>autoplay + loop</p>
@@ -730,7 +730,7 @@
              <!-- .end .column -->
              <div class="column">
                <pre>&lt;div class="embed"&gt;
-  <strong>&lt;div data-youtube data-youtube-id=&quot;CQY3KUR3VzM&quot; data-autoplay data-mute data-no-controls&gt; 
+  <strong>&lt;div data-youtube data-youtube-id=&quot;CQY3KUR3VzM&quot; data-autoplay data-mute data-no-controls&gt;
  &lt;/div&gt;</strong>
 &lt;/div&gt;</pre>
                <p>autoplay + mute + no controls.</p>
@@ -747,7 +747,7 @@
              <h3>YouTube API</h3>
              <p><code>autoplay + loop</code></p>
              <pre>&lt;div class="embed"&gt;
-  &lt;div data-youtube data-youtube-id=&quot;_m67JbGjWnc&quot; <strong>data-autoplay data-loop</strong>&gt; 
+  &lt;div data-youtube data-youtube-id=&quot;_m67JbGjWnc&quot; <strong>data-autoplay data-loop</strong>&gt;
  &lt;/div&gt;
 &lt;/div&gt;</pre>
            </div>
@@ -782,7 +782,7 @@
            <hr>
            <pre><strong>&lt;section class="fullscreen"&gt;</strong>
  &lt;div class="embed"&gt;
-    &lt;div data-youtube data-youtube-id=&quot;dmkwb2KfLW8&quot; <strong>data-autoplay data-loop data-no-controls</strong>&lt;/div&gt;
+    &lt;div data-youtube data-youtube-id=&quot;dmkwb2KfLW8&quot; <strong>data-autoplay data-loop data-no-controls</strong>&gt;&lt;/div&gt;
  &lt;/div&gt;
 <strong>&lt;/section&gt;</strong>
 </pre>
@@ -874,7 +874,7 @@
                  <li><strong class="text-label" title="Website">Website:</strong> <a href="http://www.visitasevilla.es/en">visitasevilla.es</a></li>
                </ul>
                <p>
-                  There are many reasons to visit Seville. Its Old Town contains three UNESCO World Heritage Sites: the Alcazar palace complex, the Cathedral and the General Archive of the Indies. 
+                  There are many reasons to visit Seville. Its Old Town contains three UNESCO World Heritage Sites: the Alcazar palace complex, the Cathedral and the General Archive of the Indies.
                </p>
              </div>
              <!-- end .flex-content-->
@@ -885,7 +885,7 @@
        </section>
        <section class="fullscreen">
          <div class="embed">
-            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3170.254536199183!2d-5.994303837186783!3d37.38381233311839!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xbaa976bfaec1fe87!2sReal+Alc%C3%A1zar+de+Sevilla!5e0!3m2!1ses!2ses!4v1489408674667" width="800" height="600" allowfullscreen></iframe> 
+            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3170.254536199183!2d-5.994303837186783!3d37.38381233311839!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xbaa976bfaec1fe87!2sReal+Alc%C3%A1zar+de+Sevilla!5e0!3m2!1ses!2ses!4v1489408674667" width="800" height="600" allowfullscreen></iframe>
          </div>
          <!-- .end .embed -->
        </section>
@@ -930,20 +930,20 @@
          <h2 class="text-emoji zoomIn"><strong><a href="https://webslides.tv" title="WebSlides">😎</a></strong></h2>
          <h3><a href="https://twitter.com/webslides" title="WebSlides on Twitter">@WebSlides</a></h3>
        </section>
-        
+
      </article>
    </main>
    <!--main-->
    <!-- Required -->
-    
+
    <script src="../static/js/webslides.js"></script>
-    
+
    <script>
      window.ws = new WebSlides();
    </script>
-    
+
    <!-- OPTIONAL - svg-icons.js (fontastic.me - Font Awesome as svg icons) -->
    <script defer src="../static/js/svg-icons.js"></script>
-  
+
  </body>
-</html>
+</html>