mirror of
https://github.com/nostalgic-css/NES.css.git
synced 2025-02-24 09:23:50 +01:00
🎉 ロゴアイコンを追加
This commit is contained in:
BcRikko
parent
b5595c5a3c
commit
0b599ed38c
36
css/nes.css
36
css/nes.css
@ -919,6 +919,42 @@ 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 {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
height: 33px;
|
||||
}
|
||||
|
||||
.nes-logo::before {
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
left: -3px;
|
||||
content: "";
|
||||
background: transparent;
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
box-shadow: 21px 3px #333,21px 6px #333,24px 9px #333,9px 12px #333,12px 12px #333,15px 12px #333,18px 12px #333,21px 12px #333,24px 12px #333,27px 12px #333,30px 12px #333,33px 12px #333,36px 12px #333,39px 12px #333,6px 15px #333,9px 15px #d7d7d7,12px 15px #d7d7d7,15px 15px #d7d7d7,18px 15px #d7d7d7,21px 15px #d7d7d7,24px 15px #d7d7d7,27px 15px #d7d7d7,30px 15px #d7d7d7,33px 15px #d7d7d7,36px 15px #d7d7d7,39px 15px #d7d7d7,42px 15px #333,3px 18px #333,6px 18px #d7d7d7,9px 18px #d7d7d7,12px 18px #333,15px 18px #d7d7d7,18px 18px #d7d7d7,21px 18px #d7d7d7,24px 18px #d7d7d7,27px 18px #d7d7d7,30px 18px #d7d7d7,33px 18px #d7d7d7,36px 18px #999cf7,39px 18px #d7d7d7,42px 18px #d7d7d7,45px 18px #333,3px 21px #333,6px 21px #d7d7d7,9px 21px #333,12px 21px #333,15px 21px #333,18px 21px #d7d7d7,21px 21px #d7d7d7,24px 21px #d7d7d7,27px 21px #d7d7d7,30px 21px #d7d7d7,33px 21px #7dbb78,36px 21px #d7d7d7,39px 21px #f40500,42px 21px #d7d7d7,45px 21px #333,3px 24px #333,6px 24px #d7d7d7,9px 24px #d7d7d7,12px 24px #333,15px 24px #d7d7d7,18px 24px #d7d7d7,21px 24px #333,24px 24px #d7d7d7,27px 24px #333,30px 24px #d7d7d7,33px 24px #d7d7d7,36px 24px #f6f504,39px 24px #d7d7d7,42px 24px #d7d7d7,45px 24px #333,6px 27px #333,9px 27px #d7d7d7,12px 27px #d7d7d7,15px 27px #d7d7d7,18px 27px #d7d7d7,21px 27px #d7d7d7,24px 27px #d7d7d7,27px 27px #d7d7d7,30px 27px #d7d7d7,33px 27px #d7d7d7,36px 27px #d7d7d7,39px 27px #d7d7d7,42px 27px #333,9px 30px #333,12px 30px #333,15px 30px #333,18px 30px #333,21px 30px #333,24px 30px #333,27px 30px #333,30px 30px #333,33px 30px #333,36px 30px #333,39px 30px #333;;
|
||||
}
|
||||
|
||||
.bcrikko {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
.bcrikko::before {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
content: "";
|
||||
background: transparent;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
box-shadow: 8px 4px #f9f2d7,12px 4px #f9f2d7,16px 4px #f9f2d7,20px 4px #f9f2d7,24px 4px #f9f2d7,28px 4px #f9f2d7,32px 4px #f9f2d7,36px 4px #f9f2d7,40px 4px #f9f2d7,44px 4px #f9f2d7,48px 4px #f9f2d7,52px 4px #f9f2d7,56px 4px #f9f2d7,60px 4px #f9f2d7,4px 8px #f9f2d7,8px 8px #f9f2d7,12px 8px #f9f2d7,16px 8px #f9f2d7,20px 8px #f9f2d7,24px 8px #f9f2d7,28px 8px #f9f2d7,32px 8px #f9f2d7,36px 8px #f9f2d7,40px 8px #f9f2d7,44px 8px #f9f2d7,48px 8px #f9f2d7,52px 8px #f9f2d7,56px 8px #f9f2d7,60px 8px #f9f2d7,64px 8px #f9f2d7,4px 12px #f9f2d7,8px 12px #f9f2d7,12px 12px #f9f2d7,16px 12px #f9f2d7,20px 12px #f9f2d7,24px 12px #f9f2d7,28px 12px #f9f2d7,32px 12px #f9f2d7,36px 12px #f9f2d7,40px 12px #f9f2d7,44px 12px #f9f2d7,48px 12px #f9f2d7,52px 12px #f9f2d7,56px 12px #f9f2d7,60px 12px #f9f2d7,64px 12px #f9f2d7,4px 16px #f9f2d7,8px 16px #f9f2d7,12px 16px #f9f2d7,16px 16px #f9f2d7,20px 16px #333,24px 16px #333,28px 16px #f9f2d7,32px 16px #f9f2d7,36px 16px #f9f2d7,40px 16px #f9f2d7,44px 16px #333,48px 16px #333,52px 16px #f9f2d7,56px 16px #f9f2d7,60px 16px #f9f2d7,64px 16px #f9f2d7,4px 20px #f9f2d7,8px 20px #f9f2d7,12px 20px #f9f2d7,16px 20px #333,20px 20px #333,24px 20px #fff,28px 20px #333,32px 20px #f9f2d7,36px 20px #f9f2d7,40px 20px #333,44px 20px #333,48px 20px #fff,52px 20px #333,56px 20px #f9f2d7,60px 20px #f9f2d7,64px 20px #f9f2d7,4px 24px #f9f2d7,8px 24px #f9f2d7,12px 24px #f9f2d7,16px 24px #333,20px 24px #333,24px 24px #333,28px 24px #333,32px 24px #f9f2d7,36px 24px #f9f2d7,40px 24px #333,44px 24px #333,48px 24px #333,52px 24px #333,56px 24px #f9f2d7,60px 24px #f9f2d7,64px 24px #f9f2d7,4px 28px #f9f2d7,8px 28px #f9f2d7,12px 28px #f9f2d7,16px 28px #333,20px 28px #333,24px 28px #333,28px 28px #333,32px 28px #f9f2d7,36px 28px #f9f2d7,40px 28px #333,44px 28px #333,48px 28px #333,52px 28px #333,56px 28px #f9f2d7,60px 28px #f9f2d7,64px 28px #f9f2d7,4px 32px #f9f2d7,8px 32px #f9f2d7,12px 32px #f9f2d7,16px 32px #333,20px 32px #333,24px 32px #333,28px 32px #333,32px 32px #f9f2d7,36px 32px #f9f2d7,40px 32px #333,44px 32px #333,48px 32px #333,52px 32px #333,56px 32px #f9f2d7,60px 32px #f9f2d7,64px 32px #f9f2d7,4px 36px #f9f2d7,8px 36px #f9f2d7,12px 36px #f9f2d7,16px 36px #f9f2d7,20px 36px #333,24px 36px #333,28px 36px #f9f2d7,32px 36px #f9f2d7,36px 36px #f9f2d7,40px 36px #f9f2d7,44px 36px #333,48px 36px #333,52px 36px #f9f2d7,56px 36px #f9f2d7,60px 36px #f9f2d7,64px 36px #f9f2d7,4px 40px #f9f2d7,8px 40px #f9f2d7,12px 40px #f9f2d7,16px 40px #f9f2d7,20px 40px #f9f2d7,24px 40px #f9f2d7,28px 40px #f9f2d7,32px 40px #f9f2d7,36px 40px #f9f2d7,40px 40px #f9f2d7,44px 40px #f9f2d7,48px 40px #f9f2d7,52px 40px #f9f2d7,56px 40px #f9f2d7,60px 40px #f9f2d7,64px 40px #f9f2d7,4px 44px #f9f2d7,8px 44px #f9f2d7,12px 44px #f9f2d7,16px 44px #f9f2d7,20px 44px #f9f2d7,24px 44px #f9f2d7,28px 44px #f9f2d7,32px 44px #f9f2d7,36px 44px #f9f2d7,40px 44px #f9f2d7,44px 44px #f9f2d7,48px 44px #f9f2d7,52px 44px #f9f2d7,56px 44px #f9f2d7,60px 44px #f9f2d7,64px 44px #f9f2d7,4px 48px #f9f2d7,8px 48px #f9f2d7,12px 48px #f9f2d7,16px 48px #c5090c,20px 48px #f9f2d7,24px 48px #f9f2d7,28px 48px #f9f2d7,32px 48px #f9f2d7,36px 48px #f9f2d7,40px 48px #f9f2d7,44px 48px #f9f2d7,48px 48px #f9f2d7,52px 48px #c5090c,56px 48px #f9f2d7,60px 48px #f9f2d7,64px 48px #f9f2d7,4px 52px #f9f2d7,8px 52px #f9f2d7,12px 52px #f9f2d7,16px 52px #c5090c,20px 52px #f9f2d7,24px 52px #f9f2d7,28px 52px #f9f2d7,32px 52px #f9f2d7,36px 52px #f9f2d7,40px 52px #f9f2d7,44px 52px #f9f2d7,48px 52px #f9f2d7,52px 52px #c5090c,56px 52px #f9f2d7,60px 52px #f9f2d7,64px 52px #f9f2d7,4px 56px #f9f2d7,8px 56px #f9f2d7,12px 56px #f9f2d7,16px 56px #f9f2d7,20px 56px #c5090c,24px 56px #c5090c,28px 56px #c5090c,32px 56px #c5090c,36px 56px #c5090c,40px 56px #c5090c,44px 56px #c5090c,48px 56px #c5090c,52px 56px #f9f2d7,56px 56px #f9f2d7,60px 56px #f9f2d7,64px 56px #f9f2d7,4px 60px #f9f2d7,8px 60px #f9f2d7,12px 60px #f9f2d7,16px 60px #f9f2d7,20px 60px #f9f2d7,24px 60px #f9f2d7,28px 60px #f9f2d7,32px 60px #f9f2d7,36px 60px #f9f2d7,40px 60px #f9f2d7,44px 60px #f9f2d7,48px 60px #f9f2d7,52px 60px #f9f2d7,56px 60px #f9f2d7,60px 60px #f9f2d7,64px 60px #f9f2d7,8px 64px #f9f2d7,12px 64px #f9f2d7,16px 64px #f9f2d7,20px 64px #f9f2d7,24px 64px #f9f2d7,28px 64px #f9f2d7,32px 64px #f9f2d7,36px 64px #f9f2d7,40px 64px #f9f2d7,44px 64px #f9f2d7,48px 64px #f9f2d7,52px 64px #f9f2d7,56px 64px #f9f2d7,60px 64px #f9f2d7;;
|
||||
}
|
||||
|
||||
.octocat {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
||||
File diff suppressed because one or more lines are too long
6
css/nes.min.css
vendored
6
css/nes.min.css
vendored
File diff suppressed because one or more lines are too long
@ -30,8 +30,9 @@
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<h1>NES.css</h1>
|
||||
<h1><i class="nes-logo"></i>NES.css</h1>
|
||||
<p>NES-style CSS Framework.</p>
|
||||
<i class="bcrikko"></i>
|
||||
</header>
|
||||
|
||||
<a class="github-link" href="https://github.com/BcRikko/NES.css" target="_blank">
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
@import "nes-icon.scss";
|
||||
@import "bcrikko.scss";
|
||||
@import "octocat.scss";
|
||||
|
||||
39
scss/pixel-arts/bcrikko.scss
Normal file
39
scss/pixel-arts/bcrikko.scss
Normal file
@ -0,0 +1,39 @@
|
||||
.bcrikko {
|
||||
$px: 4px;
|
||||
$bcrikko-colors: (#333, #f9f2d7, #c5090c, #fff);
|
||||
|
||||
// prettier-ignore
|
||||
$bcrikko: (
|
||||
(0,2,2,2,2,2,2,2,2,2,2,2,2,2,2,0),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(2,2,2,2,1,1,2,2,2,2,1,1,2,2,2,2),
|
||||
(2,2,2,1,1,4,1,2,2,1,1,4,1,2,2,2),
|
||||
(2,2,2,1,1,1,1,2,2,1,1,1,1,2,2,2),
|
||||
(2,2,2,1,1,1,1,2,2,1,1,1,1,2,2,2),
|
||||
(2,2,2,1,1,1,1,2,2,1,1,1,1,2,2,2),
|
||||
(2,2,2,2,1,1,2,2,2,2,1,1,2,2,2,2),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(2,2,2,3,2,2,2,2,2,2,2,2,3,2,2,2),
|
||||
(2,2,2,3,2,2,2,2,2,2,2,2,3,2,2,2),
|
||||
(2,2,2,2,3,3,3,3,3,3,3,3,2,2,2,2),
|
||||
(2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2),
|
||||
(0,2,2,2,2,2,2,2,2,2,2,2,2,2,2,0),
|
||||
);
|
||||
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: $px * 16;
|
||||
height: $px * 16;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: $px * -1;
|
||||
left: $px * -1;
|
||||
content: "";
|
||||
background: transparent;
|
||||
|
||||
@include pixelize($bcrikko, $bcrikko-colors, $px);
|
||||
}
|
||||
}
|
||||
33
scss/pixel-arts/nes-icon.scss
Normal file
33
scss/pixel-arts/nes-icon.scss
Normal file
@ -0,0 +1,33 @@
|
||||
.nes-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