Permalink
Browse files

refactor: background color of labels

  • Loading branch information...
MOxFIVE committed May 16, 2016
1 parent 6c91bed commit 967214e8a024a0a5604b88ab7d66772125e20e05
@@ -50,19 +50,3 @@ if color-scheme == "yilia"
.article-more-link a
background #4d4d4d
font-size .8em
.tagcloud a.color3
background #7B5D5F
&:before
border-right-color #7B5D5F
.tagcloud a.color5
background #BA8F6C
&:before
border-right-color #BA8F6C
&:hover
background-color hover-color
border-color hover-color
&::before
border-right-color hover-color
@@ -223,125 +223,83 @@
}
}
#header .tagcloud a{
color:#fff;
}
.tagcloud{
a{
display:inline-block;
text-decoration:none;
font-weight: normal;
font-size: (12/16)rem;
color:#fff;
height: (18/16)rem;
line-height: @height;
float: left;
padding:0 5px 0px 10px;
position:relative;
border-radius:0 5px 5px 0;
margin: 5px 9px 5px 8px;
opacity: i-opacity;
font-family: inherit;
&:hover{
opacity: 1;
transform: scale(1.06);
}
&:before{
content: " ";
width: 0px;
height: 0px;
position: absolute;
top: 0;
left: -(18/16)rem;
border: (18/16/2)rem solid transparent;
}
&:after{
content:" ";
width:4px;
height:4px;
background-color:#fff;
border-radius:4px;
box-shadow:0px 0px 0px 1px rgba(0,0,0,.3);
position:absolute;
top: (7/16)rem;
left: 2px;
}
}
a.color1{
background: #FF945C;
&:before{
border-right-color: #FF945C;
}
}
a.color2{
background: #F5C7B7;
&:before{
border-right-color: #F5C7B7;
}
}
a.color3{
background: #BA8F6C;
&:before{
border-right-color: #BA8F6C;
}
}
a.color4{
background: #CFB7C4;
&:before{
border-right-color:#CFB7C4;
}
}
a.color5{
background: #88acdb;
&:before{
border-right-color:#88acdb;
}
}
a:hover {
background-color: hover-color;
border-color: hover-color;
&::before {
border-right-color: hover-color;
}
}
}
.article-tag {
&::before {
float: left;
color: #999;
content: "\f02b";
font: base-font-size FontAwesome;
margin-left: 1em;
margin-right: 5px;
margin-top: 6px;
}
}
.article-category {
&::before {
float: left;
color: #999;
content: "\f02d";
font: base-font-size FontAwesome;
margin-right: 5px;
margin-top: (1/3)rem;
}
}
.article-pop-out {
float: left;
&:before{
float: left;
color: #999;
content: "\f08d";
font: base-font-size FontAwesome;
float: left;
margin-right: 5px;
margin-top: (1/3)rem;
}
&:after{
float: left;
content: "";
margin-right: 20px;
margin-top: 9px;
float: left;
}
}
#header .tagcloud a
color #fff
.tagcloud a
display inline-block
text-decoration none
font-weight normal
font-size .75rem
color #fff
height 1.125rem
line-height 1.125rem
float left
padding 0 5px 0 10px
position relative
border-radius 0 5px 5px 0
margin 5px 9px 5px 8px
opacity i-opacity
font-family font-chs font-sans
for color, i in color-list
&.color{i}
background color
&::before
border-right-color color
&:hover
opacity 1
transform scale(1.06)
background-color hover-color
border-color hover-color
&::before
border-right-color hover-color
&:before
content " "
width 0
height 0
position absolute
top 0
left -1.1rem
border .5625rem solid transparent
&:after
content " "
width 4px
height 4px
background-color #fff
border-radius 4px
box-shadow 0 0 0 1px rgba(0,0,0,.3)
position absolute
top .4375rem
left 2px
.article-tag::before,
.article-category::before
float left
color #999
font base-font-size FontAwesome
margin-right 5px
margin-top (1/3)rem
.article-tag::before
content "\f02b"
margin-left 1em
.article-category::before
content "\f02d"
.article-pop-out
float left
&:before
color #999
content "\f08d"
font base-font-size FontAwesome
float left
margin-right 5px
margin-top (1/3)rem
&:after
float left
content ""
margin-right 20px
margin-top 9px
View
@@ -19,7 +19,7 @@ color-pinterest = #cb2027
color-google = #dd4b39
// Fonts
font-chs = "Microsoft YaHei", "Hiragino Sans GB", "WenQuanYi Micro Hei" // sans-serif
font-chs = "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "WenQuanYi Micro Hei" // sans-serif
font-sans = "Lucida Grande", Verdana, "Helvetica Neue", Arial // sans-serif
font-serif = Times, Georgia // serif
font-mono = Menlo, Consolas, "Source Code Pro", Inconsolata, Monaco // monospace
@@ -72,4 +72,10 @@ root-url = hexo-config("root_url")
i-opacity = .75
toc-top = 378px
share = hexo-config("share.on")
share = hexo-config("share.on")
color-scheme = hexo-config("color_scheme")
background-image = hexo-config("background_image")
color-list = #88acdb, lightsalmon, lightcoral, #76becc, #918597, #6fc0e4, rosybrown
if color-scheme == "yilia"
color-list = #ba8f6c #ff945c #7B5D5F #f5c7b7 #cfb7c4 #918597 rosybrown
View
@@ -53,6 +53,15 @@ require([], function (){
loadPC();
}
resetTags = function(){
var tags = $(".tagcloud a");
for(var i = 0; i < tags.length; i++){
var num = Math.floor(Math.random()*7);
tags.eq(i).addClass("color" + num);
};
$(".article-category a:nth-child(-n+2)").attr("class", "color0");
}
//是否使用fancybox
if(yiliaConfig.fancybox === true){
require([yiliaConfig.fancybox_js], function(pc){
View
@@ -132,15 +132,6 @@ define([], function(){
}, false);
};
var resetTags = function(){
var tags = $(".tagcloud a");
for(var i = 0; i < tags.length; i++){
var num = parseInt(4*Math.random()) + 1;
tags.eq(i).addClass("color" + num);
};
$(".article-category a:nth-child(-n+2)").attr("class", "color5");
}
return{
init: function(){
//构造函数需要的参数
View
@@ -35,15 +35,6 @@ define([], function(){
$(".icon-wrap").eq(idx).removeClass("hide");
}
var resetTags = function(){
var tags = $(".tagcloud a");
for(var i = 0; i < tags.length; i++){
var num = parseInt(4*Math.random()) + 1;
tags.eq(i).addClass("color" + num);
};
$(".article-category a:nth-child(-n+2)").attr("class", "color5");
}
var bind = function(){
var switchBtn = $("#myonoffswitch");
var tagcloud = $(".second-part");

1 comment on commit 967214e

@MOxFIVE

This comment has been minimized.

Show comment
Hide comment
@MOxFIVE
Owner

MOxFIVE commented on 967214e May 16, 2016

snip20160516_1

snip20160516_4

Please sign in to comment.