mirror of
https://github.com/nostalgic-css/NES.css.git
synced 2025-02-22 08:12:37 +01:00
Merge branch 'master' into feature/outline
This commit is contained in:
BcRikko
commit
f69b6e29f0
@ -939,14 +939,14 @@ button,
|
||||
box-shadow: 4px 4px #212529,8px 4px #212529,12px 4px #212529,16px 4px #212529,52px 4px #212529,56px 4px #212529,60px 4px #212529,64px 4px #212529,4px 8px #212529,8px 8px #212529,12px 8px #212529,16px 8px #212529,52px 8px #212529,56px 8px #212529,60px 8px #212529,64px 8px #212529,4px 12px #212529,8px 12px #212529,12px 12px #212529,16px 12px #212529,52px 12px #212529,56px 12px #212529,60px 12px #212529,64px 12px #212529,4px 16px #212529,8px 16px #212529,12px 16px #212529,16px 16px #212529,20px 16px #212529,24px 16px #212529,28px 16px #212529,40px 16px #212529,44px 16px #212529,48px 16px #212529,52px 16px #212529,56px 16px #212529,60px 16px #212529,64px 16px #212529,16px 20px #212529,20px 20px #212529,24px 20px #212529,28px 20px #212529,40px 20px #212529,44px 20px #212529,48px 20px #212529,52px 20px #212529,16px 24px #212529,20px 24px #212529,24px 24px #212529,28px 24px #212529,40px 24px #212529,44px 24px #212529,48px 24px #212529,52px 24px #212529,16px 28px #212529,20px 28px #212529,24px 28px #212529,28px 28px #212529,32px 28px #212529,36px 28px #212529,40px 28px #212529,44px 28px #212529,48px 28px #212529,52px 28px #212529,28px 32px #212529,32px 32px #212529,36px 32px #212529,40px 32px #212529,28px 36px #212529,32px 36px #212529,36px 36px #212529,40px 36px #212529,16px 40px #212529,20px 40px #212529,24px 40px #212529,28px 40px #212529,32px 40px #212529,36px 40px #212529,40px 40px #212529,44px 40px #212529,48px 40px #212529,52px 40px #212529,16px 44px #212529,20px 44px #212529,24px 44px #212529,28px 44px #212529,40px 44px #212529,44px 44px #212529,48px 44px #212529,52px 44px #212529,16px 48px #212529,20px 48px #212529,24px 48px #212529,28px 48px #212529,40px 48px #212529,44px 48px #212529,48px 48px #212529,52px 48px #212529,4px 52px #212529,8px 52px #212529,12px 52px #212529,16px 52px #212529,20px 52px #212529,24px 52px #212529,28px 52px #212529,40px 52px #212529,44px 52px #212529,48px 52px #212529,52px 52px #212529,56px 52px #212529,60px 52px #212529,64px 52px #212529,4px 56px #212529,8px 56px #212529,12px 56px #212529,16px 56px #212529,52px 56px #212529,56px 56px #212529,60px 56px #212529,64px 56px #212529,4px 60px #212529,8px 60px #212529,12px 60px #212529,16px 60px #212529,52px 60px #212529,56px 60px #212529,60px 60px #212529,64px 60px #212529,4px 64px #212529,8px 64px #212529,12px 64px #212529,16px 64px #212529,52px 64px #212529,56px 64px #212529,60px 64px #212529,64px 64px #212529;;
|
||||
}
|
||||
|
||||
.nes-logo {
|
||||
.snes-logo {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
height: 33px;
|
||||
}
|
||||
|
||||
.nes-logo::before {
|
||||
.snes-logo::before {
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
left: -3px;
|
||||
|
||||
File diff suppressed because one or more lines are too long
4
css/nes.min.css
vendored
4
css/nes.min.css
vendored
File diff suppressed because one or more lines are too long
12
index.html
12
index.html
@ -30,7 +30,7 @@
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<h1><i class="nes-logo brand"></i>NES.css</h1>
|
||||
<h1><i class="snes-logo brand"></i>NES.css</h1>
|
||||
<p>NES-style CSS Framework.</p>
|
||||
</header>
|
||||
|
||||
@ -55,17 +55,17 @@
|
||||
<div class="containers">
|
||||
<div class="container with-title is-center">
|
||||
<label class="title">Container.is-center</label>
|
||||
<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 class="container is-dark with-title">
|
||||
<label class="title">Container.is-dark</label>
|
||||
<p style="color: white;">Good morning. Thou hast had a good night's sleep I hope.</p>
|
||||
<p style="color: white;">Good morning. Thou hast had a good night's sleep, I hope.</p>
|
||||
</div>
|
||||
<div class="container is-rounded">
|
||||
<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 class="container is-rounded is-dark">
|
||||
<p style="color: white;">Good morning. Thou hast had a good night's sleep I hope.</p>
|
||||
<p style="color: white;">Good morning. Thou hast had a good night's sleep, I hope.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -123,7 +123,7 @@
|
||||
</div>
|
||||
<div class="message -right">
|
||||
<div class="balloon from-right">
|
||||
<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>
|
||||
<i class="bcrikko"></i>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
@import "nes-icon.scss";
|
||||
@import "snes-icon.scss";
|
||||
@import "bcrikko.scss";
|
||||
@import "octocat.scss";
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
.nes-logo {
|
||||
$px: 3px;
|
||||
$logo-colors: (#333, #d7d7d7, #7dbb78, #999cf7, #f40500, #f6f504);
|
||||
$logo-colors: (#3e3634, #c3c3c3, #787973, #bf1710);
|
||||
|
||||
// prettier-ignore
|
||||
$logo: (
|
||||
(0,0,0,0,0,0,1,0,0,0,0,0,0,0,0),
|
||||
(0,0,0,0,0,0,1,0,0,0,0,0,0,0,0),
|
||||
(0,0,0,0,0,0,0,1,0,0,0,0,0,0,0),
|
||||
(0,0,1,1,1,1,1,1,1,1,1,1,1,0,0),
|
||||
(0,1,2,2,2,2,2,2,2,2,2,2,2,1,0),
|
||||
(1,2,2,1,2,2,2,2,2,2,2,4,2,2,1),
|
||||
(1,2,1,1,1,2,2,2,2,2,3,2,5,2,1),
|
||||
(1,2,2,1,2,2,1,2,1,2,2,6,2,2,1),
|
||||
(0,1,2,2,2,2,2,2,2,2,2,2,2,1,0),
|
||||
(0,0,1,1,1,1,1,1,1,1,1,1,1,0,0)
|
||||
(0,0,0,0,0,0,1,0,0,0,0,0,0,0,0),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(2,1,1,1,1,1,1,1,1,1,1,1,1,1,2),
|
||||
(2,1,1,2,1,1,3,3,3,1,1,1,1,1,2),
|
||||
(2,1,2,2,2,1,1,1,1,1,1,1,1,1,2),
|
||||
(2,1,1,2,1,1,3,3,3,1,4,1,4,1,2),
|
||||
(2,1,1,1,1,1,1,1,1,1,1,1,1,1,2),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2)
|
||||
);
|
||||
|
||||
position: relative;
|
||||
|
||||
33
scss/pixel-arts/snes-icon.scss
Normal file
33
scss/pixel-arts/snes-icon.scss
Normal file
@ -0,0 +1,33 @@
|
||||
.snes-logo {
|
||||
$px: 3px;
|
||||
$logo-colors: (#333, #d7d7d7, #7dbb78, #999cf7, #f40500, #f6f504);
|
||||
|
||||
// prettier-ignore
|
||||
$logo: (
|
||||
(0,0,0,0,0,0,1,0,0,0,0,0,0,0,0),
|
||||
(0,0,0,0,0,0,1,0,0,0,0,0,0,0,0),
|
||||
(0,0,0,0,0,0,0,1,0,0,0,0,0,0,0),
|
||||
(0,0,1,1,1,1,1,1,1,1,1,1,1,0,0),
|
||||
(0,1,2,2,2,2,2,2,2,2,2,2,2,1,0),
|
||||
(1,2,2,1,2,2,2,2,2,2,2,4,2,2,1),
|
||||
(1,2,1,1,1,2,2,2,2,2,3,2,5,2,1),
|
||||
(1,2,2,1,2,2,1,2,1,2,2,6,2,2,1),
|
||||
(0,1,2,2,2,2,2,2,2,2,2,2,2,1,0),
|
||||
(0,0,1,1,1,1,1,1,1,1,1,1,1,0,0)
|
||||
);
|
||||
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: $px * 16;
|
||||
height: $px * 11;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: $px * -1;
|
||||
left: $px * -1;
|
||||
content: "";
|
||||
background: transparent;
|
||||
|
||||
@include pixelize($logo, $logo-colors, $px);
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user