mirror of
https://github.com/SpaceVim/SpaceVim.git
synced 2025-01-23 17:30:04 +08:00
Mod stylesheets
This commit is contained in:
wsdjeg
parent
fa96716ed7
commit
dd6b843ba4
394
docs/stylesheets/styles.scss
Normal file
394
docs/stylesheets/styles.scss
Normal file
@ -0,0 +1,394 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansLight';
|
||||
src: url('../fonts/OpenSans-Light-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansLightItalic';
|
||||
src: url('../fonts/OpenSans-LightItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansRegular';
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansItalic';
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansSemibold';
|
||||
src: url('../fonts/OpenSans-Semibold-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansSemiboldItalic';
|
||||
src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansBold';
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSansBoldItalic';
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
}
|
||||
|
||||
@import "normalize";
|
||||
@import "compass/css3";
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
|
||||
-moz-box-sizing: border-box; /* Firefox, other Gecko */
|
||||
box-sizing: border-box; /* Opera/IE 8+ */
|
||||
}
|
||||
|
||||
$color-yellow: #FFC107;
|
||||
$color-green: #8bc34a;
|
||||
$border-radius: 2px;
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
padding-bottom: 20px;
|
||||
margin: 0px;
|
||||
font: 14px/1.47 "OpenSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: rgba(#fff, .7);
|
||||
font-weight: normal;
|
||||
background: #252525;
|
||||
background-attachment: fixed !important;
|
||||
@include background(linear_gradient(#2a2a29, #1c1c1c));
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
p, ul, ol, table, pre, dl {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
h1 { font-size: 3em; }
|
||||
h2 { font-size: 2.75em; }
|
||||
h3 { font-size: 2.5em; }
|
||||
h4 { font-size: 2.25em; }
|
||||
h5 { font-size: 2em; }
|
||||
h6 { font-size: 1.75em; }
|
||||
|
||||
p {
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $color-yellow;
|
||||
font-weight: 400;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px dotted;
|
||||
transition: color 150ms ease;
|
||||
|
||||
&:hover {
|
||||
color: lighten($color-yellow, 15%);
|
||||
}
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-top: -0.6em;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
background-color: $color-green;
|
||||
border: 1px solid lighten($color-green, 3%);
|
||||
border-radius: $border-radius;
|
||||
box-shadow: 0 1px 2px rgba(#000, .3);
|
||||
padding: 6px 12px;
|
||||
display:inline-block;
|
||||
text-align:center;
|
||||
transition: all 150ms ease;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
border: 1px solid darken($color-green, 3%);
|
||||
background-color: darken($color-green, 5%);
|
||||
box-shadow: 0;
|
||||
}
|
||||
}
|
||||
|
||||
ul{
|
||||
list-style-image:url('../images/bullet.png');
|
||||
}
|
||||
|
||||
strong {
|
||||
font-family: 'OpenSansBold', "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width:800px;
|
||||
margin:0 auto;
|
||||
position:relative;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
section img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 3px solid $color-yellow;
|
||||
margin:0;
|
||||
padding:0 0 0 20px;
|
||||
font-style:italic;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: 'Lucida Sans', Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal;
|
||||
color: #efefef;
|
||||
background: #191919;
|
||||
font-size: 14px;
|
||||
margin: 0 4px;
|
||||
padding: 2px 8px;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding:8px 15px;
|
||||
background: #191919;
|
||||
border-radius: $border-radius;
|
||||
@include box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
|
||||
overflow: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
code {
|
||||
color: #efefef;
|
||||
text-shadow: 0px 1px 0px #000;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
width:100%;
|
||||
border-collapse:collapse;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align:left;
|
||||
padding:5px 10px;
|
||||
border-bottom:1px solid #434343;
|
||||
color: #b6b6b6;
|
||||
font-family: 'OpenSansSemibold', "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
td {
|
||||
text-align:left;
|
||||
padding:5px 10px;
|
||||
border-bottom:1px solid #434343;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
outline: none;
|
||||
height: 3px;
|
||||
background: transparent url('../images/hr.gif') center center repeat-x;
|
||||
margin: 0 0 20px;
|
||||
}
|
||||
|
||||
dt {
|
||||
color:#F0E7D5;
|
||||
font-family: 'OpenSansSemibold', "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: 100%;
|
||||
max-width: 650px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
#header {
|
||||
z-index: 100;
|
||||
position: fixed;
|
||||
left:0;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
background: url(../images/nav-bg.gif) #353535;
|
||||
border-bottom: 4px solid #434343;
|
||||
@include box-shadow(0px 1px 3px rgba(0,0,0,.25));
|
||||
padding: 10px 0;
|
||||
overflow: hidden;
|
||||
|
||||
.nav {
|
||||
float: right;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
.download-title {
|
||||
display: inline-block;
|
||||
line-height: 36px;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
color: rgba(#fff, .6);
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 30px 0px 50px 0px;
|
||||
margin: 20px 0;
|
||||
margin-top: 70px;
|
||||
|
||||
ul li {
|
||||
line-height: 2.4em;
|
||||
}
|
||||
|
||||
#title {
|
||||
border: 0;
|
||||
outline: none;
|
||||
margin: 0 0 50px 0;
|
||||
padding: 0 0 5px 0;
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
line-height: 1em;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h5 {
|
||||
color: rgba(#fff, .6);
|
||||
text-align: center;
|
||||
font-weight: 100;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.credits {
|
||||
font-size: 12px;
|
||||
color: rgba(#fff, .5);
|
||||
margin-top: 0px;
|
||||
|
||||
&.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
&.right {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 720px) {
|
||||
|
||||
#title {
|
||||
.credits {
|
||||
display: block;
|
||||
width: 100%;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
|
||||
.left {
|
||||
float: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: none;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 480px) {
|
||||
|
||||
#header {
|
||||
.wrapper {
|
||||
padding: 0 10px;
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user