catalog-ui/src/app/ng2/components/ui/panel-wrapper/panel-wrapper.component.less

   1 @import '../../../../../assets/styles/variables';
   2
   3 .w-sdc-designer-sidebar {
   4   background-color:@main_color_p ;
   5   font-family: @font-opensans-regular;
   6   font-size: 13px;
   7   color: #191919;
   8   -webkit-touch-callout: none;
   9   -webkit-user-select: none;
  10   -khtml-user-select: none;
  11   -moz-user-select: none;
  12   -ms-user-select: none;
  13   user-select: none;
  14   bottom: 0;
  15   position: fixed;
  16   right: -302px;
  17   width: 302px;
  18   top: 103px;
  19   transition: right 0.2s;
  20   z-index: 1010;
  21   box-shadow: -7px -3px 6px -8px @main_color_n;
  22 }
  23
  24 .w-sdc-designer-sidebar-toggle {
  25   background-color: @main_color_p;
  26   border-left: 1px solid @main_color_o;
  27   border-bottom: 1px solid @main_color_o;
  28   height: 21px;
  29   position: absolute;
  30   right: 0;
  31   top: 53px;
  32   width: 17px;
  33   transition: right 0.2s;
  34   z-index: 1005;
  35   box-shadow: -1px 1px 3px 0  @main_color_n;
  36   cursor: pointer;
  37
  38   &.active {
  39     right: 302px;
  40     .w-sdc-designer-sidebar-toggle-icon{
  41       transform: rotate(180deg);
  42     }
  43   }
  44 }
  45
  46 .w-sdc-designer-sidebar-toggle-icon {
  47   margin-left: 6px;
  48   margin-top: 6px;
  49 }
  50
  51 .w-sdc-designer-sidebar-toggle.active + .w-sdc-designer-sidebar {
  52   right: 0;
  53   display: flex;
  54   flex-direction: column;
  55 }