Permalink
Browse files

style($article): make it modular 样式模块化

  • Loading branch information...
MOxFIVE committed Jan 17, 2016
1 parent 1d6c09e commit d0c33fb363962dee60f99e0e9cc1d29b0f639e26
@@ -140,7 +140,11 @@
margin: -30px 0 20px 30px;
}
.article-entry{
line-height: 1.65em;
@require "customise/blockquote"
@require "customise/heading"
@require "customise/list"
@require "customise/table"
line-height: 1.65em;
padding:0 2em;
a:hover {
text-decoration: underline;
@@ -150,93 +154,9 @@ line-height: 1.65em;
margin-top: 0.2em;
font-size: 1em;
}
li{
margin: 0.1em
font-size: 1.1em;
}
blockquote {
padding: .4em 20px;
margin-top: 10px;
border-left: 4px solid rgba(147, 181, 224, .4);
background: rgba(255,255,255,0.4);
p{
margin-top: 0;
}
blockquote {
border-left: none;
}
}
em {
font-style: italic;
}
ul{
li:before{
display inline-block;
content: "";
width: .4em;
height: .4em;
margin-right: .5em;
margin-bottom: .11em;
border: 1px solid lightgray;
border-radius: 50%;
background: lightgray;
}
}
ul,ol{
font-size: 14px;
margin: 10px 0px;
}
li{
ul,ol{
margin-left: 30px;
li:before{
content: "";
background: #dedede;
}
}
}
h1{
margin-top: 30px;
}
h2{
margin: .5em auto;
font-weight: bold;
color: #9c9;
padding-bottom: 5px;
border-bottom: 1px solid #ddd;
&:hover {
color:#88acdb;
};
text-align: center;
&::before, &::after {
content:" —— ";
font-family: Arial;
};
}
h3 {
margin: .5em auto;
color: #438aac;
background: rgba(243, 248, 253, .6);
border: 1px solid #d2e8fa;
padding: 0.2em 0.6em;
font-weight: normal;
&:hover a {
text-decoration: underline;
};
&::after {
content: " >";
};
}
h4,h5,h6{
margin-top: 20px;
font-weight: bold;
color: #574C4C;
padding-bottom: 5px;
border-bottom: 1px solid #ddd;
&:hover {
color:#88acdb;
};
}
video{
max-width: 100%;
}
@@ -257,43 +177,6 @@ line-height: 1.65em;
border-top: 1px solid #DDD;
border-bottom: 1px solid #FFF;
}
table{
width:100%;
max-width: 65em;
border: 1px solid #dedede;
margin: 15px auto;
border-collapse:collapse;
empty-cells:show;
tr,td{
height:35px;
}
th {
font-weight: bold;
text-align: center;
background: rgba(158, 188, 226, .2);
white-space: nowrap;
}
thead{
tr {
/*background: #f8f8f8;*/
}
}
tbody{
tr:hover{
background: #efefef;
}
}
td,th{
border: 1px solid #dedede;
padding: 0 10px;
}
tr:nth-child(2n) {
background: rgba(158, 188, 226, .12);
}
td:nth-child(-n+2){
white-space: nowrap;
}
}
figure{
table {
border: none;
@@ -0,0 +1,9 @@
blockquote
padding .4em 20px
margin-top 10px
border-left 4px solid rgba(147, 181, 224, .4)
background rgba(255,255,255,0.4)
p
margin-top 0
blockquote
border-left none
@@ -0,0 +1,36 @@
h1
margin-top 30px

h2
margin .5em auto
font-weight bold
color #9c9
padding-bottom 5px
border-bottom 1px solid #ddd
&hover
color #88acdb
text-align center
&before, &after
content" —— "
font-family Arial

h3
margin .5em auto
color #438aac
background rgba(243, 248, 253, .6)
border 1px solid #d2e8fa
padding .2em .6em
font-weight normal
&hover a
text-decoration underline
&after
content " >"

h4, h5, h6
margin-top 20px
font-weight bold
color #574C4C
padding-bottom 5px
border-bottom 1px solid #ddd
&hover
color#88acdb
@@ -0,0 +1,26 @@
li
margin .1em
font-size 1.1em

ul
li::before
display inline-block
content ""
width .4em
height .4em
margin-right .5em
margin-bottom .11em
border 1px solid lightgray
border-radius 50%
background lightgray

ul, ol
font-size 14px
margin 10px 0

li
ul, ol
margin-left 30px
libefore
content ""
background #dedede
@@ -0,0 +1,24 @@
table
width 100%
max-width 65em
border 1px solid #dedede
margin 15px auto
border-collapse collapse
empty-cells show
tr,td
height 35px
th
font-weight bold
text-align center
background rgba(158, 188, 226, .2)
white-space nowrap
tbody
tr:hover
background #efefef
td,th
border 1px solid #dedede
padding 0 10px
tr:nth-child(2n)
background rgba(158, 188, 226, .12)
td:nth-child(-n+2)
white-space nowrap

0 comments on commit d0c33fb

Please sign in to comment.