view/theme/quattro/icons.less

   1 // Quattro Theme LESS file
   2 /* icons */
   3
   4 .icons(@size: 22) {
   5         &.notify { background-image: url("../../../images/icons/@{size}/notify_off.png"); }
   6         &.gear   { background-image: url("../../../images/icons/@{size}/gear.png"); }
   7
   8         &.add           { background-image: url("../../../images/icons/@{size}/add.png"); }
   9         &.delete        { background-image: url("../../../images/icons/@{size}/delete.png"); }
  10         &.edit          { background-image: url("../../../images/icons/@{size}/edit.png"); }
  11         &.star          { background-image: url("../../../images/icons/@{size}/star.png"); }
  12         &.menu          { background-image: url("../../../images/icons/@{size}/menu.png"); }
  13         &.link          { background-image: url("../../../images/icons/@{size}/link.png"); }
  14         &.lock          { background-image: url("../../../images/icons/@{size}/lock.png"); }
  15         &.unlock        { background-image: url("../../../images/icons/@{size}/unlock.png"); }
  16         &.plugin        { background-image: url("../../../images/icons/@{size}/plugin.png"); }
  17         &.type-unkn     { background-image: url("../../../images/icons/@{size}/zip.png"); }
  18         &.type-audio{ background-image: url("../../../images/icons/@{size}/audio.png"); }
  19         &.type-video{ background-image: url("../../../images/icons/@{size}/video.png"); }
  20         &.type-image{ background-image: url("../../../images/icons/@{size}/image.png"); }
  21         &.type-text     { background-image: url("../../../images/icons/@{size}/text.png"); }
  22
  23 }
  24
  25
  26 .icon {
  27         background-color: transparent ;
  28         background-repeat: no-repeat;
  29         background-position: left center;
  30         display: block;
  31         overflow: hidden;
  32         text-indent: -9999px;
  33         padding: 1px;
  34
  35         &.text {
  36                 text-indent: 0px;
  37         }
  38
  39         &.s10 {
  40                 min-width:10px; height: 10px;
  41                 .icons(10);
  42                 &.text { padding: 2px 0px 0px 15px;  }
  43         }
  44         &.s16 {
  45                 min-width:16px; height: 16px;
  46                 .icons(16);
  47                 &.text { padding: 4px 0px 0px 20px;  }
  48         }
  49         &.s22 {
  50                 min-width:22px; height: 22px;
  51                 .icons(22);
  52                 &.text { padding: 10px 0px 0px 25px;  }
  53         }
  54         &.s48 {
  55                 width:48px; height: 48px;
  56                 .icons(48);
  57         }
  58
  59
  60 }