Skip to content

Instantly share code, notes, and snippets.

@jywarren

jywarren/index.html

Last active April 5, 2018 18:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jywarren/b98899a55822bd6756ae747a0d4dfc89 to your computer and use it in GitHub Desktop.
Save jywarren/b98899a55822bd6756ae747a0d4dfc89 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-design-blocks/1.0.2/css/froala_blocks.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>
<section class="fdb-block" data-block-type="contents" data-id="4">
<div class="container">
<div class="row justify-content-center">
<div class="col col-md-8 text-center">
<h1>Froala Design Blocks</h1>
<p class="text-h3">Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far <a href="https://www.froala.com">World of Grammar</a>.</p>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="features" data-id="6">
<div class="container">
<div class="row">
<div class="col-12 text-center">
<h1>Features</h1>
</div>
</div>
<div class="row text-left justify-content-center pt-5">
<div class="col-12 col-md-6 col-lg-5 m-auto">
<h3><strong>Feature One</strong></h3>
<p class="text-h3">Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.</p>
</div>
<div class="col-12 col-md-6 col-lg-5 m-auto pt-3 pt-md-0">
<h3><strong>Feature Two</strong></h3>
<p class="text-h3">Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line.</p>
</div>
</div>
<div class="row text-left justify-content-center pt-lg-4">
<div class="col-12 col-md-6 col-lg-5 m-auto pt-3 pt-lg-0">
<h3><strong>Feature Three</strong></h3>
<p class="text-h3">On her way she met a copy. The copy warned the Little Blind Text, that where it came from it would have been rewritten a thousand times.</p>
</div>
<div class="col-12 col-md-6 col-lg-5 m-auto pt-3 pt-lg-0">
<h3><strong>Feature Four</strong></h3>
<p class="text-h3">A small river named Duden flows by their place far far away, behind the word mountains, far from the countries Vokalia and Consonantia.</p>
</div>
</div>
</div>
</section>
<section class="fdb-block team-2 fp-active" data-block-type="teams" data-id="8">
<div class="container">
<div class="row text-center justify-content-center">
<div class="col-8">
<h1>Meet Our Team</h1>
</div>
</div>
<div class="row-50"></div>
<div class="row text-center justify-content-center">
<div class="col-sm-3 m-sm-auto">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
<h2>Sara Doe</h2>
<p>Founder</p>
</div>
<div class="col-sm-3 m-sm-auto">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
<h2>Sara Doe</h2>
<p>Founder</p>
</div>
<div class="col-sm-3 m-sm-auto">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
<h2>Sara Doe</h2>
<p>Founder</p>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="contents" data-id="10">
<div class="container">
<div class="row justify-content-center">
<div class="col col-md-8 text-center">
<h1>Froala Design Blocks</h1>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="features" data-id="9">
<div class="container">
<div class="row text-left">
<div class="col-12 col-md-4">
<h2>Feature One</h2>
<p><strong>Far far away</strong>, behind the word mountains, far from the countries <a href="https://www.froala.com">Vokalia and Consonantia</a>, there live the blind texts.</p>
</div>
<div class="col-12 col-md-4 pt-5 pt-sm-4 pt-md-0">
<h2>Feature Two</h2>
<p> A small river named Duden flows by their place and supplies it with the necessary regelialia.</p>
</div>
<div class="col-12 col-md-4 pt-5 pt-sm-4 pt-md-0">
<h2>Feature Three</h2>
<p>Even the all-powerful Pointing has no control about the <strong>blind texts</strong> it is an almost unorthographic life.</p>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="contents" data-id="14">
<div class="container">
<div class="row justify-content-center">
<div class="col col-md-8 text-center">
<h1>Froala Design Blocks</h1>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="features" data-id="13">
<div class="container">
<div class="row justify-content-center">
<div class="col-12 text-left">
<h1>Froala Design Blocks</h1>
<p class="text-h3">Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>
</div>
</div>
<div class="row text-left mt-5">
<div class="col-12 col-sm-8 col-md-4 col-lg-3 m-sm-auto mr-md-auto ml-md-0">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_square_1.svg">
<h3><strong>Feature One</strong></h3>
<p>Far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>
</div>
<div class="col-12 col-sm-8 col-md-4 col-lg-3 m-sm-auto pt-5 pt-md-0">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_square_2.svg">
<h3><strong>Feature Two</strong></h3>
<p> It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life.</p>
</div>
<div class="col-12 col-sm-8 col-md-4 col-lg-3 m-sm-auto ml-md-auto mr-md-0 pt-5 pt-md-0">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_square_3.svg">
<h3><strong>Feature Three</strong></h3>
<p>The Big Oxmox advised her not to do so, because there were thousands of bad Commas, wild Question Marks and devious Semikoli, but the Little Blind Text didn’t listen.</p>
</div>
</div>
</div>
</section>
<section class="fdb-block" data-block-type="features" data-id="12">
<div class="container">
<div class="row text-center">
<div class="col-12">
<h1>Features</h1>
</div>
</div>
<div class="row text-left mt-5">
<div class="col-12 col-sm-6 col-lg-3">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature One</strong></h3>
<p>Even the all-powerful Pointing has no control about the blind texts</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-sm-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Two</strong></h3>
<p>Separated they live in Bookmarksgrove right at the coast</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-lg-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Three</strong></h3>
<p>A small river named Duden flows by their place and supplies it</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-lg-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Four</strong></h3>
<p>Far far away, behind the word mountains, far from the countries</p>
</div>
</div>
</div>
</div>
<div class="row text-left pt-3 pt-lg-5">
<div class="col-12 col-sm-6 col-lg-3">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Five</strong></h3>
<p>On her way she met a copy. The copy warned the Little Blind Text.</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-sm-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Six</strong></h3>
<p>Far far away, behind the word mountains, far from the countries</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-lg-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Seven</strong></h3>
<p>Duden flows by their place far far away, behind the word mountains.</p>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-lg-3 pt-3 pt-lg-0">
<div class="row">
<div class="col-3">
<img alt="image" class="img-fluid" src="https://editor-latest.s3.amazonaws.com/design-blocks/block_images/img_round.svg">
</div>
<div class="col-9">
<h3><strong>Feature Eight</strong></h3>
<p>Separated they live in Bookmarksgrove right at the coast</p>
</div>
</div>
</div>
</div>
</div>
</section>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment