You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
3.7 KiB
134 lines
3.7 KiB
<div id="grid" class="page-header mb-4 mt-5">
|
|
<h2 class="b-border">Grid</h2>
|
|
<p class="text-muted">Our main used grid compositions are outlined here. Use them to generate one column or various columns layouts.</p>
|
|
</div>
|
|
<div class="container bg-light p-5">
|
|
<div class="row mb-1">
|
|
<div class="col-12">
|
|
<p class="background-primary p-3 text-white small">
|
|
12
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-4">
|
|
<p class="background-primary p-3 text-white small">
|
|
4
|
|
</p>
|
|
</div>
|
|
<div class="col-8">
|
|
<p class="background-primary p-3 text-white small">
|
|
8
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
3
|
|
</p>
|
|
</div>
|
|
<div class="col-9">
|
|
<p class="background-primary p-3 text-white small">
|
|
9
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
<div class="col-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
2
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
3
|
|
</p>
|
|
</div>
|
|
<div class="col-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
3
|
|
</p>
|
|
</div>
|
|
<div class="col-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
3
|
|
</p>
|
|
</div>
|
|
<div class="col-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
3
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-4">
|
|
<p class="background-primary p-3 text-white small">
|
|
4
|
|
</p>
|
|
</div>
|
|
<div class="col-4">
|
|
<p class="background-primary p-3 text-white small">
|
|
4
|
|
</p>
|
|
</div>
|
|
<div class="col-4">
|
|
<p class="background-primary p-3 text-white small">
|
|
4
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-6">
|
|
<p class="background-primary p-3 text-white small">
|
|
6
|
|
</p>
|
|
</div>
|
|
<div class="col-6">
|
|
<p class="background-primary p-3 text-white small">
|
|
6
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-8 offset-2">
|
|
<p class="background-primary p-3 text-white small">
|
|
8
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row mb-1">
|
|
<div class="col-6 offset-3">
|
|
<p class="background-primary p-3 text-white small">
|
|
6
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|