77 lines
63 KiB
SCSS
77 lines
63 KiB
SCSS
|
@import "variables.scss";
|
||
|
|
|
||
|
|
.rfipbtn,.rfipdropdown{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:14px;line-height:1.71429;vertical-align:baseline}.rfipbtn,.rfipbtn *,.rfipdropdown,.rfipdropdown *{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.rfipbtn input,.rfipbtn select,.rfipdropdown input,.rfipdropdown select{font-size:14px}.rfip{position:relative;display:inline-block;margin:8px;vertical-align:middle}.rfipbtn{width:136px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;min-height:50px;border-radius:2px;cursor:pointer;-webkit-transition:border-color .25s,-webkit-box-shadow .25s;transition:border-color .25s,-webkit-box-shadow .25s;transition:box-shadow .25s,border-color .25s;transition:box-shadow .25s,border-color .25s,-webkit-box-shadow .25s;outline:0 none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.rfipbtn--open{border-radius:2px 2px 0 0}.rfipbtn__button{width:48px;margin-left:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:auto;-webkit-transition:background .25s,-webkit-box-shadow .25s;transition:background .25s,-webkit-box-shadow .25s;transition:background .25s,box-shadow .25s;transition:background .25s,box-shadow .25s,-webkit-box-shadow .25s}.rfipbtn__button i{font-size:32px;-webkit-transition:-webkit-transform .25s;transition:-webkit-transform .25s;transition:transform .25s;transition:transform .25s,-webkit-transform .25s}.rfipbtn__button--open i{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.rfipbtn__current{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:0;-ms-flex:0 0 86px;flex:0 0 86px;padding:2px}.rfipbtn--multi{width:258px}.rfipbtn--multi .rfipbtn__current{-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-preferred-size:212px;flex-basis:212px;-ms-flex-line-pack:center;align-content:center}.rfipbtn--multi .rfipbtn__current,.rfipbtn__icon{-webkit-box-orient:horizontal;-webkit-box-direction:normal}.rfipbtn__icon{margin:2px;padding:0;height:28px;width:48px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;border-radius:2px}.rfipbtn__icon--empty{font-size:14px;line-height:16px;margin-left:8px;text-align:center;text-transform:lowercase;font-style:italic}.rfipbtn__elm{display:-webkit-box;display:-ms-flexbox;display:flex;height:28px;width:28px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:18px}.rfipbtn__elm img,.rfipbtn__elm svg{height:18px;width:auto}.rfipbtn__del{width:18px;display:-webkit-box;display:-ms-flexbox;display:flex;height:28px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:background-color .25s;transition:background-color .25s;cursor:pointer}.rfipcategory{width:100%;margin:0 0 8px;position:relative}.rfipcategory select{width:100%;display:block;height:32px;line-height:32px;border-radius:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-transition:border .25s,-webkit-box-shadow .25s;transition:border .25s,-webkit-box-shadow .25s;transition:border .25s,box-shadow .25s;transition:border .25s,box-shadow .25s,-webkit-box-shadow .25s;background-color:transparent!important}.
|
||
|
|
/*!
|
||
|
|
*
|
||
|
|
* React FontIconPicker
|
||
|
|
*
|
||
|
|
* React Component to show a picker element to pick font-icons & svg
|
||
|
|
*
|
||
|
|
* @author Swashata Ghosh <swashata@wpquark.com>
|
||
|
|
* @version 1.1.0
|
||
|
|
* @link https://github.com/fontIconPicker/react-fonticonpicker
|
||
|
|
* @license MIT
|
||
|
|
*
|
||
|
|
* Copyright (c) 2018 Swashata Ghosh <swashata@wpquark.com>
|
||
|
|
*
|
||
|
|
* This software is released under the MIT License.
|
||
|
|
* https://opensource.org/licenses/MIT
|
||
|
|
*
|
||
|
|
*/
|
||
|
|
.rfipbtn--green{background-color:#fff;border:1px solid #81c784}.rfipbtn--green:active,.rfipbtn--green:focus{-webkit-box-shadow:0 1.5px 4px rgba(0,0,0,.24),0 1.5px 6px rgba(0,0,0,.12);box-shadow:0 1.5px 4px rgba(0,0,0,.24),0 1.5px 6px rgba(0,0,0,.12);border:1px solid #66bb6a}.rfipbtn--green .rfipbtn__button{border:0 none transparent;border-left:1px solid #81c784;background-color:#c8e6c9;color:#2e7d32}.rfipbtn--green .rfipbtn__button:hover{background-color:#66bb6a}.rfipbtn--green .rfipbtn__button:active{-webkit-box-shadow:inset 0 0 10px 0 #81c784;box-shadow:inset 0 0 10px 0 #81c784}.rfipbtn--green .rfipbtn__icon{border:1px solid #a5d6a7;color:#2e7d32}.rfipbtn--green .rfipbtn__icon--empty{color:#81c784}.rfipbtn--green .rfipbtn__del{background-color:#a5d6a7}.rfipbtn--green .rfipbtn__del:hover{background-color:#81c784}.rfipbtn--green .rfipbtn__del:active,.rfipbtn--green .rfipbtn__del:focus{outline:1px solid #81c784}.rfipdropdown--green{-webkit-box-shadow:0 15px 24px rgba(0,0,0,.22),0 19px 76px rgba(0,0,0,.3);box-shadow:0 15px 24px rgba(0,0,0,.22),0 19px 76px rgba(0,0,0,.3);color:#424242;background-color:#fff;border:1px solid #81c784}.rfipdropdown--green input,.rfipdropdown--green select{color:#424242}.rfipdropdown--green .rfipcategory select{background-color:#fff;border:0 none;border-bottom:1px solid #66bb6a;-webkit-transition:border .25s,-webkit-box-shadow .25s;transition:border .25s,-webkit-box-shadow .25s;transition:box-shadow .25s,border .25s;transition:box-shadow .25s,border .25s,-webkit-box-shadow .25s}.rfipdropdown--green .rfipcategory select:active,.rfipdropdown--green .rfipcategory select:focus{border-bottom-color:#4caf50;-webkit-box-shadow:0 1px 0 0 #4caf50;box-shadow:0 1px 0 0 #4caf50;outline:0 none}.rfipdropdown--green .rfipicons__cp{border:0 none;border-bottom:1px solid #66bb6a;-webkit-transition:border .25s,-webkit-box-shadow .25s;transition:border .25s,-webkit-box-shadow .25s;transition:box-shadow .25s,border .25s;transition:box-shadow .25s,border .25s,-webkit-box-shadow .25s}.rfipdropdown--green .rfipicons__cp:active,.rfipdropdown--green .rfipicons__cp:focus{border-bottom-color:#4caf50;-webkit-box-shadow:0 1px 0 0 #4caf50;box-shadow:0 1px 0 0 #4caf50;outline:0 none}.rfipdropdown--green .rfipicons__left,.rfipdropdown--green .rfipicons__right{background-color:#a5d6a7;border:1px solid #a5d6a7;color:#2e7d32}.rfipdropdown--green .rfipicons__left:hover,.rfipdropdown--green .rfipicons__right:hover{background-color:#66bb6a;border:1px solid #66bb6a}.rfipdropdown--green .rfipicons__left:active,.rfipdropdown--green .rfipicons__left:focus,.rfipdropdown--green .rfipicons__right:active,.rfipdropdown--green .rfipicons__right:focus{border:1px solid #66bb6a}.rfipdropdown--green .rfipicons__ibox{background-color:#c8e6c9;border:1px solid #c8e6c9;color:#2e7d32}.rfipdropdown--green .rfipicons__ibox:hover{background-color:#66bb6a;border:1px solid #66bb6a}.rfipdropdown--green .rfipicons__ibox:active,.rfipdropdown--green .rfipicons__ibox:focus{border:1px solid #66bb6a}.rfipdropdown--green .rfipicons__ibox--error{color:#ef9a9a}.rfipdropdown--green .rfipicons__icon--selected .rfipicons__ibox{background-color:#a5d6a7}.rfipdropdown--green .rfipsearch input{border:0 none;border-bottom:1px solid #66bb6a;-webkit-transition:border .25s,-webkit-box-shadow .25s;transition:border .25s,-webkit-box-shadow .25s;transition:box-shadow .25s,border .25s;transition:box-shadow .25s,border .25s,-webkit-box-shadow .25s}.rfipdropdown--green .rfipsearch input:active,.rfipdropdown--green .rfipsearch input:focus{border-bottom-color:#4caf50;-webkit-box-shadow:0 1px 0 0 #4caf50;box-shadow:0 1px 0 0 #4caf50;outline:0 none}.rfipbtn--bluegrey{background-color:#fff;border:1px solid #90a4ae}.rfipbtn--bluegrey:active,.rfipbtn--bluegrey:focus{-webkit-box-shadow:0 1.5px 4px rgba(0,0,0,.24),0 1.5px 6px rgba(0,0,0,.12);box-shadow:0 1.5px 4px rgba(0,0,0,.24),0 1.5px 6px rgba(0,0,0,.12);border:1px solid #78909c}.rfipbtn--bluegrey .rfipbtn__button{border:0 none transparent;border-left:1px solid #90a4ae;background-color:#cfd8dc;color:#37474f}.rfipbtn--bluegrey .rfipbtn__bu
|
||
|
|
|
||
|
|
|
||
|
|
.rfipbtn--default .rfipbtn__icon {
|
||
|
|
border: 0;
|
||
|
|
height: 30px;
|
||
|
|
margin: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
.rfipbtn--default .rfipbtn__del {
|
||
|
|
height: 18px;
|
||
|
|
}
|
||
|
|
.rfipicons__icon svg[fill="none"] {
|
||
|
|
fill:none !important;
|
||
|
|
}
|
||
|
|
.rfipbtn__elm svg[fill="none"] {
|
||
|
|
fill: none !important;
|
||
|
|
}
|
||
|
|
[class^=fipicon-] {
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: 400;
|
||
|
|
font-variant: normal;
|
||
|
|
text-transform: none;
|
||
|
|
line-height: 1;
|
||
|
|
-webkit-font-smoothing: antialiased;
|
||
|
|
-moz-osx-font-smoothing: grayscale;
|
||
|
|
}
|
||
|
|
i.fipicon-angle-down:before {
|
||
|
|
content: "\f140";
|
||
|
|
font-family: dashicons;
|
||
|
|
}
|
||
|
|
.rfipcategory i.fipicon-angle-down:before {
|
||
|
|
display:none;
|
||
|
|
}
|
||
|
|
.kb-icon-picker-container .rfipbtn--default:active, .kb-icon-picker-container .rfipbtn--default:focus {
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
.kb-icon-picker-container .rfip {
|
||
|
|
margin: 0 0 10px;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.kb-icon-picker-container .rfip .rfipbtn {
|
||
|
|
width:100%;
|
||
|
|
min-height: 30px;
|
||
|
|
}
|
||
|
|
i.fipicon-angle-up:before {
|
||
|
|
content: "\f142";
|
||
|
|
font-family: dashicons;
|
||
|
|
}
|
||
|
|
i.fipicon-angle-right:before {
|
||
|
|
content: "\f345";
|
||
|
|
font-family: dashicons;
|
||
|
|
}
|
||
|
|
i.fipicon-angle-left:before {
|
||
|
|
content: "\f341";
|
||
|
|
font-family: dashicons;
|
||
|
|
}
|