first commit
This commit is contained in:
kicap1992
BIN
assets/color-switcher/._color-switcher.css
Executable file
BIN
assets/color-switcher/._color-switcher.css
Executable file
Binary file not shown.
BIN
assets/color-switcher/._color-switcher.js
Executable file
BIN
assets/color-switcher/._color-switcher.js
Executable file
Binary file not shown.
BIN
assets/color-switcher/._color-switcher.less
Executable file
BIN
assets/color-switcher/._color-switcher.less
Executable file
Binary file not shown.
BIN
assets/color-switcher/._color-switcher.min.css
vendored
Executable file
BIN
assets/color-switcher/._color-switcher.min.css
vendored
Executable file
Binary file not shown.
BIN
assets/color-switcher/._color-switcher.min.js
vendored
Executable file
BIN
assets/color-switcher/._color-switcher.min.js
vendored
Executable file
Binary file not shown.
166
assets/color-switcher/color-switcher.css
Executable file
166
assets/color-switcher/color-switcher.css
Executable file
@ -0,0 +1,166 @@
|
||||
/*
|
||||
Color Switcher
|
||||
Version 1.0
|
||||
-------------------------------------------------------------------------*/
|
||||
/* Spin Keyframes */
|
||||
@-webkit-keyframes gear-spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes gear-spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes gear-spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
#color-switcher {
|
||||
position: fixed;
|
||||
top: 110px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
}
|
||||
#color-switcher .btn-switcher {
|
||||
width: 47px;
|
||||
height: 47px;
|
||||
padding: 6px;
|
||||
background: #ffffff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
-moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
#color-switcher .btn-switcher .ico {
|
||||
font-size: 28px;
|
||||
line-height: 35px;
|
||||
animation: gear-spin 2s infinite linear;
|
||||
-webkit-animation: gear-spin 2s infinite linear;
|
||||
-moz-animation: gear-spin 2s infinite linear;
|
||||
}
|
||||
#color-switcher .content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 48px;
|
||||
right: 0;
|
||||
width: 212px;
|
||||
padding: 10px 0px 2px 10px;
|
||||
z-index: 9;
|
||||
font-size: 0;
|
||||
background: #ffffff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
-moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
-webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
#color-switcher .content .btn-restore-default {
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
margin: 5px 0 10px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
transition: 0.4s ease all;
|
||||
-webkit-transition: 0.4s ease all;
|
||||
-moz-transition: 0.4s ease all;
|
||||
}
|
||||
#color-switcher .content .btn-restore-default:hover {
|
||||
background: #cccccc;
|
||||
}
|
||||
#color-switcher .content .item {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
margin-right: 8px;
|
||||
margin-bottom: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
#color-switcher .content .item .color {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
}
|
||||
#color-switcher .content .item .text {
|
||||
display: none;
|
||||
position: absolute;
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
white-space: nowrap;
|
||||
padding: 3px 9px;
|
||||
background: #212121;
|
||||
color: #ffffff;
|
||||
margin-bottom: 5px;
|
||||
border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
transform: translate(-50%, 0);
|
||||
-webkit-transform: translate(-50%, 0);
|
||||
-moz-transform: translate(-50%, 0);
|
||||
}
|
||||
#color-switcher .content .item .text:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
margin-left: -4px;
|
||||
width: 8px;
|
||||
height: 4px;
|
||||
border-left: 4px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
border-top: 4px solid #212211;
|
||||
}
|
||||
#color-switcher .content .item:hover .text {
|
||||
display: block;
|
||||
}
|
||||
#color-switcher .content .item.active:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
}
|
||||
html[dir="rtl"] #color-switcher {
|
||||
right: auto;
|
||||
left: 20px;
|
||||
}
|
||||
html[dir="rtl"] #color-switcher .content {
|
||||
right: auto;
|
||||
left: 0;
|
||||
padding: 10px 10px 2px 2px;
|
||||
}
|
||||
html[dir="rtl"] #color-switcher .content .item {
|
||||
margin-right: 0;
|
||||
margin-left: 8px;
|
||||
}
|
||||
48
assets/color-switcher/color-switcher.js
Executable file
48
assets/color-switcher/color-switcher.js
Executable file
@ -0,0 +1,48 @@
|
||||
/**
|
||||
* Color Switcher
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
"use strict";
|
||||
|
||||
$('#color-switcher-button').on('click',function(){
|
||||
$("#color-switcher-content").stop().toggle(200);
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#color-switcher-content").on('click','.js__change_color',function(event){
|
||||
event.preventDefault();
|
||||
if (!$(this).hasClass('active')){
|
||||
$("#color-switcher-content .active").removeClass("active");
|
||||
if($("#custom-color-themes").length){
|
||||
$("#custom-color-themes").remove();
|
||||
}
|
||||
if ($(this).data('color') != 'blue'){
|
||||
$("body").append('<link id="custom-color-themes" rel="stylesheet" href="assets/styles/color/' + $(this).data('color') + '.min.css">');
|
||||
}
|
||||
$(this).addClass('active');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#color-reset").on('click',function(){
|
||||
var selector = $('#color-switcher-content .js__change_color[data-color="blue"]');
|
||||
if($("#custom-color-themes").length){
|
||||
$("#custom-color-themes").remove();
|
||||
}
|
||||
if (selector.data('color') != 'blue'){
|
||||
$("body").append('<link id="custom-color-themes" rel="stylesheet" href="assets/styles/color/' + selector.data('color') + '.min.css">');
|
||||
}
|
||||
$('#color-switcher-content .js__change_color').removeClass('active');
|
||||
selector.addClass('active');
|
||||
});
|
||||
|
||||
$("#wrapper").on('click',function(event){
|
||||
if ($(event.target).attr('id') == 'color-switcher' || $(event.target).parents('#color-switcher').length){
|
||||
|
||||
}else{
|
||||
$("#color-switcher-content").stop().hide(200);
|
||||
}
|
||||
})
|
||||
|
||||
})(jQuery);
|
||||
173
assets/color-switcher/color-switcher.less
Executable file
173
assets/color-switcher/color-switcher.less
Executable file
@ -0,0 +1,173 @@
|
||||
/*
|
||||
Color Switcher
|
||||
Version 1.0
|
||||
-------------------------------------------------------------------------*/
|
||||
|
||||
/* Spin Keyframes */
|
||||
@-webkit-keyframes gear-spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes gear-spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes gear-spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
|
||||
#color-switcher{
|
||||
position: fixed;
|
||||
top: 110px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
.btn-switcher{
|
||||
width: 47px;
|
||||
height: 47px;
|
||||
padding: 6px;
|
||||
background: #ffffff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
-moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
.ico{
|
||||
font-size: 28px;
|
||||
line-height: 35px;
|
||||
animation: gear-spin 2s infinite linear;
|
||||
-webkit-animation: gear-spin 2s infinite linear;
|
||||
-moz-animation: gear-spin 2s infinite linear;
|
||||
}
|
||||
}
|
||||
.content{
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 48px;
|
||||
right: 0;
|
||||
width: 212px;
|
||||
padding: 10px 0px 2px 10px;
|
||||
z-index: 9;
|
||||
font-size: 0;
|
||||
background: #ffffff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
-moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.05),0 1px 1px rgba(0,0,0,0.05);
|
||||
.btn-restore-default{
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
margin: 5px 0 10px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
transition: 0.4s ease all;
|
||||
-webkit-transition: 0.4s ease all;
|
||||
-moz-transition: 0.4s ease all;
|
||||
&:hover{
|
||||
background: #cccccc;
|
||||
}
|
||||
}
|
||||
.item{
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
margin-right: 8px;
|
||||
margin-bottom: 8px;
|
||||
text-align: center;
|
||||
.color{
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
}
|
||||
.text{
|
||||
display: none;
|
||||
position: absolute;
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
white-space: nowrap;
|
||||
padding: 3px 9px;
|
||||
background: #212121;
|
||||
color: #ffffff;
|
||||
margin-bottom: 5px;
|
||||
border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
transform: translate(-50%,0);
|
||||
-webkit-transform: translate(-50%,0);
|
||||
-moz-transform: translate(-50%,0);
|
||||
&:before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
margin-left: -4px;
|
||||
width: 8px;
|
||||
height: 4px;
|
||||
border-left: 4px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
border-top: 4px solid #212211;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
.text{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&.active:before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[dir="rtl"]{
|
||||
#color-switcher{
|
||||
right: auto;
|
||||
left: 20px;
|
||||
.content{
|
||||
right: auto;
|
||||
left: 0;
|
||||
padding: 10px 10px 2px 2px;
|
||||
.item{
|
||||
margin-right: 0;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
1
assets/color-switcher/color-switcher.min.css
vendored
Executable file
1
assets/color-switcher/color-switcher.min.css
vendored
Executable file
@ -0,0 +1 @@
|
||||
@-webkit-keyframes gear-spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-moz-keyframes gear-spin{0%{-moz-transform:rotate(0deg);transform:rotate(0deg)}100%{-moz-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes gear-spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}#color-switcher{position:fixed;top:110px;right:10px;z-index:999}#color-switcher .btn-switcher{width:47px;height:47px;padding:6px;background:#fff;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05);-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05)}#color-switcher .btn-switcher .ico{font-size:28px;line-height:35px;animation:gear-spin 2s infinite linear;-webkit-animation:gear-spin 2s infinite linear;-moz-animation:gear-spin 2s infinite linear}#color-switcher .content{display:none;position:absolute;top:48px;right:0;width:212px;padding:10px 0 2px 10px;z-index:9;font-size:0;background:#fff;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05);-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 1px rgba(0,0,0,.05)}#color-switcher .content .btn-restore-default{display:inline-block;padding:5px 10px;margin:5px 0 10px;cursor:pointer;font-size:14px;line-height:24px;border:1px solid #ccc;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;transition:.4s ease all;-webkit-transition:.4s ease all;-moz-transition:.4s ease all}#color-switcher .content .btn-restore-default:hover{background:#ccc}#color-switcher .content .item{display:inline-block;position:relative;font-size:12px;color:#333;margin-right:8px;margin-bottom:8px;text-align:center}#color-switcher .content .item .color{width:32px;height:32px;display:block;margin:0 auto;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px}#color-switcher .content .item .text{display:none;position:absolute;bottom:100%;left:50%;white-space:nowrap;padding:3px 9px;background:#212121;color:#fff;margin-bottom:5px;border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px;transform:translate(-50%,0);-webkit-transform:translate(-50%,0);-moz-transform:translate(-50%,0)}#color-switcher .content .item .text:before{content:'';position:absolute;top:100%;left:50%;margin-left:-4px;width:8px;height:4px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #212211}#color-switcher .content .item:hover .text{display:block}#color-switcher .content .item.active:before{content:'';position:absolute;top:2px;left:2px;width:28px;height:28px;border:2px solid #fff;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px}html[dir=rtl] #color-switcher{right:auto;left:20px}html[dir=rtl] #color-switcher .content{right:auto;left:0;padding:10px 10px 2px 2px}html[dir=rtl] #color-switcher .content .item{margin-right:0;margin-left:8px}
|
||||
1
assets/color-switcher/color-switcher.min.js
vendored
Executable file
1
assets/color-switcher/color-switcher.min.js
vendored
Executable file
@ -0,0 +1 @@
|
||||
!function(t){"use strict";t("#color-switcher-button").on("click",function(){return t("#color-switcher-content").stop().toggle(200),!1}),t("#color-switcher-content").on("click",".js__change_color",function(o){return o.preventDefault(),t(this).hasClass("active")||(t("#color-switcher-content .active").removeClass("active"),t("#custom-color-themes").length&&t("#custom-color-themes").remove(),"blue"!=t(this).data("color")&&t("body").append('<link id="custom-color-themes" rel="stylesheet" href="assets/styles/color/'+t(this).data("color")+'.min.css">'),t(this).addClass("active")),!1}),t("#color-reset").on("click",function(){var o=t('#color-switcher-content .js__change_color[data-color="blue"]');t("#custom-color-themes").length&&t("#custom-color-themes").remove(),"blue"!=o.data("color")&&t("body").append('<link id="custom-color-themes" rel="stylesheet" href="assets/styles/color/'+o.data("color")+'.min.css">'),t("#color-switcher-content .js__change_color").removeClass("active"),o.addClass("active")}),t("#wrapper").on("click",function(o){"color-switcher"==t(o.target).attr("id")||t(o.target).parents("#color-switcher").length||t("#color-switcher-content").stop().hide(200)})}(jQuery);
|
||||
Reference in New Issue
Block a user