mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-09-03 02:53:31 +02:00
Code Issues Releases Wiki Activity

Merge branch 'develop' into master

Browse Source
This commit is contained in:
TCYong
2018-12-07 22:31:57 +08:00
committed by GitHub
parent 3929e2c616 878a818611
commit d5a465f6ba
27 changed files with 15219 additions and 1490 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
scss/base/generic.scss
View File

@@ -9,6 +9,10 @@ samp {
font-family: $font-family;
}
html {
cursor: $cursor-url, auto;
}
body {
font-size: $font-size;
color: $base-color;
@@ -16,6 +20,15 @@ body {
-webkit-font-smoothing: none;
}
label {
cursor: inherit;
}
a,
button {
cursor: $cursor-click-url, pointer;
}
button,
[type="button"],
[type="reset"],

4
scss/base/variables.scss
View File

@@ -1,7 +1,9 @@
// Font
@import url("https://fonts.googleapis.com/css?family=Press+Start+2P");
$font-family: "Press Start 2P" !default;
$font-size: 16px !default;
$base-color: $color-black;
$background-color: $color-white;
$cursor-url: url(../assets/cursor.png);
$cursor-click-url: url(../assets/cursor-click.png);

12
scss/elements/buttons.scss
View File

@@ -83,7 +83,7 @@
margin: $border-size;
text-align: center;
vertical-align: middle;
cursor: pointer;
cursor: $cursor-click-url, pointer;
user-select: none;
@include btn-style($base-color, #fff, #e7e7e7, #adafbc);
@@ -118,6 +118,16 @@
outline: 0;
}
&.is-disabled,
&.is-disabled:hover,
&.is-disabled:focus {
color: $base-color;
cursor: not-allowed;
background-color: #d3d3d3;
box-shadow: inset -4px -4px #adafbc;
opacity: 0.6;
}
// Other styles
// prettier-ignore
$types:

2
scss/elements/checkboxes.scss
View File

@@ -54,7 +54,7 @@
& + span {
position: relative;
cursor: pointer;
cursor: $cursor-click-url, pointer;
}
& + span::before,

12
scss/elements/containers.scss
View File

@@ -72,6 +72,14 @@
}
}
&.is-center {
text-align: center;
}
&.is-right {
text-align: right;
}
&.with-title {
padding-top: 2rem;
@@ -84,16 +92,12 @@
}
&.is-center {
text-align: center;
> .title {
margin: -2rem auto 1rem;
}
}
&.is-right {
text-align: right;
> .title {
margin: -2rem 0 1rem auto;
}

2
scss/elements/radios.scss
View File

@@ -28,7 +28,7 @@
& + span {
position: relative;
cursor: pointer;
cursor: $cursor-click-url, pointer;
}
&:checked + span::before {

47
scss/elements/tables.scss
View File

@@ -1,13 +1,7 @@
.table {
table-layout: fixed;
background-color: #fff;
&.is-centered th {
text-align: center;
}
&.is-bordered {
box-shadow: 4px 0 $base-color, 0 -4px $base-color, -4px 0 $base-color, 0 4px $base-color;
background-color: $background-color;
@mixin thsAndTdsBoxShadow($color) {
th,
td {
padding: 0.5rem;
@@ -16,14 +10,45 @@
tr {
th + th {
box-shadow: -4px 0 $base-color;
box-shadow: -4px 0 $color;
}
td {
box-shadow: 0 -4px $base-color;
box-shadow: 0 -4px $color;
}
td:not(:first-child) {
box-shadow: -4px 0 $base-color, 0 -4px $base-color;
box-shadow: -4px 0 $color, 0 -4px $color;
}
}
}
&.is-centered th {
text-align: center;
}
&.is-bordered {
box-shadow: 4px 0 $base-color, 0 -4px $base-color, -4px 0 $base-color, 0 4px $base-color;
@include thsAndTdsBoxShadow($base-color);
}
&.is-dark {
position: relative;
color: $background-color;
background-color: $base-color;
box-shadow: 4px -4px $base-color, -4px -4px $base-color, -4px 4px $base-color,
4px 4px $base-color;
&::before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: "";
background: linear-gradient(to left, transparent 4px, $background-color 4px) no-repeat,
linear-gradient(to bottom, transparent 4px, $background-color 4px) no-repeat,
linear-gradient(to right, transparent 4px, $background-color 4px) no-repeat,
linear-gradient(to top, transparent 4px, $background-color 4px) no-repeat;
background-position: 100% 0, 100% 0, 0 100%, 0 100%;
background-size: calc(100% - 4px) 4px, 4px calc(100% - 4px);
}
@include thsAndTdsBoxShadow($background-color);
}
}