[init] initial commit
This commit is contained in:
276
less/highlight.less
Normal file
276
less/highlight.less
Normal file
@ -0,0 +1,276 @@
|
||||
// Atom's One Dark theme for Jekyll
|
||||
// Credits: https://github.com/mgyongyosi/OneDarkJekyll/
|
||||
|
||||
.highlight,
|
||||
pre.highlight {
|
||||
background: #282c34;
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight pre {
|
||||
background: #282c34;
|
||||
}
|
||||
.highlight .hll {
|
||||
background: #282c34;
|
||||
}
|
||||
.highlight .c {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .err {
|
||||
color: #960050;
|
||||
background-color: #1e0010;
|
||||
}
|
||||
.language-coq .highlight .err {
|
||||
// Hux: a temp workaround to fix for Coq math symbol
|
||||
// @see https://github.com/rouge-ruby/rouge/issues/1312
|
||||
&:extend(.highlight .k);
|
||||
background-color: transparent;
|
||||
}
|
||||
.highlight .k {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .l {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .n {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .o {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .p {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .cm {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .cp {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .c1 {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .cs {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .ge {
|
||||
font-style: italic;
|
||||
}
|
||||
.highlight .gs {
|
||||
font-weight: 700;
|
||||
}
|
||||
.highlight .kc {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .kd {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .kn {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .kp {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .kr {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .kt {
|
||||
color: #c678dd;
|
||||
}
|
||||
.highlight .ld {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .m {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .s {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .na {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .nb {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .nc {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .no {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .nd {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .ni {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .ne {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .nf {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .nl {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .nn {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .nx {
|
||||
color: #abb2bf;
|
||||
}
|
||||
.highlight .py {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .nt {
|
||||
color: #e06c75;
|
||||
}
|
||||
.highlight .nv {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .ow {
|
||||
font-weight: 700;
|
||||
}
|
||||
.highlight .w {
|
||||
color: #f8f8f2;
|
||||
}
|
||||
.highlight .mf {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .mh {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .mi {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .mo {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .sb {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .sc {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .sd {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .s2 {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .se {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .sh {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .si {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .sx {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .sr {
|
||||
color: #56b6c2;
|
||||
}
|
||||
.highlight .s1 {
|
||||
color: #98c379;
|
||||
}
|
||||
.highlight .ss {
|
||||
color: #56b6c2;
|
||||
}
|
||||
.highlight .bp {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .vc {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .vg {
|
||||
color: #e5c07b;
|
||||
}
|
||||
.highlight .vi {
|
||||
color: #e06c75;
|
||||
}
|
||||
.highlight .il {
|
||||
color: #d19a66;
|
||||
}
|
||||
.highlight .gu {
|
||||
color: #75715e;
|
||||
}
|
||||
.highlight .gd {
|
||||
color: #f92672;
|
||||
}
|
||||
.highlight .gi {
|
||||
color: #a6e22e;
|
||||
}
|
||||
|
||||
// Customize for Hux Blog
|
||||
.highlighter-rouge .highlight {
|
||||
margin-bottom: 10px;
|
||||
border-radius: 6px;
|
||||
pre {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
color: #555;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
word-wrap: normal; // Safari Bug
|
||||
}
|
||||
.rouge-table {
|
||||
.rouge-gutter,
|
||||
.rouge-code {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
.rouge-code {
|
||||
pre {
|
||||
color: #abb2bf; // default color for nil-lang code
|
||||
}
|
||||
}
|
||||
.table-responsive {
|
||||
margin: 0px;
|
||||
border: 0px;
|
||||
}
|
||||
.table {
|
||||
margin: 0px;
|
||||
table-layout: fixed;
|
||||
}
|
||||
table > tbody > tr {
|
||||
> td {
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
> pre {
|
||||
padding: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
td.rouge-gutter {
|
||||
width: 56px;
|
||||
}
|
||||
.lineno {
|
||||
text-align: right;
|
||||
// border-right: 1px solid #373434;
|
||||
border-radius: 0px;
|
||||
}
|
||||
}
|
||||
/* Landscape phones and down */
|
||||
@media (max-width: 480px) {
|
||||
.highlighter-rouge .highlight {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
border-radius: 0px;
|
||||
td.rouge-gutter {
|
||||
width: 36px;
|
||||
}
|
||||
table > tbody > tr > td > pre {
|
||||
padding: 14px 10px;
|
||||
}
|
||||
}
|
||||
}
|
1104
less/hux-blog.less
Normal file
1104
less/hux-blog.less
Normal file
File diff suppressed because it is too large
Load Diff
56
less/mixins.less
Normal file
56
less/mixins.less
Normal file
@ -0,0 +1,56 @@
|
||||
// Mixins
|
||||
|
||||
.transition-all() {
|
||||
-webkit-transition: all 0.5s;
|
||||
-moz-transition: all 0.5s;
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.background-cover() {
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
background-size: cover;
|
||||
-o-background-size: cover;
|
||||
}
|
||||
|
||||
.monospace () {
|
||||
font-family: "Fira Code", Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
}
|
||||
|
||||
.serif() {
|
||||
font-family: 'Lora', 'Times New Roman', serif;
|
||||
}
|
||||
|
||||
.sans-serif () {
|
||||
/* Hux learn from
|
||||
* TypeIsBeautiful,
|
||||
* [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
|
||||
*/
|
||||
font-family:
|
||||
// System Font // https://www.webkit.org/blog/3709/using-the-system-font-in-web-content/
|
||||
-apple-system, // OSX ^10.11 & iOS ^9 San Francisco & 苹方 for Safari
|
||||
BlinkMacSystemFont, // OSX ^10.11 & iOS ^9 San Francisco & 苹方 for Blink
|
||||
|
||||
// English First
|
||||
"Helvetica Neue", // OSX
|
||||
"Arial", // Win "Helvetica"
|
||||
//" Segoe UI", // Win ^8
|
||||
|
||||
// Chinese Fallback
|
||||
"PingFang SC", // OSX ^10.11 & iOS ^9 苹方(华康信凭黑)
|
||||
"Hiragino Sans GB", // OSX ^10.6 冬青黑体
|
||||
"STHeiti", // OSX <10.6 & iOS <9 华文黑体
|
||||
"Microsoft YaHei", // Win 微软雅黑
|
||||
"Microsoft JhengHei", // Win 微软正黑
|
||||
"Source Han Sans SC", // SourceHan - begin 思源黑体
|
||||
"Noto Sans CJK SC",
|
||||
"Source Han Sans CN",
|
||||
"Noto Sans SC",
|
||||
"Source Han Sans TC",
|
||||
"Noto Sans CJK TC", // SourceHan - end
|
||||
"WenQuanYi Micro Hei", // Linux 文泉驿微米黑
|
||||
SimSun, // Win old 中易宋体
|
||||
sans-serif; // System Fallback
|
||||
|
||||
line-height: 1.7;
|
||||
}
|
94
less/search.less
Normal file
94
less/search.less
Normal file
@ -0,0 +1,94 @@
|
||||
.search-page {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
background: #fff;
|
||||
-webkit-transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1);
|
||||
transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1);
|
||||
-webkit-transform: translate(0, 100%);
|
||||
-ms-transform: translate(0, 100%);
|
||||
transform: translate(0, 100%);
|
||||
opacity: 0;
|
||||
|
||||
&.search-active {
|
||||
opacity: 1;
|
||||
-webkit-transform: translate(0, 0) scale(1, 1);
|
||||
-ms-transform: translate(0, 0) scale(1, 1);
|
||||
transform: translate(0, 0) scale(1, 1);
|
||||
.search-main {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.search-main {
|
||||
padding-top: 80px;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
-webkit-transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1) 250ms;
|
||||
transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1) 250ms;
|
||||
.row,
|
||||
.row > div {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.search-icon-close-container {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
padding: 16px;
|
||||
top: 0;
|
||||
right: 2px;
|
||||
i {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
#search-input {
|
||||
.monospace;
|
||||
|
||||
// poorman's reset
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
// poorman's reset end
|
||||
|
||||
width: 100%;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
color: @gray-dark;
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
#search-results {
|
||||
overflow: auto;
|
||||
height: 100%;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.search-icon a,
|
||||
.search-icon-close {
|
||||
cursor: pointer;
|
||||
font-size: 30px;
|
||||
color: #311e3e;
|
||||
-webkit-transition: all 0.25s;
|
||||
transition: all 0.25s;
|
||||
}
|
||||
|
||||
.search-icon a:hover,
|
||||
.search-icon-close:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.search-icon,
|
||||
.search-icon-close {
|
||||
font-size: 16px;
|
||||
}
|
94
less/side-catalog.less
Normal file
94
less/side-catalog.less
Normal file
@ -0,0 +1,94 @@
|
||||
// Directory Section
|
||||
|
||||
.catalog-container {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.side-catalog {
|
||||
&.fixed {
|
||||
position: fixed;
|
||||
top: -21px;
|
||||
}
|
||||
&.fold {
|
||||
.catalog-toggle::before {
|
||||
content: "+";
|
||||
}
|
||||
.catalog-body {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.catalog-toggle::before {
|
||||
content: "−";
|
||||
position: relative;
|
||||
margin-right: 5px;
|
||||
bottom: 1px;
|
||||
}
|
||||
display: block;
|
||||
overflow: auto;
|
||||
height: 100%;
|
||||
padding-bottom: 40px;
|
||||
width: 195px;
|
||||
.catalog-body {
|
||||
position: relative;
|
||||
list-style: none;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
padding-left: 0px;
|
||||
padding-right: 5px;
|
||||
text-indent: 0;
|
||||
li {
|
||||
position: relative;
|
||||
list-style: none;
|
||||
a {
|
||||
padding-left: 10px;
|
||||
max-width: 180px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.h1_nav,
|
||||
.h2_nav {
|
||||
margin-left: 0;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.h3_nav {
|
||||
margin-left: 6px;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.h4_nav {
|
||||
margin-left: 12px;
|
||||
font-size: 12px;
|
||||
a {
|
||||
max-width: 170px;
|
||||
}
|
||||
}
|
||||
.h5_nav .h6_nav {
|
||||
margin-left: 18px;
|
||||
font-size: 12px;
|
||||
a {
|
||||
max-width: 170px;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
a {
|
||||
color: #0085a1 !important;
|
||||
}
|
||||
border-radius: 4px;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.side-catalog {
|
||||
display: none;
|
||||
}
|
||||
}
|
61
less/sidebar.less
Normal file
61
less/sidebar.less
Normal file
@ -0,0 +1,61 @@
|
||||
@import "variables.less";
|
||||
|
||||
// Sidebar Components
|
||||
|
||||
// Large Screen
|
||||
@media (min-width: 1200px) {
|
||||
.post-container,
|
||||
.sidebar-container {
|
||||
padding-right: 5%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.post-container {
|
||||
padding-right: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
// Container of Sidebar, also Friends
|
||||
.sidebar-container {
|
||||
color: @gray-light;
|
||||
font-size: 14px;
|
||||
h5 {
|
||||
color: @brand-gray;
|
||||
padding-bottom: 1em;
|
||||
a {
|
||||
color: @brand-gray !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: @gray-light !important;
|
||||
&:hover,
|
||||
&:active {
|
||||
color: @brand-primary !important;
|
||||
}
|
||||
}
|
||||
.tags {
|
||||
a {
|
||||
border-color: @gray-light;
|
||||
&:hover,
|
||||
&:active {
|
||||
border-color: @brand-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
.short-about {
|
||||
img {
|
||||
width: 80%;
|
||||
display: block;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
p {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.list-inline > li {
|
||||
padding-left: 0px;
|
||||
}
|
||||
}
|
||||
}
|
234
less/snackbar.less
Normal file
234
less/snackbar.less
Normal file
@ -0,0 +1,234 @@
|
||||
/*
|
||||
Please note this CSS is currently in prototype form. We'll implement a cleaned up version in Web Starter Kit.
|
||||
*/
|
||||
|
||||
.paper-snackbar {
|
||||
transition-property: opacity, bottom, left, right, width, margin,
|
||||
border-radius;
|
||||
transition-duration: 0.5s;
|
||||
transition-timing-function: ease;
|
||||
/*font-family: RobotoDraft;*/
|
||||
font-size: 14px;
|
||||
min-height: 14px;
|
||||
background-color: #323232;
|
||||
background-color: #0085a1;
|
||||
position: fixed;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: white;
|
||||
line-height: 22px;
|
||||
padding: 18px 24px;
|
||||
bottom: 0px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.paper-snackbar {
|
||||
/*
|
||||
Desktop:
|
||||
Single-line snackbar height: 48 dp tall
|
||||
Minimum width: 288 dp
|
||||
Maximum width: 568 dp
|
||||
2 dp rounded corner
|
||||
Text: Roboto Regular 14 sp
|
||||
Action button: Roboto Medium 14 sp, all-caps text
|
||||
Default background fill: #323232 100%
|
||||
*/
|
||||
|
||||
min-width: 288px;
|
||||
max-width: 568px;
|
||||
display: inline-flex;
|
||||
border-radius: 2px;
|
||||
margin: 24px;
|
||||
bottom: -100px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.paper-snackbar {
|
||||
/*
|
||||
Mobile:
|
||||
Single-line snackbar height: 48 dp
|
||||
Multi-line snackbar height: 80 dp
|
||||
Text: Roboto Regular 14 sp
|
||||
Action button: Roboto Medium 14 sp, all-caps text
|
||||
Default background fill: #323232 100%
|
||||
*/
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.paper-snackbar .action {
|
||||
background: inherit;
|
||||
display: inline-block;
|
||||
border: none;
|
||||
font-size: inherit;
|
||||
text-transform: uppercase;
|
||||
color: #ffeb3b;
|
||||
margin: 0px 0px 0px 24px;
|
||||
padding: 0px;
|
||||
min-width: min-content;
|
||||
outline: 0px;
|
||||
}
|
||||
|
||||
/* Everything from here down is actually just for the demo - the material buttons and card, and various other pieces of styling */
|
||||
|
||||
/* Variables */
|
||||
|
||||
@blue: #4285f4;
|
||||
@white: #fff;
|
||||
@black: #000;
|
||||
@gray: #ccc;
|
||||
@button-width: 160px;
|
||||
|
||||
@top: 1000;
|
||||
|
||||
/* Buttons */
|
||||
.paper-button {
|
||||
position: relative;
|
||||
padding: 4px 0;
|
||||
margin: 1em;
|
||||
width: @button-width;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
color: @black;
|
||||
text-transform: uppercase;
|
||||
border-radius: 3px;
|
||||
outline-color: @brand-gray;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// we don't leverage ripple
|
||||
// .ripple {
|
||||
// position: absolute;
|
||||
// width: @button-width * 2;
|
||||
// height: @button-width * 2;
|
||||
// //background-color: rgba(@gray, 0.5);
|
||||
// left: 0;
|
||||
// top: 0;
|
||||
// border-radius: 50%;
|
||||
// margin-left: - @button-width;
|
||||
// margin-top: - @button-width;
|
||||
// transform: scaleX(0) scaleY(0);
|
||||
// z-index: 9000;
|
||||
// }
|
||||
}
|
||||
|
||||
.paper-button button,
|
||||
.paper-button input[type="submit"] {
|
||||
background: inherit;
|
||||
border: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/*font-family: 'Roboto';*/
|
||||
font-size: 1em;
|
||||
color: @black;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.paper-button.colored,
|
||||
.paper-button.colored button {
|
||||
color: @blue;
|
||||
}
|
||||
|
||||
// .paper-button .ripple {
|
||||
// background-color: rgba(@gray, 0.5);
|
||||
// }
|
||||
|
||||
// .paper-button.raised-button.colored .ripple {
|
||||
// background-color: rgba(@white, 0.5);
|
||||
// }
|
||||
|
||||
// .paper-button.raised-button .ripple {
|
||||
// background-color: rgba(@gray, 0.5);
|
||||
// }
|
||||
|
||||
.paper-button.raised-button.colored {
|
||||
background-color: @blue;
|
||||
}
|
||||
|
||||
.paper-button .raised-button {
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
|
||||
.paper-button.raised-button.colored {
|
||||
background: #4285f4;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.paper-button[disabled] {
|
||||
background-color: #eaeaea !important;
|
||||
color: #a8a8a8 !important;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.paper-button:hover {
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
.paper-button.raised-button.colored:hover {
|
||||
background-color: #3367d6;
|
||||
}
|
||||
|
||||
button.paper-button {
|
||||
border: 0;
|
||||
/*font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;*/
|
||||
font-size: 1em;
|
||||
line-height: 25px;
|
||||
background-color: @white;
|
||||
}
|
||||
|
||||
.paper-button input[type="submit"] {
|
||||
outline-color: @brand-gray;
|
||||
}
|
||||
|
||||
.paper-button.colored.raised-button input[type="submit"] {
|
||||
color: @white;
|
||||
}
|
||||
|
||||
/** Shadows **/
|
||||
.paper-shadow-animated.paper-shadow {
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
.paper-shadow-top-z-1 {
|
||||
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
|
||||
.paper-shadow-bottom-z-1 {
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
|
||||
.paper-shadow-top-z-2 {
|
||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
.paper-shadow-bottom-z-2 {
|
||||
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.paper-shadow-top-z-3 {
|
||||
box-shadow: 0 17px 50px 0 rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
.paper-shadow-bottom-z-3 {
|
||||
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24);
|
||||
}
|
||||
|
||||
.paper-shadow-top-z-4 {
|
||||
box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21);
|
||||
}
|
||||
|
||||
/** Card **/
|
||||
.card {
|
||||
background: white;
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
margin: 16px;
|
||||
border-radius: 2px;
|
||||
}
|
9
less/variables.less
Normal file
9
less/variables.less
Normal file
@ -0,0 +1,9 @@
|
||||
// Variables
|
||||
|
||||
@brand-primary: #0085a1;
|
||||
@brand-gray: #a3a3a3;
|
||||
|
||||
@gray-dark: lighten(black, 25%);
|
||||
@gray-light: lighten(black, 75%);
|
||||
|
||||
@white-faded: fade(white, 80%);
|
Reference in New Issue
Block a user