Created
July 7, 2015 11:11
-
-
Save scottkellum/e9c6b8615f8c9d8a8bc9 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h1>Vulputate Consectetur Vestibulum Quam Dapibus</h1> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Unde delectus quam debitis dicta modi, laboriosam architecto fuga voluptatibus. Porro eveniet dolores ipsa eum architecto non in temporibus natus magnam perferendis.</p> | |
<p>Consectetur velit pariatur tempore neque perferendis officiis praesentium error a aliquid, ad delectus quas quidem assumenda id nostrum blanditiis at non soluta aut sed iste accusantium nisi laborum? Consequatur, sint.</p> | |
<p>Nulla, doloribus, atque. Molestias culpa nostrum eligendi expedita, dolore iure commodi quas velit voluptatem, tempore eveniet eum voluptates veniam deserunt. Pariatur ipsa saepe corrupti aut perspiciatis, rem nulla nihil. Est.</p> | |
<p>Quidem architecto, totam animi porro quaerat cupiditate ex dolorum cum facere vel. A fugiat cupiditate deserunt reiciendis est odit. Quae laborum, distinctio rerum pariatur autem voluptatem doloribus nostrum dicta libero.</p> | |
<p>Maxime dignissimos provident, at commodi eius unde accusamus praesentium iste, itaque consequatur, eum ab. Modi assumenda dolor dolorum molestias debitis, provident voluptate. Ex porro mollitia voluptatem hic possimus, quaerat in.</p> | |
<h2>Parturient Condimentum Commodo Ligula Tristique</h2> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h3>Vehicula Justo Porta Fringilla Cras</h3> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h4>Venenatis Pharetra Cras Risus Malesuada</h4> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h5>Ridiculus Risus Vehicula Ullamcorper Purus</h5> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ---- | |
// libsass (v3.2.5) | |
// ---- | |
@import "modular-scale"; | |
$ms-ratio: 1.33; | |
$ms-range: | |
1.1 20em, | |
1.333 60em; | |
$line-height: | |
1.1 20em, | |
1.4 40em; | |
body { | |
max-width: 40em; | |
margin: 0 auto; | |
padding: 5% 5% 10%; | |
@include ms-respond(line-height,1, $range: $line-height); | |
} | |
h1, h2, h3, h4, h5 { | |
line-height: 1; | |
margin: 0; | |
} | |
@for $i from 1 through 5 { | |
h#{$i} { | |
@include ms-respond(font-size,($i - 5) * -1) | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
max-width: 40em; | |
margin: 0 auto; | |
padding: 5% 5% 10%; | |
line-height: 1.1em; | |
} | |
@media (min-width: 40em) { | |
body { | |
line-height: 1.4em; | |
} | |
} | |
h1, h2, h3, h4, h5 { | |
line-height: 1; | |
margin: 0; | |
} | |
h1 { | |
font-size: 1.4641em; | |
} | |
@media (min-width: 60em) { | |
h1 { | |
font-size: 3.15733em; | |
} | |
} | |
h2 { | |
font-size: 1.331em; | |
} | |
@media (min-width: 60em) { | |
h2 { | |
font-size: 2.36859em; | |
} | |
} | |
h3 { | |
font-size: 1.21em; | |
} | |
@media (min-width: 60em) { | |
h3 { | |
font-size: 1.77689em; | |
} | |
} | |
h4 { | |
font-size: 1.1em; | |
} | |
@media (min-width: 60em) { | |
h4 { | |
font-size: 1.333em; | |
} | |
} | |
h5 { | |
font-size: 1em; | |
} | |
@media (min-width: 60em) { | |
h5 { | |
font-size: 1em; | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h1>Vulputate Consectetur Vestibulum Quam Dapibus</h1> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Unde delectus quam debitis dicta modi, laboriosam architecto fuga voluptatibus. Porro eveniet dolores ipsa eum architecto non in temporibus natus magnam perferendis.</p> | |
<p>Consectetur velit pariatur tempore neque perferendis officiis praesentium error a aliquid, ad delectus quas quidem assumenda id nostrum blanditiis at non soluta aut sed iste accusantium nisi laborum? Consequatur, sint.</p> | |
<p>Nulla, doloribus, atque. Molestias culpa nostrum eligendi expedita, dolore iure commodi quas velit voluptatem, tempore eveniet eum voluptates veniam deserunt. Pariatur ipsa saepe corrupti aut perspiciatis, rem nulla nihil. Est.</p> | |
<p>Quidem architecto, totam animi porro quaerat cupiditate ex dolorum cum facere vel. A fugiat cupiditate deserunt reiciendis est odit. Quae laborum, distinctio rerum pariatur autem voluptatem doloribus nostrum dicta libero.</p> | |
<p>Maxime dignissimos provident, at commodi eius unde accusamus praesentium iste, itaque consequatur, eum ab. Modi assumenda dolor dolorum molestias debitis, provident voluptate. Ex porro mollitia voluptatem hic possimus, quaerat in.</p> | |
<h2>Parturient Condimentum Commodo Ligula Tristique</h2> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h3>Vehicula Justo Porta Fringilla Cras</h3> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h4>Venenatis Pharetra Cras Risus Malesuada</h4> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> | |
<h5>Ridiculus Risus Vehicula Ullamcorper Purus</h5> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis quas tempore soluta esse ratione sunt, cupiditate quibusdam, libero modi architecto dicta ut, distinctio dolores delectus accusantium laudantium alias. Fugiat, commodi.</p> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment