ecomp-portal-FE-common/client/app/styles/select2.less

   1 .select2-drop {
   2     //position: absolute;
   3     border-radius: 0 0 2px 2px;
   4
   5     outline: none;
   6 }
   7
   8 .select2-container {
   9     margin-right: 8px;
  10
  11
  12     .select2-choice {
  13         border-color: @portalLGray;
  14         border-radius: 2px;
  15         background-image: none;
  16         height: 32px;
  17         width: 100%;
  18     }
  19
  20     &.select2-dropdown-open {
  21         .select2-choice {
  22             border-color: @portalBlue;
  23         }
  24         .select2-choice .select2-arrow b:after,
  25         &.select2-container-disabled .select2-choice .select2-arrow b:after,
  26         .select2-choice .select2-arrow b:after {
  27             .arrow_up;
  28         }
  29     }
  30
  31     .select2-choice .select2-arrow b:after,
  32     &.select2-container-disabled .select2-choice .select2-arrow b:after,
  33     .select2-choice .select2-arrow b:after {
  34         .arrow_down;
  35         height: 10px;
  36         width: 10px;
  37         top: 12px;
  38         right: 10px;
  39         content: '';
  40     }
  41     .select2-chosen, .select2-container input {
  42         line-height: 32px;
  43     }
  44 }
  45
  46 .select2-results {
  47     border-radius: 0 0 2px 2px;
  48     margin: -13px 0 0 0;
  49     .select2-result {
  50         &:first-child {
  51             margin-top: 14px;
  52         }
  53         &:hover {
  54             background-color: @funcBkgGray;
  55         }
  56     }
  57
  58     .select2-result-label {
  59         outline: none;
  60     }
  61 }
  62
  63 .select2-drop-above {
  64     &.select2-drop {
  65         border-radius: 2px 2px 0 0;
  66     }
  67
  68     &.select2-dropdown-open .select2-choice {
  69         border-radius: 0 0 2px 2px !important;
  70         background: @portalWhite;
  71     }
  72 }
  73
  74 .select2-dropdown-open {
  75     .select2-choice {
  76         border-color: @portalLGray;
  77
  78         .select2-arrow b:after {
  79
  80         }
  81     }
  82 }
  83
  84 .select2-drop-active {
  85     border-color: @portalBlue;
  86 }
  87 //.select2-container {
  88 //    margin: 0;
  89 //    position: relative;
  90 //    display: block;
  91 //    .a14r;
  92 //
  93 //    &.ng-invalid.ng-touched {
  94 //        .select2-choice {
  95 //            border: 1px solid @err;
  96 //        }
  97 //    }
  98 //
  99 //    &.select2-container-active.ng-invalid.ng-touched {
 100 //        .select2-choice {
 101 //            border: 1px solid @c;
 102 //        }
 103 //    }
 104 //
 105 //    .select2-choice {
 106 //        display: block;
 107 //        padding: 10px 0 6px 8px;
 108 //        overflow: hidden;
 109 //        position: relative;
 110 //        border: 1px solid @o;
 111 //        text-decoration: none;
 112 //        cursor: pointer;
 113 //
 114 //        & > .select2-chosen {
 115 //            margin-right: 33px;
 116 //            display: block;
 117 //            overflow: hidden;
 118 //            white-space: nowrap;
 119 //            text-overflow: ellipsis;
 120 //        }
 121 //
 122 //        .select2-arrow {
 123 //            display: inline-block;
 124 //            width: 33px;
 125 //            height: 100%;
 126 //            position: absolute;
 127 //            right: 0;
 128 //            top: 0;
 129 //            //border-left: 1px solid @s;;
 130 //            //border-radius: 0 4px 4px 0;
 131 //            display: flex;
 132 //            align-items: center;
 133 //            justify-content: center;
 134 //
 135 //            b {
 136 //                display: block;
 137 //                //.spr_dropdown_arrow; //fix this
 138 //            }
 139 //        }
 140 //    }
 141 //
 142 //    .select2-drop-active {
 143 //        border: 1px solid @c;
 144 //        border-top: none;
 145 //        position: absolute;
 146 //        top: 32px;
 147 //        left: 0;
 148 //        width: 100%;
 149 //        .bg_f;
 150 //        z-index: 100;
 151 //    }
 152 //
 153 //    .select2-search {
 154 //        display: inline-block;
 155 //        width: 100%;
 156 //        min-height: 30px;
 157 //        margin: 0;
 158 //        padding-left: 4px;
 159 //        padding-right: 4px;
 160 //        position: relative;
 161 //        z-index: 10000;
 162 //        white-space: nowrap;
 163 //
 164 //        input {
 165 //            width: 100%;
 166 //            height: auto !important;
 167 //            min-height: 26px;
 168 //            padding: 4px 20px 4px 5px;
 169 //            margin: 0;
 170 //            outline: 0;
 171 //            border: 1px solid @o;
 172 //            &:focus {
 173 //                border: 1px solid @o;
 174 //            }
 175 //            border-radius: 2px;
 176 //            box-shadow: none;
 177 //        }
 178 //    }
 179 //
 180 //}
 181 /////
 182 //
 183 //.select2-container-active .select2-choice,
 184 //.select2-container-active .select2-choices {
 185 //    border: 1px solid @c;
 186 //    outline: none;
 187 //    box-shadow: 0 0 5px rgba(0, 0, 0, .3);
 188 //}
 189 //
 190 //.select2-dropdown-open {
 191 //    .select2-choice {
 192 //        border-bottom-color: transparent;
 193 //        box-shadow: 0 1px 0 #fff inset;
 194 //        border-bottom-left-radius: 0;
 195 //        border-bottom-right-radius: 0;
 196 //
 197 //        .select2-arrow {
 198 //            background: transparent;
 199 //            border-left: none;
 200 //            filter: none;
 201 //        }
 202 //    }
 203 //    .select2-results {
 204 //        max-height: 200px;
 205 //        padding: 0 0 0 4px;
 206 //        margin: 4px 4px 4px 0;
 207 //        position: relative;
 208 //        overflow-x: hidden;
 209 //        overflow-y: auto;
 210 //        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 211 //
 212 //        li.select2-result-with-children > .select2-result-label {
 213 //            font-weight: bold;
 214 //        }
 215 //
 216 //        .select2-result-label {
 217 //            padding: 3px 7px 4px;
 218 //            margin: 0;
 219 //            cursor: pointer;
 220 //        }
 221 //
 222 //        .select2-highlighted {
 223 //            background: @c;
 224 //            color: @f;
 225 //        }
 226 //    }
 227 //}
 228 //.select2-display-none {
 229 //    display: none;
 230 //}