mirror/mini-css
1
0
Fork 0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-08-05 21:37:23 +02:00
Code Issues Releases Wiki Activity

Center block disabled by default

Browse Source
This commit is contained in:
Angelos Chalaris
2017-01-31 10:31:04 +02:00
parent 1f03644282
commit dd8f436d64
7 changed files with 39 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
dist/mini-default.css vendored
View File

@@ -1720,11 +1720,6 @@ ul.breadcrumbs {
-webkit-transform: rotateZ(-45deg);
transform: rotateZ(-45deg); }
.center-block {
display: block !important;
margin-left: auto !important;
margin-right: auto !important; }
/*
Custom elements for utilities and helper classes.
*/

2
dist/mini-default.min.css vendored
View File

File diff suppressed because one or more lines are too long

19
docs/quick_reference.html
View File

@@ -1084,25 +1084,6 @@
</ul>
</div>
</div>
<div class="section row">
<div class="col-sm-12 col-md-6 col-md-first col-sm-first">
<h3>Floats, centering &amp; clearfix <a href="https://codepen.io/chalarangelo/pen/pNGGjE" target="_blank" class="button small"><i class="fa fa-codepen" aria-hidden="true"></i>&nbsp;View on Codepen</a></h3>
<pre>&lt;span class=&quot;float-left&quot;&gt;Float left&lt;/span&gt;
&lt;span class=&quot;float-right&quot;&gt;Float right&lt;/span&gt;
&lt;span class=&quot;clearfix&quot;&gt;Clearfix&lt;/span&gt;
&lt;span class=&quot;center-block&quot;&gt;Center block&lt;/span&gt;</pre>
</div>
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li>Use <code>.float-left</code> or <code>.float-right</code> for quick floats</li>
<li>Use <code>.center-block</code> for centered blocks</li>
<li>Use <code>.clearfix</code> to clear floats</li>
<li>All classes use <code><span class="fore-secondary">!important</span></code> declarations</li>
<li>Do not combine these classes with each other, except for <code>.clearfix</code></li>
</ul>
</div>
</div>
<div class="section row">
<div class="col-sm-12 col-md-6 col-md-first col-sm-first">
<h3>Generic borders &amp; shadows <a href="https://codepen.io/chalarangelo/pen/aBXXvE" target="_blank" class="button small"><i class="fa fa-codepen" aria-hidden="true"></i>&nbsp;View on Codepen</a></h3>

32
docs/utility.html
View File

@@ -148,38 +148,6 @@
</div>
</div>
</div>
<div class="row">
<div class="col-sm">
<div class="card fluid">
<div class="section">
<h2>Floats, centering &amp; clearfix</h2>
</div>
<div class="section row">
<div class="col-sm-12 col-sm-first">
<p>You can easily make content float left or right, using the <code>.float-left</code> and <code>.float-right</code> classes. Clear all floats, using the <code>.clearfix</code> class, based on the <a href="http://nicolasgallagher.com/micro-clearfix-hack/">micro clearfix</a> by Nicolas Gallagher. Finally, use the <code>.center-block</code> class to make an element center and display as a block.</p>
<h3>Sample code</h3>
<pre>&lt;span class=&quot;float-left&quot;&gt;Float left&lt;/span&gt;
&lt;span class=&quot;float-right&quot;&gt;Float right&lt;/span&gt;
&lt;span class=&quot;clearfix&quot;&gt;Clearfix&lt;/span&gt;
&lt;span class=&quot;center-block&quot;&gt;Center block&lt;/span&gt;</pre>
</div>
</div>
<div class="section">
<h3>Notes</h3>
<ul>
<li>All of these classes utilize <code><span class="fore-secondary">!important</span></code> declarations, so be careful when and how to use them.</li>
</ul>
<hr>
<div class="row">
<div class="col-sm-12">
<pre>&lt;span class=&quot;float-left float-right&quot;&gt;Avoid this&lt;/span&gt;</pre>
<p class="dont"><mark class="secondary">Don't:</mark>&nbsp;Avoid combining any two of the above classes (except if you use <code>.clearfix</code> to temporarily clear a float or something similar), as they might overwrite each other and cause unexpected behavior.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm">
<div class="card fluid">

3
docs/v2/DEVLOG.md
View File

@@ -794,3 +794,6 @@
- Added flags for `floats` and `clearfix`, turned both utilites of by default, as they are mostly useless.
- After removing the two components mentioned above, size is now `6.89KB`.
- `center-block` turned off using a flag by default. File size is now `6.87KB`. All legacy utilites have been disabled by default.
- Updated `utility.html` page to reflect the fact that these utilities are no longer present by default.
- Updated `quick_reference.html` to reflect the fact that these utilities are no longer present by default.

4
src/flavors/mini-default.scss
View File

@@ -572,12 +572,14 @@ $responsive-padding-medium-value: // Padding value for responsive pad
$responsive-padding-large-value:6px 8px; // Padding value for responsive padding on large screens
$include-floats: false; // Should floats be included? (`true`/`false`) [1]
$include-clearfix: false; // Should clearfix be included? (`true`/`false`) [2]
$center-block-name: 'center-block'; // Class name for center block
$include-center-block-name: false; // Should center block be included? (`true`/`false`) [3]
// Notes:
// [1] - If the value of $include-floats is `true`, float classes will be created using the value of $float-prefix to determine the class
// names that will be used.
// [2] - If the value of $include-clearfix is true, a clearfix class will be created using the value of $clearfix-name to determine the
// class name of the clearfix component.
// [3] - If the value of $include-center-block is true, a center block class will be created using the value of $center-block-name to
// determine the class name of the center block class.
// Load modules. If you do not want to use a module, comment out its `@import` statement, along with any mixin `@include`s that are part of
// that module and marked as such below it.
@import '../mini/core';

3
src/mini/_utility.scss
View File

@@ -205,6 +205,7 @@ ul.#{$breadcrumbs-name} {
}
$include-floats: false !default; // Should floats be included?
$include-clearfix: false !default; // Should clearfix be included?
$include-center-block: false !default; // Should center block be included?
// Floats. ATTENTION: Uses !important.
// NOTE: Might be obsolete and not play well with others.
@if $include-floats {
@@ -227,8 +228,10 @@ $include-clearfix: false !default; // Should clearfix be included?
}
}
// Center block. ATTENTION: Uses !important.
@if $include-center-block {
.#{$center-block-name} {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
}
}