catalog-ui/src/app/view-models/catalog/catalog.less

   1 .sdc-catalog-container {
   2
   3     .i-sdc-categories-list-item {
   4         font-weight: normal;
   5     }
   6
   7     // Checkboxes
   8     .i-sdc-designer-leftbar-section-content-ul {
   9         padding: 0;
  10         margin: 0;
  11
  12         .i-sdc-designer-leftbar-section-content-ul-li {
  13             margin-top: 5px;
  14
  15             .tlv-checkbox {
  16                 font-size: 13px;
  17                 font-family: @font-opensans-medium;
  18                 color: @func_color_s;
  19             }
  20         }
  21
  22         .i-sdc-catalog-subcategories-checkbox {
  23             padding: 0 0 0 20px;
  24             margin: 0;
  25
  26             > li {
  27                 margin-top: 5px;
  28
  29                 .tlv-checkbox {
  30                     font-size:13px;
  31                     font-family: @font-opensans-regular;
  32                 }
  33             }
  34
  35             .i-sdc-catalog-grouping-checkbox {
  36                 padding: 0 0 0 20px;
  37                 margin: 0;
  38             }
  39
  40         }
  41
  42     }
  43
  44     .i-sdc-designer-leftbar-section-content-li {
  45         &:last-child {
  46             .i-sdc-categories-list-item {
  47                 margin: 0;
  48             }
  49         }
  50     }
  51
  52     .i-sdc-categories-list-item {
  53         display: block;
  54         //margin-bottom: 5px;
  55         //padding-left: 15px;
  56         //text-indent: -24px;
  57         vertical-align: top;
  58         font-weight: bold;
  59     }
  60
  61     .i-sdc-subcategories-list-item {
  62         display: block;
  63         //padding-left: 20px;
  64         vertical-align: top;
  65         font-weight: normal;
  66         margin: 0;
  67         //text-indent: -10px;
  68     }
  69
  70     .i-sdc-categories-list-item-icon {
  71         display: inline-block;
  72         float: right;
  73         position: relative;
  74         right: -8px;
  75         top: 6px;
  76     }
  77
  78     .i-sdc-categories-list-item {
  79         margin-top: 7px;
  80         &.NOT_CERTIFIED_CHECKOUT,
  81         &.NOT_CERTIFIED_CHECKIN {
  82             .i-sdc-categories-list-item-icon {
  83                 background: url('/assets/styles/images/sprites/sprite-global-old.png') no-repeat -53px -2889px;
  84                 width: 14px;
  85                 height: 14px;
  86
  87             }
  88         }
  89
  90         &.CERTIFIED {
  91             .i-sdc-categories-list-item-icon {
  92                 background: url('/assets/styles/images/sprites/sprite-global-old.png') no-repeat -53px -3034px;
  93                 width: 14px;
  94                 height: 16px;
  95             }
  96         }
  97
  98         &.READY_FOR_CERTIFICATION {
  99             .i-sdc-categories-list-item-icon {
 100                 background: url('/assets/styles/images/sprites/sprite-global-old.png') no-repeat -53px -2985px;
 101                 width: 14px;
 102                 height: 16px;
 103             }
 104         }
 105
 106         &.CERTIFICATION_IN_PROGRESS {
 107             .i-sdc-categories-list-item-icon {
 108                 background: url('/assets/styles/images/sprites/sprite-global-old.png') no-repeat -53px -2934px;
 109                 width: 14px;
 110                 height: 16px;
 111             }
 112         }
 113
 114         &.DISTRIBUTED,
 115         &.TBD {
 116             .i-sdc-categories-list-item-icon {
 117                 background: url('/assets/styles/images/sprites/sprite-global-old.png') no-repeat -43px -3087px;
 118                 width: 24px;
 119                 height: 14px;
 120
 121             }
 122         }
 123     }
 124
 125     .i-sdc-categories-list-input {
 126         margin: 8px;
 127
 128     }
 129
 130     .i-sdc-subcategories-list-input {
 131
 132         margin: 8px;
 133     }
 134     .i-sdc-subcategories-list-input-container {
 135         margin: 0px 0px 0px 20px;
 136         padding: 2px;
 137     }
 138
 139     .w-sdc-header-catalog-search-container {
 140         display: table;
 141         padding: 21px 0;
 142         position: relative;
 143
 144         .w-sdc-designer-leftbar-search-input {
 145             color: #000;
 146             width: 300px;
 147         }
 148     }
 149
 150     .w-sdc-catalog-main {
 151         padding: 10px 12px;
 152     }
 153     .w-sdc-dashboard-catalog-items-header {
 154         .b_3;
 155         color: @main_color_m;
 156         font-family: OpenSans-Regular, sans-serif;
 157         font-size: 14px;
 158         display: inline-block;
 159         font-style: normal;
 160         margin-left: 11px;
 161         b {
 162             font-family: OpenSans-Bold, sans-serif;
 163             color: @main_color_l;
 164             font-weight: bold;
 165         }
 166         font-weight: normal;
 167         /* padding-left: 10px; */
 168     }
 169
 170     .w-sdc-dashboard-catalog-header-order1 {
 171         .b_3;
 172         font-weight: 800;
 173     }
 174
 175     .w-sdc-dashboard-catalog-sort {
 176         .b_3;
 177         font-weight: bold;
 178         white-space:pre;
 179         &:hover{
 180             .hand;
 181             text-decoration: none;
 182             .a_3;
 183         }
 184         &.blue {
 185             .a_3;
 186         }
 187     }
 188
 189     .w-sdc-catalog-sort-arrow{
 190         display: inline-block;
 191         &.up{
 192             .b_3;
 193             width: 0;
 194             height: 0;
 195             border-left: 5px solid transparent;
 196             border-right: 5px solid transparent;
 197             border-bottom: 5px solid ;
 198         }
 199         &.down{
 200             .b_3;
 201             width: 0;
 202             height: 0;
 203             border-left: 5px solid transparent;
 204             border-right: 5px solid transparent;
 205             border-top: 5px solid;
 206         }
 207     }
 208
 209
 210     .w-sdc-dashboard-catalog-header-right{
 211         float: right;
 212         display: inline-block;
 213         padding-right:34px;
 214     }
 215
 216     .w-sdc-header-catalog-search-input {
 217         width: 420px;
 218         display: table-cell;
 219         padding: 0 25px 1px 10px;
 220         border: 1px solid #bcbcbc;
 221         .border-radius(10px);
 222         height: 30px;
 223         margin: 10px 30px;
 224         outline: none;
 225     }
 226
 227     .sdc-catalog-type-filter-container {
 228         margin-top: -1px;
 229     }
 230
 231     .i-sdc-designer-leftbar-section-title {
 232         text-transform: uppercase;
 233         .l_14_m;
 234         line-height: 30px;
 235     }
 236
 237     .i-sdc-designer-leftbar-section-title-icon {
 238         .hand;
 239         .tlv-sprite;
 240         .footer-close;
 241         transition: .3s all;
 242         margin-top: -4px;
 243     }
 244
 245     .i-sdc-designer-leftbar-section-title-text {
 246         margin-left: 20px;
 247     }
 248
 249     /* added Michael */
 250     .i-sdc-designer-left-sidebar {
 251         margin-top: 43px;
 252     }
 253     .i-sdc-designer-leftbar-section-left-switch-header {
 254         text-transform: uppercase;
 255         .l_14_m;
 256         line-height: 40px;
 257         width: 243px;
 258
 259         font-family: OpenSans-Bold, sans-serif;
 260         font-size: 14px;
 261
 262         color: @main_color_a;
 263         background-color: @tlv_color_t;
 264         border: solid 1px fade(@main_color_t, 40%);
 265         cursor: pointer;
 266         opacity: 1;
 267         z-index: 9999;
 268         position: relative;
 269         //box-shadow: 1px 0 2px #00000036;
 270     }
 271     .i-sdc-designer-leftbar-section-left-switch-header-text {
 272         display: inline-block;
 273         width: 180px;
 274         margin-left: 20px;
 275     }
 276     .i-sdc-designer-leftbar-section-left-switch-header-icon {
 277         display: inline-block;
 278         vertical-align: middle;
 279     }
 280
 281
 282     .seperator-left,
 283     .seperator-right {
 284         border-right: solid 1px @color_m;
 285         display: table-cell;
 286         width: 2px;
 287     }
 288
 289     // Rotate catalog left side arrows
 290     .i-sdc-designer-leftbar-section-title.expanded .i-sdc-designer-leftbar-section-title-icon {
 291         transform: rotate(180deg);
 292     }
 293
 294     // Transform catalog left side sections
 295     .i-sdc-designer-leftbar-section-title + .i-sdc-designer-leftbar-section-content {
 296         max-height: 0px;
 297         margin: 0 auto;
 298         transition: all .3s;
 299         overflow: hidden;
 300         padding: 0 10px 0 18px;
 301     }
 302
 303     .i-sdc-designer-leftbar-section-title.expanded + .i-sdc-designer-leftbar-section-content {
 304         max-height: 9999px;
 305         margin: 0 auto 1px;
 306         transition: all .3s;
 307         padding: 10px 18px 10px 18px;
 308         overflow: hidden;
 309     }
 310
 311 }
 312
 313 .w-sdc-search-icon{
 314     position: absolute;
 315     right: 40px;
 316     top: 40px;
 317     &.leftbar{
 318         top: 19px;
 319         right: 18px;
 320     }
 321     &.magnification {
 322         .sprite;
 323         .sprite.magnification-glass;
 324         .hand;
 325     }
 326
 327     &.cancel {
 328         .sprite;
 329         .sprite.clear-text;
 330         .hand;
 331     }
 332 }
 333
 334 /* added Michael */
 335 .sdc-catalog-selector-wrapper {
 336     position: absolute;
 337     left: 0px;
 338     top: 42px;
 339     width: 241px;
 340     height: auto;
 341     cursor: pointer;
 342     opacity: 1;
 343     z-index: 1000;
 344     box-shadow: 1px 2px 3px #b1b1b1;
 345 }
 346
 347 .sdc-catalog-selector-item {
 348     text-transform: none;
 349     line-height: 40px;
 350     font-family: OpenSans-Bold, sans-serif;
 351     font-size: 14px;
 352     color: @main_color_l;
 353     background-color: @main_color_p;
 354     padding-left: 20px;
 355 }
 356
 357 .sdc-catalog-selector-item:hover {
 358     color: @main_color_a;
 359     background-color: @tlv_color_v;
 360 }
 361
 362