v1.6.0

htmlstreamofficial · Dec 13, 2022 · 7e95b4e · 7e95b4e
1 parent f3240a4
commit 7e95b4e
Show file tree

Hide file tree

Showing 29 changed files with 2,952 additions and 10 deletions.
diff --git a/dist/components/hs-overlay/hs-overlay.js b/dist/components/hs-overlay/hs-overlay.js
diff --git a/dist/preline.js b/dist/preline.js
diff --git a/examples/html/ab-a-button-on-gradient-bg.html b/examples/html/ab-a-button-on-gradient-bg.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <!-- Required Meta Tags Always Come First -->
+  <meta charset="utf-8">
+  <meta name="robots" content="max-snippet:-1, max-image-preview:large, max-video-preview:-1">
+  <link rel="canonical" href="https://preline.co/">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta name="description" content="Announcement Banner example using Tailwind CSS for Preline UI, a product of Htmlstream.">
+
+  <meta name="twitter:site" content="@preline">
+  <meta name="twitter:creator" content="@htmlstream">
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:title" content="A Button on Gradient Background using Tailwind CSS | Preline UI, crafted with Tailwind CSS">
+  <meta name="twitter:description" content="Announcement Banner example using Tailwind CSS for Preline UI, a product of Htmlstream.">
+  <meta name="twitter:image" content="../../assets/img/og-image.png">
+
+  <meta property="og:url" content="https://preline.co/">
+  <meta property="og:locale" content="en_US">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Preline">
+  <meta property="og:title" content="A Button on Gradient Background using Tailwind CSS | Preline UI, crafted with Tailwind CSS">
+  <meta property="og:description" content="Announcement Banner example using Tailwind CSS for Preline UI, a product of Htmlstream.">
+  <meta property="og:image" content="../../assets/img/og-image.png">
+
+  <!-- Title -->
+  <title>A Button on Gradient Background using Tailwind CSS | Preline UI, crafted with Tailwind CSS</title>
+
+  <!-- Favicon -->
+  <link rel="shortcut icon" href="../../favicon.ico">
+
+  <!-- Font -->
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+
+  <!-- Link your Tailwind CSS file -->
+  <link rel="stylesheet" href="your_file.css">
+</head>
+
+<body class="dark:bg-slate-900">
+  <script src="../../assets/js/hs.theme-appearance.js"></script>
+
+  <!-- ========== MAIN CONTENT ========== -->
+  <main id="content" role="main">
+    <!-- Announcement Banner -->
+    <div class="bg-gradient-to-r from-red-500 via-purple-400 to-blue-500">
+      <div class="max-w-[85rem] px-4 py-4 sm:px-6 lg:px-8 mx-auto">
+        <!-- Grid -->
+        <div class="grid justify-center md:grid-cols-2 md:justify-between md:items-center gap-2">
+          <div class="text-center md:text-left">
+            <p class="text-xs text-white/[.8] uppercase tracking-wider">
+              Preview of Preline
+            </p>
+            <p class="mt-1 text-white font-medium">
+              Sign up to get unlimited updates. No credit card required.
+            </p>
+          </div>
+          <!-- End Col -->
+
+          <div class="mt-3 text-center md:text-left md:flex md:justify-end md:items-center">
+            <a class="py-3 px-6 inline-flex justify-center items-center gap-2 rounded-full font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm" href="#">
+              Sign up free
+            </a>
+          </div>
+          <!-- End Col -->
+        </div>
+        <!-- End Grid -->
+      </div>
+    </div>
+    <!-- End Announcement Banner -->
+  </main>
+  <!-- ========== END MAIN CONTENT ========== -->
+
+  <!-- JS Implementing Plugins -->
+  <script src="./assets/vendor/preline/dist/preline.js"></script>
+</body>
+</html>