RubyGems - fronty-gem - Versions diffs - 0.1.0 - Mend

fronty-gem 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (136) hide show

checksums.yaml +7 -0
data/.gitignore +1 -0
data/Gemfile +6 -0
data/LICENSE.txt +21 -0
data/README.md +39 -0
data/Rakefile +2 -0
data/app/controllers/concerns/dynamic_content.rb +160 -0
data/app/controllers/designers_controller.rb +257 -0
data/app/controllers/pages_controller.rb +23 -0
data/app/views/designers/editor.html.erb +245 -0
data/app/views/pages/404.html.erb +2 -0
data/app/views/pages/welcome.html.erb +2 -0
data/bin/console +14 -0
data/bin/setup +8 -0
data/config/initializers/assets.rb +2 -0
data/config/routes.rb +20 -0
data/fronty-gem.gemspec +37 -0
data/lib/config/routes.rb +3 -0
data/lib/fronty-gem.rb +5 -0
data/lib/fronty-gem/version.rb +3 -0
data/lib/tasks/fronty.rake +14 -0
data/vendor/assets/demo/album/album.css +39 -0
data/vendor/assets/demo/album/index.html +231 -0
data/vendor/assets/demo/blog/blog.css +130 -0
data/vendor/assets/demo/blog/index.html +230 -0
data/vendor/assets/demo/carousel/carousel.css +91 -0
data/vendor/assets/demo/carousel/index.html +186 -0
data/vendor/assets/demo/narrow-jumbotron/index.html +82 -0
data/vendor/assets/demo/narrow-jumbotron/narrow-jumbotron.css +80 -0
data/vendor/assets/demo/offcanvas/index.html +158 -0
data/vendor/assets/demo/offcanvas/offcanvas.css +79 -0
data/vendor/assets/demo/offcanvas/offcanvas.js +7 -0
data/vendor/assets/demo/pricing/index.html +141 -0
data/vendor/assets/demo/pricing/pricing.css +25 -0
data/vendor/assets/demo/product/index.html +177 -0
data/vendor/assets/demo/product/product.css +79 -0
data/vendor/assets/fonts/line-awesome.eot +0 -0
data/vendor/assets/fonts/line-awesome.svg +2628 -0
data/vendor/assets/fonts/line-awesome.ttf +0 -0
data/vendor/assets/fonts/line-awesome.woff +0 -0
data/vendor/assets/fonts/line-awesome.woff2 +0 -0
data/vendor/assets/images/icons/alert.svg +66 -0
data/vendor/assets/images/icons/arrow-down.svg +60 -0
data/vendor/assets/images/icons/arrow-right.svg +60 -0
data/vendor/assets/images/icons/badge.svg +81 -0
data/vendor/assets/images/icons/breadcrumbs.svg +77 -0
data/vendor/assets/images/icons/button.svg +78 -0
data/vendor/assets/images/icons/button_group.svg +81 -0
data/vendor/assets/images/icons/button_toolbar.svg +87 -0
data/vendor/assets/images/icons/cart.svg +62 -0
data/vendor/assets/images/icons/categories.svg +62 -0
data/vendor/assets/images/icons/chart.svg +1 -0
data/vendor/assets/images/icons/checkbox.svg +66 -0
data/vendor/assets/images/icons/checkout.svg +62 -0
data/vendor/assets/images/icons/chevron-down.svg +67 -0
data/vendor/assets/images/icons/chevron-right.svg +67 -0
data/vendor/assets/images/icons/components/cart.svg +16 -0
data/vendor/assets/images/icons/components/checkbox.svg +1 -0
data/vendor/assets/images/icons/components/contact-form.svg +13 -0
data/vendor/assets/images/icons/components/map.svg +12 -0
data/vendor/assets/images/icons/container.svg +66 -0
data/vendor/assets/images/icons/facebook.svg +1 -0
data/vendor/assets/images/icons/file.svg +1 -0
data/vendor/assets/images/icons/filters.svg +62 -0
data/vendor/assets/images/icons/folder.svg +1 -0
data/vendor/assets/images/icons/form.svg +66 -0
data/vendor/assets/images/icons/grid_row.svg +66 -0
data/vendor/assets/images/icons/heading.svg +66 -0
data/vendor/assets/images/icons/hr.svg +66 -0
data/vendor/assets/images/icons/image.svg +62 -0
data/vendor/assets/images/icons/instagram.svg +62 -0
data/vendor/assets/images/icons/jumbotron.svg +66 -0
data/vendor/assets/images/icons/label.svg +73 -0
data/vendor/assets/images/icons/link.svg +1 -0
data/vendor/assets/images/icons/list_group.svg +66 -0
data/vendor/assets/images/icons/map.svg +62 -0
data/vendor/assets/images/icons/maps.png +0 -0
data/vendor/assets/images/icons/minus_round.svg +1 -0
data/vendor/assets/images/icons/navbar.svg +66 -0
data/vendor/assets/images/icons/pagination.svg +68 -0
data/vendor/assets/images/icons/panel.svg +66 -0
data/vendor/assets/images/icons/paragraph.svg +66 -0
data/vendor/assets/images/icons/paypal.svg +1 -0
data/vendor/assets/images/icons/play-button.svg +42 -0
data/vendor/assets/images/icons/plus_round.svg +1 -0
data/vendor/assets/images/icons/product.png +0 -0
data/vendor/assets/images/icons/product.svg +62 -0
data/vendor/assets/images/icons/product_gallery.svg +68 -0
data/vendor/assets/images/icons/products.svg +62 -0
data/vendor/assets/images/icons/progressbar.svg +67 -0
data/vendor/assets/images/icons/radio.svg +66 -0
data/vendor/assets/images/icons/search.svg +69 -0
data/vendor/assets/images/icons/select_input.svg +67 -0
data/vendor/assets/images/icons/slider.svg +62 -0
data/vendor/assets/images/icons/table.svg +66 -0
data/vendor/assets/images/icons/text_area.svg +66 -0
data/vendor/assets/images/icons/text_input.svg +66 -0
data/vendor/assets/images/icons/twitter.svg +55 -0
data/vendor/assets/images/icons/user.svg +62 -0
data/vendor/assets/images/icons/video.svg +45 -0
data/vendor/assets/images/icons/well.svg +82 -0
data/vendor/assets/images/svg/icon-a.svg +235 -0
data/vendor/assets/images/svg/icon-b.svg +224 -0
data/vendor/assets/images/svg/icon-c.svg +224 -0
data/vendor/assets/images/svg/icon-d.svg +224 -0
data/vendor/assets/images/svg/logo.svg +41 -0
data/vendor/assets/images/thumbnails/XX__.png +0 -0
data/vendor/assets/images/thumbnails/comparison.png +0 -0
data/vendor/assets/images/thumbnails/details-with-title-complate.png +0 -0
data/vendor/assets/images/thumbnails/details.png +0 -0
data/vendor/assets/images/thumbnails/footer-with-links.png +0 -0
data/vendor/assets/images/thumbnails/footer.png +0 -0
data/vendor/assets/images/thumbnails/header.png +0 -0
data/vendor/assets/images/thumbnails/jumbotron-with-title.png +0 -0
data/vendor/assets/images/thumbnails/jumbotron.png +0 -0
data/vendor/assets/images/thumbnails/linkbar.png +0 -0
data/vendor/assets/images/thumbnails/liticle.png +0 -0
data/vendor/assets/images/thumbnails/logobar.png +0 -0
data/vendor/assets/images/thumbnails/page-title.png +0 -0
data/vendor/assets/images/thumbnails/quiz-complate.png +0 -0
data/vendor/assets/images/thumbnails/quiz-with-hero-complate.png +0 -0
data/vendor/assets/images/thumbnails/result-complate.png +0 -0
data/vendor/assets/images/thumbnails/review-section.png +0 -0
data/vendor/assets/images/thumbnails/review-v2-complate.png +0 -0
data/vendor/assets/images/thumbnails/review-v3-complate.png +0 -0
data/vendor/assets/images/thumbnails/review_section_v4_complate.png +0 -0
data/vendor/assets/images/thumbnails/split-hero-complate.png +0 -0
data/vendor/assets/images/thumbnails/subtitle-with-button-complate.png +0 -0
data/vendor/assets/images/thumbnails/subtitle-with-link.png +0 -0
data/vendor/assets/images/thumbnails/unknown-complate.png +0 -0
data/vendor/assets/images/thumbnails/unknown1-complate.png +0 -0
data/vendor/assets/images/thumbnails/video-section-complate.png +0 -0
data/vendor/assets/javascript/fronty-designer-init.js +491 -0
data/vendor/assets/javascript/fronty-designer.js +16518 -0
data/vendor/assets/stylesheets/fronty-designer.css +11255 -0
metadata +235 -0

data/vendor/assets/demo/offcanvas/offcanvas.css ADDED Viewed

@@ -0,0 +1,79 @@
+html,
+body {
+  overflow-x: hidden; /* Prevent scroll on narrow devices */
+}
+body {
+  padding-top: 56px;
+}
+@media (max-width: 991.98px) {
+  .offcanvas-collapse {
+    position: fixed;
+    top: 56px; /* Height of navbar */
+    bottom: 0;
+    left: 100%;
+    width: 100%;
+    padding-right: 1rem;
+    padding-left: 1rem;
+    overflow-y: auto;
+    visibility: hidden;
+    background-color: #343a40;
+    transition-timing-function: ease-in-out;
+    transition-duration: .3s;
+    transition-property: left, visibility;
+  }
+  .offcanvas-collapse.open {
+    left: 0;
+    visibility: visible;
+  }
+}
+.nav-scroller {
+  position: relative;
+  z-index: 2;
+  height: 2.75rem;
+  overflow-y: hidden;
+}
+.nav-scroller .nav {
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  padding-bottom: 1rem;
+  margin-top: -1px;
+  overflow-x: auto;
+  color: rgba(255, 255, 255, .75);
+  text-align: center;
+  white-space: nowrap;
+  -webkit-overflow-scrolling: touch;
+}
+.nav-underline .nav-link {
+  padding-top: .75rem;
+  padding-bottom: .75rem;
+  font-size: .875rem;
+  color: #6c757d;
+}
+.nav-underline .nav-link:hover {
+  color: #007bff;
+}
+.nav-underline .active {
+  font-weight: 500;
+  color: #343a40;
+}
+.text-white-50 { color: rgba(255, 255, 255, .5); }
+.bg-purple { background-color: #6f42c1; }
+.border-bottom { border-bottom: 1px solid #e5e5e5; }
+.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }
+.lh-100 { line-height: 1; }
+.lh-125 { line-height: 1.25; }
+.lh-150 { line-height: 1.5; }

data/vendor/assets/demo/offcanvas/offcanvas.js ADDED Viewed

@@ -0,0 +1,7 @@
+$(function () {
+  'use strict'
+  $('[data-toggle="offcanvas"]').on('click', function () {
+    $('.offcanvas-collapse').toggleClass('open')
+  })
+})

data/vendor/assets/demo/pricing/index.html ADDED Viewed

@@ -0,0 +1,141 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <meta name="author" content="">
+    <link rel="icon" href="../../../../favicon.ico">
+    <title>Pricing example for Bootstrap</title>
+    <!-- Bootstrap core CSS -->
+    <link href="../../css/editor.css" rel="stylesheet">
+    <!-- Custom styles for this template -->
+    <link href="pricing.css" rel="stylesheet">
+  </head>
+  <body>
+    <div class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom box-shadow">
+      <h5 class="my-0 mr-md-auto font-weight-normal">Company name</h5>
+      <nav class="my-2 my-md-0 mr-md-3">
+        <a class="p-2 text-dark" href="#">Features</a>
+        <a class="p-2 text-dark" href="#">Enterprise</a>
+        <a class="p-2 text-dark" href="#">Support</a>
+        <a class="p-2 text-dark" href="#">Pricing</a>
+      </nav>
+      <a class="btn btn-outline-primary" href="#">Sign up</a>
+    </div>
+    <div class="pricing-header px-3 py-3 pt-md-5 pb-md-4 mx-auto text-center">
+      <h1 class="display-4">Pricing</h1>
+      <p class="lead">Quickly build an effective pricing table for your potential customers with this Bootstrap example. It's built with default Bootstrap components and utilities with little customization.</p>
+    </div>
+    <div class="container">
+      <div class="card-deck mb-3 text-center">
+        <div class="card mb-4 box-shadow">
+          <div class="card-header">
+            <h4 class="my-0 font-weight-normal">Free</h4>
+          </div>
+          <div class="card-body">
+            <h1 class="card-title pricing-card-title">$0 <small class="text-muted">/ mo</small></h1>
+            <ul class="list-unstyled mt-3 mb-4">
+              <li>10 users included</li>
+              <li>2 GB of storage</li>
+              <li>Email support</li>
+              <li>Help center access</li>
+            </ul>
+            <button type="button" class="btn btn-lg btn-block btn-outline-primary">Sign up for free</button>
+          </div>
+        </div>
+        <div class="card mb-4 box-shadow">
+          <div class="card-header">
+            <h4 class="my-0 font-weight-normal">Pro</h4>
+          </div>
+          <div class="card-body">
+            <h1 class="card-title pricing-card-title">$15 <small class="text-muted">/ mo</small></h1>
+            <ul class="list-unstyled mt-3 mb-4">
+              <li>20 users included</li>
+              <li>10 GB of storage</li>
+              <li>Priority email support</li>
+              <li>Help center access</li>
+            </ul>
+            <button type="button" class="btn btn-lg btn-block btn-primary">Get started</button>
+          </div>
+        </div>
+        <div class="card mb-4 box-shadow">
+          <div class="card-header">
+            <h4 class="my-0 font-weight-normal">Enterprise</h4>
+          </div>
+          <div class="card-body">
+            <h1 class="card-title pricing-card-title">$29 <small class="text-muted">/ mo</small></h1>
+            <ul class="list-unstyled mt-3 mb-4">
+              <li>30 users included</li>
+              <li>15 GB of storage</li>
+              <li>Phone and email support</li>
+              <li>Help center access</li>
+            </ul>
+            <button type="button" class="btn btn-lg btn-block btn-primary">Contact us</button>
+          </div>
+        </div>
+      </div>
+      <footer class="pt-4 my-md-5 pt-md-5 border-top">
+        <div class="row">
+          <div class="col-12 col-md">
+            <img class="mb-2" src="https://getbootstrap.com/assets/brand/bootstrap-solid.svg" alt="" width="24" height="24">
+            <small class="d-block mb-3 text-muted">&copy; 2017-2018</small>
+          </div>
+          <div class="col-6 col-md">
+            <h5>Features</h5>
+            <ul class="list-unstyled text-small">
+              <li><a class="text-muted" href="#">Cool stuff</a></li>
+              <li><a class="text-muted" href="#">Random feature</a></li>
+              <li><a class="text-muted" href="#">Team feature</a></li>
+              <li><a class="text-muted" href="#">Stuff for developers</a></li>
+              <li><a class="text-muted" href="#">Another one</a></li>
+              <li><a class="text-muted" href="#">Last time</a></li>
+            </ul>
+          </div>
+          <div class="col-6 col-md">
+            <h5>Resources</h5>
+            <ul class="list-unstyled text-small">
+              <li><a class="text-muted" href="#">Resource</a></li>
+              <li><a class="text-muted" href="#">Resource name</a></li>
+              <li><a class="text-muted" href="#">Another resource</a></li>
+              <li><a class="text-muted" href="#">Final resource</a></li>
+            </ul>
+          </div>
+          <div class="col-6 col-md">
+            <h5>About</h5>
+            <ul class="list-unstyled text-small">
+              <li><a class="text-muted" href="#">Team</a></li>
+              <li><a class="text-muted" href="#">Locations</a></li>
+              <li><a class="text-muted" href="#">Privacy</a></li>
+              <li><a class="text-muted" href="#">Terms</a></li>
+            </ul>
+          </div>
+        </div>
+      </footer>
+    </div>
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+    <script src="../../js/vendor/popper.min.js"></script>
+    <script src="../../js/bootstrap.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/holderjs@2.9.4/holder.js"></script>
+    <script>
+      Holder.addTheme('thumb', {
+        bg: '#55595c',
+        fg: '#eceeef',
+        text: 'Thumbnail'
+      });
+    </script>
+  </body>
+</html>

data/vendor/assets/demo/pricing/pricing.css ADDED Viewed

@@ -0,0 +1,25 @@
+html {
+  font-size: 14px;
+}
+@media (min-width: 768px) {
+  html {
+    font-size: 16px;
+  }
+}
+.container {
+  max-width: 960px;
+}
+.pricing-header {
+  max-width: 700px;
+}
+.card-deck .card {
+  min-width: 220px;
+}
+.border-top { border-top: 1px solid #e5e5e5; }
+.border-bottom { border-bottom: 1px solid #e5e5e5; }
+.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }

data/vendor/assets/demo/product/index.html ADDED Viewed

@@ -0,0 +1,177 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <meta name="author" content="">
+    <link rel="icon" href="../../../../favicon.ico">
+    <title>Product example for Bootstrap</title>
+    <!-- Bootstrap core CSS -->
+    <link href="../../css/editor.css" rel="stylesheet">
+    <!-- Custom styles for this template -->
+    <link href="product.css" rel="stylesheet">
+  </head>
+  <body>
+    <nav class="site-header sticky-top py-1">
+      <div class="container d-flex flex-column flex-md-row justify-content-between">
+        <a class="py-2" href="#">
+          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="d-block mx-auto"><circle cx="12" cy="12" r="10"></circle><line x1="14.31" y1="8" x2="20.05" y2="17.94"></line><line x1="9.69" y1="8" x2="21.17" y2="8"></line><line x1="7.38" y1="12" x2="13.12" y2="2.06"></line><line x1="9.69" y1="16" x2="3.95" y2="6.06"></line><line x1="14.31" y1="16" x2="2.83" y2="16"></line><line x1="16.62" y1="12" x2="10.88" y2="21.94"></line></svg>
+        </a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Tour</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Product</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Features</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Enterprise</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Support</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Pricing</a>
+        <a class="py-2 d-none d-md-inline-block" href="#">Cart</a>
+      </div>
+    </nav>
+    <div class="position-relative overflow-hidden p-3 p-md-5 m-md-3 text-center bg-light">
+      <div class="col-md-5 p-lg-5 mx-auto my-5">
+        <h1 class="display-4 font-weight-normal">Punny headline</h1>
+        <p class="lead font-weight-normal">And an even wittier subheading to boot. Jumpstart your marketing efforts with this example based on Apple's marketing pages.</p>
+        <a class="btn btn-outline-secondary" href="#">Coming soon</a>
+      </div>
+      <div class="product-device box-shadow d-none d-md-block"></div>
+      <div class="product-device product-device-2 box-shadow d-none d-md-block"></div>
+    </div>
+    <div class="d-md-flex flex-md-equal w-100 my-md-3 pl-md-3">
+      <div class="bg-dark mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center text-white overflow-hidden">
+        <div class="my-3 py-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-light box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 p-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-dark box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+    </div>
+    <div class="d-md-flex flex-md-equal w-100 my-md-3 pl-md-3">
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 p-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-dark box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+      <div class="bg-primary mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center text-white overflow-hidden">
+        <div class="my-3 py-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-light box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+    </div>
+    <div class="d-md-flex flex-md-equal w-100 my-md-3 pl-md-3">
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 p-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-white box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 py-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-white box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+    </div>
+    <div class="d-md-flex flex-md-equal w-100 my-md-3 pl-md-3">
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 p-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-white box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+      <div class="bg-light mr-md-3 pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden">
+        <div class="my-3 py-3">
+          <h2 class="display-5">Another headline</h2>
+          <p class="lead">And an even wittier subheading.</p>
+        </div>
+        <div class="bg-white box-shadow mx-auto" style="width: 80%; height: 300px; border-radius: 21px 21px 0 0;"></div>
+      </div>
+    </div>
+    <footer class="container py-5">
+      <div class="row">
+        <div class="col-12 col-md">
+          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="d-block mb-2"><circle cx="12" cy="12" r="10"></circle><line x1="14.31" y1="8" x2="20.05" y2="17.94"></line><line x1="9.69" y1="8" x2="21.17" y2="8"></line><line x1="7.38" y1="12" x2="13.12" y2="2.06"></line><line x1="9.69" y1="16" x2="3.95" y2="6.06"></line><line x1="14.31" y1="16" x2="2.83" y2="16"></line><line x1="16.62" y1="12" x2="10.88" y2="21.94"></line></svg>
+          <small class="d-block mb-3 text-muted">&copy; 2017-2018</small>
+        </div>
+        <div class="col-6 col-md">
+          <h5>Features</h5>
+          <ul class="list-unstyled text-small">
+            <li><a class="text-muted" href="#">Cool stuff</a></li>
+            <li><a class="text-muted" href="#">Random feature</a></li>
+            <li><a class="text-muted" href="#">Team feature</a></li>
+            <li><a class="text-muted" href="#">Stuff for developers</a></li>
+            <li><a class="text-muted" href="#">Another one</a></li>
+            <li><a class="text-muted" href="#">Last time</a></li>
+          </ul>
+        </div>
+        <div class="col-6 col-md">
+          <h5>Resources</h5>
+          <ul class="list-unstyled text-small">
+            <li><a class="text-muted" href="#">Resource</a></li>
+            <li><a class="text-muted" href="#">Resource name</a></li>
+            <li><a class="text-muted" href="#">Another resource</a></li>
+            <li><a class="text-muted" href="#">Final resource</a></li>
+          </ul>
+        </div>
+        <div class="col-6 col-md">
+          <h5>Resources</h5>
+          <ul class="list-unstyled text-small">
+            <li><a class="text-muted" href="#">Business</a></li>
+            <li><a class="text-muted" href="#">Education</a></li>
+            <li><a class="text-muted" href="#">Government</a></li>
+            <li><a class="text-muted" href="#">Gaming</a></li>
+          </ul>
+        </div>
+        <div class="col-6 col-md">
+          <h5>About</h5>
+          <ul class="list-unstyled text-small">
+            <li><a class="text-muted" href="#">Team</a></li>
+            <li><a class="text-muted" href="#">Locations</a></li>
+            <li><a class="text-muted" href="#">Privacy</a></li>
+            <li><a class="text-muted" href="#">Terms</a></li>
+          </ul>
+        </div>
+      </div>
+    </footer>
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+    <script src="../../js/vendor/popper.min.js"></script>
+    <script src="../../js/bootstrap.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/holderjs@2.9.4/holder.js"></script>
+    <script>
+      Holder.addTheme('thumb', {
+        bg: '#55595c',
+        fg: '#eceeef',
+        text: 'Thumbnail'
+      });
+    </script>
+  </body>
+</html>

data/vendor/assets/demo/product/product.css ADDED Viewed

@@ -0,0 +1,79 @@
+.container {
+  max-width: 960px;
+}
+/*
+ * Custom translucent site header
+ */
+.site-header {
+  background-color: rgba(0, 0, 0, .85);
+  -webkit-backdrop-filter: saturate(180%) blur(20px);
+  backdrop-filter: saturate(180%) blur(20px);
+}
+.site-header a {
+  color: #999;
+  transition: ease-in-out color .15s;
+}
+.site-header a:hover {
+  color: #fff;
+  text-decoration: none;
+}
+/*
+ * Dummy devices (replace them with your own or something else entirely!)
+ */
+.product-device {
+  position: absolute;
+  right: 10%;
+  bottom: -30%;
+  width: 300px;
+  height: 540px;
+  background-color: #333;
+  border-radius: 21px;
+  -webkit-transform: rotate(30deg);
+  transform: rotate(30deg);
+}
+.product-device::before {
+  position: absolute;
+  top: 10%;
+  right: 10px;
+  bottom: 10%;
+  left: 10px;
+  content: "";
+  background-color: rgba(255, 255, 255, .1);
+  border-radius: 5px;
+}
+.product-device-2 {
+  top: -25%;
+  right: auto;
+  bottom: 0;
+  left: 5%;
+  background-color: #e5e5e5;
+}
+/*
+ * Extra utilities
+ */
+.border-top { border-top: 1px solid #e5e5e5; }
+.border-bottom { border-bottom: 1px solid #e5e5e5; }
+.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }
+.flex-equal > * {
+  -ms-flex: 1;
+  flex: 1;
+}
+@media (min-width: 768px) {
+  .flex-md-equal > * {
+    -ms-flex: 1;
+    flex: 1;
+  }
+}
+.overflow-hidden { overflow: hidden; }