Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
.theme-color-picker label{
display: inline-block;
width:100%;
}
.theme-color-picker ul{
margin:0;
padding:0;
list-style: none;
}
.theme-color-option{
margin:0 0 15px 0;
}
.theme-color-picker-hex{
display: inline-block;
font-size: .85em;
color: #b3b3b3;
font-size: 11px;
width: 100%;
}
.theme-color-picker-preview{
border:1px solid #000;
width:88px;
height:88px;
display: inline-block;
overflow: hidden;
padding: 5px;
margin:0;
list-style: none;
}
.theme-color-picker-themes{
margin:0;
}
.theme-color-picker-theme{
width:100px;
margin:0 10px 15px 0;
display: inline-block;
}
.theme-color-picker-theme .theme-wrap{
width:100%;
height:100px;
}
.theme-color-picker-theme .theme-controls{
padding: 5px;
text-align: right;
}
.theme-color-picker-center-text{
text-align: center;
position: relative;
top:50%;
transform:translateY(-50%);
overflow: hidden;
text-overflow: ellipsis;
}
.theme-color-picker-preview-wrapper{
margin:0 0 15px 0;
}
.visuallyhidden{
border: 0; clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.theme-control{
background: #fff;
border:0 none;
border-radius: 100%;
padding: 0;
margin:0;
}
.icon.is-default:before,
.theme-control:hover .icon:before,
.theme-control:focus .icon:before{
background:#7a25f9;
color:#fff;
}
.theme-control .icon:before{
padding: 0 3px;
border-radius: 100%;
transition:background .2s ease-in,color .2s ease-in;
}
.btn-select-theme{
background: transparent;
border:2px solid transparent;
border-color:transparent;
padding:2px;
margin:0;
width: 100%;
outline:none;
transition: border-color .2s ease-in;
}
.btn-select-theme:hover,
.btn-select-theme:focus{
border:2px dashed #9e9e9e;
}
.theme-color-picker-theme.is-default .btn-select-theme:hover,
.theme-color-picker-theme.is-default .btn-select-theme{
border:2px dashed #d9d9d9;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment