git.r.bdr.sh - rbdr/dotfiles/blob - atom/packages/aesthetic-ui/styles/panels.less

   1 @import "ui-mixins";
   2 @import "ui-variables";
   3 @import "buttons";
   4
   5 .panel {
   6   &.bordered {
   7     border: 1px solid @base-border-color;
   8     border-radius: @component-border-radius;
   9   }
  10 }
  11
  12 atom-panel, .tool-panel {
  13   .text(normal);
  14   position: relative;
  15
  16   background-color: @tool-panel-background-color;
  17
  18   &.bottom, &.panel-bottom {
  19     border-top: 1px solid @tool-panel-border-color;
  20   }
  21
  22   &.left, &.panel-left {
  23     border-right: 1px solid @tool-panel-border-color;
  24   }
  25
  26   &.right, &.panel-right {
  27     border-left: 1px solid @tool-panel-border-color;
  28   }
  29
  30   .inset-panel {
  31     border-radius: @component-border-radius;
  32
  33     border: 1px solid @tool-panel-border-color;
  34   }
  35 }
  36
  37 .inset-panel {
  38   position: relative;
  39   background-color: @inset-panel-background-color;
  40 }
  41
  42 .panel-heading {
  43   border-bottom: none;
  44   padding: @component-padding - 2px @component-padding;
  45
  46   background-color: transparent;
  47   background-image: -webkit-linear-gradient(@panel-heading-background-color, darken(@panel-heading-background-color, 10%));
  48
  49   .btn {
  50     @bg: lighten(@button-background-color, 10%);
  51     @hover: lighten(@button-background-color-hover, 10%);
  52     @selected: lighten(@button-background-color-selected, 10%);
  53     @text: lighten(@text-color, 10%);
  54     .btn-background(@bg, @hover, @selected, @button-border-color, @text, @text);
  55   }
  56 }