123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290 |
- .enable_plugin_nestable_list() when(@enable-plugin-nestable-list = true) {
- .dd {
- position: relative;
- display: block;
- margin: 0; padding: 0;
- max-width: 600px;
- list-style: none;
- line-height: 20px;
- }
- .dd-list {
- display: block;
- position: relative;
- margin: 0; padding: 0; list-style: none;
-
- .dd-list {
- padding-left: 30px;
- }
- .dd-collapsed & {
- display: none;
- }
- }
- .dd-item,
- .dd-empty,
- .dd-placeholder {
- display: block;
- position: relative;
- margin: 0;
- padding: 0;
- min-height: 20px;
- line-height: 20px;
- }
- .dd-handle , .dd2-content {
- display: block;
- min-height: 38px;
- margin: 5px 0;
- padding: 8px 12px;
-
- background: #F8FAFF;
- border: 1px solid #DAE2EA;
- color: #7C9EB2;
- text-decoration: none;
- font-weight: bold;
- .box-sizing(border-box);
-
-
- &:hover {
- color: #438EB9;
- background: #F4F6F7;
- border-color:#DCE2E8;
- }
-
- &[class*="btn-"] {
- color:#FFF;
- border:none;
- padding: 9px 12px;
- &:hover {
- opacity:0.85;
- color:#FFF;
- }
- }
- }
- .dd2-handle + .dd2-content,
- .dd2-handle + .dd2-content[class*="btn-"]
- {
- padding-left:44px;
- }
- .dd-handle[class*="btn-"]:hover , .dd2-content[class*="btn-"]
- .dd2-handle[class*="btn-"]:hover + .dd2-content[class*="btn-"] {
- //opacity:0.85;
- color:#FFF;
- }
- .dd-item > button:hover {
- ~ .dd-handle , ~ .dd2-content {
- color: #438EB9;
- background: #F4F6F7;
- border-color:#DCE2E8;
- }
- ~ .dd-handle[class*="btn-"] , ~ .dd2-content[class*="btn-"] {
- opacity:0.85;
- color:#FFF;
- }
- }
- .dd2-handle:hover {
- ~ .dd2-content {
- color: #438EB9;
- background: #F4F6F7;
- border-color:#DCE2E8;
- }
- ~ .dd2-content[class*="btn-"] {
- opacity:0.85;
- color:#FFF;
- }
- }
- .dd2-item.dd-item > button {
- margin-left:34px;
- }
- .dd-item > button {
- display: block;
- position: relative; z-index:1;
- cursor: pointer;
-
- float: left;
- width: 25px;
- height: 20px;
- margin: 5px 1px 5px 5px;
- padding: 0;
-
- text-indent: 100%;
- white-space: nowrap;
- overflow: hidden;
-
- border: 0;
- background: transparent;
- font-size: @base-font-size - 1;
-
- line-height: 1;
- text-align: center;
- font-weight: bold;
-
- top:4px;
- left:1px;
-
- color:#707070;
- }
- .dd-item > button:before {
- font-family: FontAwesome;
- content: '\f067';
-
- display: block;
- position: absolute;
- width: 100%;
-
- text-align: center;
- text-indent: 0;
-
- font-weight: normal;
- font-size: @base-font-size + 1;
- }
- .dd-item > button[data-action="collapse"]:before {
- content: '\f068';
- }
- .dd-item > button:hover {
- color:#707070;
- }
- .dd-item.dd-colored > button , .dd-item.dd-colored > button:hover {
- color:#EEE;
- }
- .dd-placeholder,
- .dd-empty {
- margin: 5px 0;
- padding: 0;
- min-height: 30px;
- background: #F0F9FF;
- border: 2px dashed #BED2DB;
- .box-sizing(border-box);
- }
- .dd-empty {
- border-color:#AAA;
- border-style:solid;
- background-color: #e5e5e5;
- }
- .dd-dragel {
- position: absolute;
- pointer-events: none;
- z-index: 999;
- opacity:0.8;
-
- > li > .dd-handle {
- color:#4B92BE;
- background:#F1F5FA;
-
- border-color:#D6E1EA;
- //opacity:0.85;
- border-left:2px solid #777;
-
- position:relative;
-
- &[class*="btn-"] {
- color:#FFF;
- }
- }
- }
- .dd-dragel > .dd-item > .dd-handle {
- margin-top: 0;
- }
- .dd-list > li[class*="item-"] {
- border-width:0;padding:0;
- > .dd-handle {
- border-left:2px solid;
- border-left-color:inherit;
- }
- }
- .dd-list > li > .dd-handle .sticker {
- position:absolute;
- right:0;
- top:0;
- }
- .dd2-handle , .dd-dragel > li > .dd2-handle {
- position:absolute;
- left:0; top:0;
- width:36px;
- margin:0;
- border-width:1px 1px 0 0;
- text-align:center;
- padding:0 !important;
- line-height:38px;
- height:38px;
-
- background: #EBEDF2;
- border: 1px solid #DEE4EA;
- cursor: pointer;
- overflow: hidden;
- position: absolute;
- z-index:1;
- }
- .dd2-handle:hover , .dd-dragel > li > .dd2-handle{
- background:#E3E8ED;
- }
- .dd2-content[class*="btn-"] {
- text-shadow:none !important;
- }
- .dd2-handle[class*="btn-"] {
- text-shadow:none !important;
- background:rgba(0,0,0,0.1) !important;
- border-right:1px solid #EEE;
- }
- .dd2-handle[class*="btn-"]:hover {
- background:rgba(0,0,0,0.08) !important;
- }
- .dd-dragel .dd2-handle[class*="btn-"] {
- border-color:transparent;
- border-right-color:#EEE;
- }
- .dd2-handle.btn-yellow {
- text-shadow:none !important;
- background:rgba(0,0,0,0.05) !important;
- border-right:1px solid #FFF;
- }
- .dd2-handle.btn-yellow:hover {
- background:rgba(0,0,0,0.08) !important;
- }
- .dd-dragel .dd2-handle.btn-yellow {
- border-color:transparent;
- border-right-color:#FFF;
- }
- .dd-item > .dd2-handle .drag-icon {
- display:none;
- }
- .dd-dragel > .dd-item > .dd2-handle .drag-icon {
- display:inline;
- }
- .dd-dragel > .dd-item > .dd2-handle .normal-icon {
- display:none;
- }
- }
- .enable_plugin_nestable_list();
|