mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-08-17 19:46:46 +02:00
Code Issues Releases Wiki Activity

refactor(containers): change is-center to is-centered

Browse Source 
BREAKING CHANGE: class is-center change

#178
This commit is contained in:
Igor Guastalla de Lima
2018-12-12 13:09:47 -02:00
parent 3d0dbfae7f
commit 46e5219786
3 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/containers.stories.js
View File

@@ -12,7 +12,7 @@ stories.add('container', () => {
const isRounded = boolean('is-rounded', false) ? 'is-rounded' : ''; const isRounded = boolean('is-rounded', false) ? 'is-rounded' : '';
const alignment = radios('alignment', { const alignment = radios('alignment', {
default: '', default: '',
'is-center': 'is-center', 'is-centered': 'is-centered',
'is-right': 'is-right', 'is-right': 'is-right',
}, ''); }, '');
const selectedClasses = [withTitle, isDark, isRounded, alignment]; const selectedClasses = [withTitle, isDark, isRounded, alignment];

4
index.html
View File

@@ -55,8 +55,8 @@
<section class="nes-container with-title"> <section class="nes-container with-title">
<h2 class="title">Containers</h2> <h2 class="title">Containers</h2>
<div class="containers"> <div class="containers">
<div class="nes-container with-title is-center"> <div class="nes-container with-title is-centered">
<p class="title">Container.is-center</p> <p class="title">Container.is-centered</p>
<p>Good morning. Thou hast had a good night's sleep, I hope.</p> <p>Good morning. Thou hast had a good night's sleep, I hope.</p>
</div> </div>
<div class="nes-container is-dark with-title"> <div class="nes-container is-dark with-title">

6
scss/elements/containers.scss
View File

@@ -31,7 +31,7 @@
border-radius: 4px; border-radius: 4px;
} }
&.is-center { &.is-centered {
text-align: center; text-align: center;
} }
@@ -50,7 +50,7 @@
background-color: $background-color; background-color: $background-color;
} }
&.is-center { &.is-centered {
> .title { > .title {
margin: -2rem auto 1rem; margin: -2rem auto 1rem;
} }
@@ -127,7 +127,7 @@
margin-top: -1.5rem; margin-top: -1.5rem;
} }
&.is-center { &.is-centered {
> .title { > .title {
margin: -1.5rem auto 1rem; margin: -1.5rem auto 1rem;
} }