dist.

froala · Dec 18, 2017 · 721f14b · 721f14b
1 parent 50cdd7b
commit 721f14b
Show file tree

Hide file tree

Showing 51 changed files with 8,234 additions and 0 deletions.
diff --git a/dist/call_to_action.html b/dist/call_to_action.html
diff --git a/dist/contacts.html b/dist/contacts.html
diff --git a/dist/contents.html b/dist/contents.html
diff --git a/dist/css.html b/dist/css.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <script src="http://localhost:35729/livereload.js"></script>
+
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
+  <link type="text/css" rel="stylesheet" href="./css/froala_blocks.css">
+</head>
+<body>
+  <section class="fdb-block">
+    <div class="container">
+      <h1>Heading 1</h1>
+      <h2>Heading 2</h2>
+      <h3>Heading 3</h3>
+      <h4>Heading 4</h4>
+      <h5>Heading 5</h5>
+      <h6>Heading 6</h6>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent varius dolor purus, et eleifend lectus congue id. Quisque tempor metus ligula, lacinia rutrum enim ultrices eget. Etiam vitae sem massa. Pellentesque vestibulum ex lectus, nec cursus tortor sollicitudin ut. Nullam volutpat ligula ut odio condimentum, sit amet facilisis nulla tempus. Morbi et hendrerit diam, sit amet luctus orci. Quisque egestas, lacus ac iaculis accumsan, quam eros tempus sem, ac ultrices felis eros porttitor nibh. Nunc condimentum mauris dapibus, pretium ipsum ac, lacinia nisi. Nulla facilisi.</p>
+
+      <br>
+      <h2>Button styles</h2>
+      <p>
+        <a href="#" class="btn">Button</a>
+        <a href="#" class="btn btn-empty">Button Empty</a>
+        <a href="#" class="btn btn-black">Button Black</a>
+        <a href="#" class="btn btn-black btn-empty">Button Black Empty</a>
+
+        <div style="background-color: #5EA1E1; padding: 30px; display: inline-block;">
+          <a href="#" class="btn btn-white">Button White</a>
+          <a href="#" class="btn btn-white btn-empty">Button White Empty</a>
+        </div>
+      </p>
+
+      <br>
+      <h2>Buttons with shadows</h2>
+      <p>
+        <a href="#" class="btn btn-shadow">Button</a>
+        <a href="#" class="btn btn-empty btn-shadow">Button Empty</a>
+        <a href="#" class="btn btn-black btn-shadow">Button Black</a>
+        <a href="#" class="btn btn-black btn-empty btn-shadow">Button Black Empty</a>
+        <div style="background-color: #5EA1E1; padding: 30px; display: inline-block;">
+          <a href="#" class="btn btn-white btn-shadow">Button White</a>
+          <a href="#" class="btn btn-white btn-empty btn-shadow">Button White Empty</a>
+        </div>
+        <a href="#">Link</a>
+      </p>
+
+      <br>
+      <h2>Rounded buttons</h2>
+      <p>
+        <a href="#" class="btn btn-round">Button</a>
+        <a href="#" class="btn btn-empty btn-round">Button Empty</a>
+        <a href="#" class="btn btn-black btn-round">Button Black</a>
+        <a href="#" class="btn btn-black btn-empty btn-round">Button Black Empty</a>
+        <div style="background-color: #5EA1E1; padding: 30px; display: inline-block;">
+          <a href="#" class="btn btn-white btn-round">Button White</a>
+          <a href="#" class="btn btn-white btn-empty btn-round">Button White Empty</a>
+        </div>
+      </p>
+
+      <br>
+      <h1>Heading 1 + P</h1>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+      <h2>Heading 2 + P</h2>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+      <h3>Heading 3 + P</h3>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+      <h4>Heading 4 + P</h4>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+      <h5>Heading 5 + P</h5>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+      <h6>Heading 6 + P</h6>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+  </section>
+</body>
+</html>
diff --git a/dist/css/froala_blocks.css b/dist/css/froala_blocks.css
@@ -0,0 +1,262 @@
+.btn {
+  padding: 9px 26px;
+  background-color: #528bff;
+  color: #FFF;
+  display: inline-block;
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  text-decoration: none;
+  border: solid 2px #528bff;
+  border-radius: 2px;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px; }
+  .btn.btn-empty {
+    background-color: transparent;
+    color: #528bff; }
+  .btn:hover {
+    color: #FFF;
+    background-color: #1f69ff;
+    border-color: #1f69ff; }
+  .btn.btn-black {
+    color: #FFFFFF;
+    background-color: #000000;
+    border-color: #000000; }
+    .btn.btn-black.btn-empty {
+      background-color: transparent;
+      color: #000000; }
+    .btn.btn-black:hover {
+      color: #FFF;
+      background-color: #0d0d0d;
+      border-color: #0d0d0d; }
+  .btn.btn-white {
+    color: #000000;
+    background-color: #FFFFFF;
+    border-color: #FFFFFF; }
+    .btn.btn-white.btn-empty {
+      background-color: transparent;
+      color: #FFFFFF; }
+    .btn.btn-white:hover {
+      color: #000000;
+      background-color: #DEDEDE;
+      border-color: #DEDEDE; }
+  .btn.btn-shadow {
+    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
+  .btn.btn-round {
+    border-radius: 20px;
+    -moz-border-radius: 20px;
+    -webkit-border-radius: 20px;
+    min-width: 150px; }
+
+.team-1.fdb-block img {
+  border-bottom: solid 5px #528bff;
+  border-radius: 0 !important;
+  -moz-border-radius: 0 !important;
+  -webkit-border-radius: 0 !important; }
+
+.team-1.fdb-block .fdb-box {
+  padding: 0; }
+  .team-1.fdb-block .fdb-box .content {
+    padding: 20px; }
+
+.team-2.fdb-block img {
+  border-radius: 100% !important;
+  -moz-border-radius: 100% !important;
+  -webkit-border-radius: 100% !important; }
+
+.team-3.fdb-block img {
+  border-radius: 100% !important;
+  -moz-border-radius: 100% !important;
+  -webkit-border-radius: 100% !important;
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
+
+.fdb-block {
+  font-family: 'Roboto', sans-serif;
+  font-size: 16px;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-rendering: optimizelegibility;
+  padding: 100px 0;
+  color: #444444;
+  position: relative;
+  background-size: cover;
+  background-position: center;
+  overflow: hidden;
+  background-color: #FFFFFF; }
+  .fdb-block.fdb-viewport {
+    min-height: calc(100% - 2 * 100px); }
+    .fdb-block.fdb-viewport .container {
+      min-height: calc(100% - 2 * 100px); }
+  .fdb-block.fdb-image-bg {
+    color: #f2f2f2; }
+  .fdb-block .fdb-box {
+    background: #FFFFFF;
+    color: #444444;
+    padding: 60px 40px;
+    border-radius: 4px;
+    -moz-border-radius: 4px;
+    -webkit-border-radius: 4px;
+    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+    overflow: hidden; }
+  .fdb-block .fdb-touch {
+    border-top: solid 5px #528bff; }
+  .fdb-block h1, .fdb-block .text-h1 {
+    font-size: 2.75rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block h2, .fdb-block .text-h2 {
+    font-size: 2rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block h3, .fdb-block .text-h3 {
+    font-size: 1.125rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block h4, .fdb-block .text-h4 {
+    font-size: 1rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block h5, .fdb-block .text-h5 {
+    font-size: 0.9rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block h6, .fdb-block .text-h6 {
+    font-size: 0.75rem;
+    margin-bottom: .5em;
+    margin-top: .3em;
+    font-weight: 400; }
+  .fdb-block .font-weight-light {
+    font-weight: 300; }
+  .fdb-block img {
+    border-radius: 4px;
+    -moz-border-radius: 4px;
+    -webkit-border-radius: 4px; }
+    .fdb-block img + p, .fdb-block img + h3, .fdb-block img + h4 {
+      margin-top: 20px; }
+    .fdb-block img + h1, .fdb-block img + h2 {
+      margin-top: 40px; }
+  .fdb-block .col-fill-left {
+    width: 50%;
+    position: absolute;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    background-size: cover;
+    background-position: center;
+    z-index: 1; }
+    .fdb-block .col-fill-left + div {
+      position: relative;
+      z-index: 2; }
+  .fdb-block .col-fill-right {
+    width: 50%;
+    position: absolute;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    background-size: cover;
+    background-position: center;
+    z-index: 1; }
+    .fdb-block .col-fill-right + div {
+      position: relative;
+      z-index: 2; }
+  .fdb-block img.fdb-icon {
+    width: auto;
+    width: 60px; }
+  .fdb-block img.fdb-icon-round {
+    width: auto;
+    width: 60px;
+    border-radius: 60px;
+    -moz-border-radius: 60px;
+    -webkit-border-radius: 60px; }
+  .fdb-block .row-100 {
+    height: 100px;
+    width: 100%; }
+  .fdb-block .row-50 {
+    height: 50px;
+    width: 100%; }
+  .fdb-block .row-70 {
+    height: 70px;
+    width: 100%; }
+
+footer {
+  padding: 30px 0 !important; }
+  footer.footer-large {
+    padding: 100px 0 !important; }
+  footer .flex-column .nav-link {
+    padding-left: 0; }
+  footer.bg-dark {
+    background: #2d313c;
+    color: #f2f2f2; }
+    footer.bg-dark a {
+      color: #f2f2f2; }
+  footer a {
+    color: #444444; }
+
+header {
+  background-color: #FFFFFF; }
+  header .navbar-nav a.nav-link {
+    color: #777; }
+    header .navbar-nav a.nav-link:hover {
+      color: #528bff; }
+  header .navbar-nav .active a.nav-link {
+    color: #444444; }
+  header .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); }
+  header.bg-dark .navbar-nav a.nav-link {
+    color: #dcdcdc; }
+    header.bg-dark .navbar-nav a.nav-link:hover {
+      color: #528bff; }
+  header.bg-dark .navbar-nav .active a.nav-link {
+    color: #FFFFFF; }
+  header.bg-dark .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#fff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); }
+
+header + header {
+  border-top: solid 1px #EEE; }
+
+.bg-dark {
+  background-color: #2d313c;
+  color: #f2f2f2; }
+
+.bg-gray {
+  background-color: #fafafa;
+  color: #444444; }
+
+.br {
+  border-radius: 4px;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  overflow: hidden; }
+
+.br-0 {
+  border-radius: 0 !important;
+  -moz-border-radius: 0 !important;
+  -webkit-border-radius: 0 !important; }
+
+.heart {
+  color: #df584e;
+  font-weight: bold; }
+
+*.text-light {
+  font-weight: 300 !important; }
+
+.sl-1 {
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
+  z-index: 2; }
+
+table tr.no-border th, table tr.no-border td {
+  border-top: 0; }