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         &.intro  { background-image: url("icons/contacts_off.png"); }
   7         &.mail   { background-image: url("icons/messages_off.png"); }
   8         &.gear   { background-image: url("../../../images/icons/@{size}/gear.png"); }
   9
  10         &.like   { background-image: url("icons/like.png"); }
  11         &.dislike        { background-image: url("icons/dislike.png"); }
  12
  13         &.add           { background-image: url("../../../images/icons/@{size}/add.png"); }
  14         &.delete        { background-image: url("../../../images/icons/@{size}/delete.png"); }
  15         &.edit          { background-image: url("../../../images/icons/@{size}/edit.png"); }
  16         &.pencil        { background-image: url("../../../images/icons/@{size}/edit.png"); }
  17         &.star          { background-image: url("../../../images/icons/@{size}/star.png"); }
  18         &.menu          { background-image: url("../../../images/icons/@{size}/menu.png"); }
  19         &.link          { background-image: url("../../../images/icons/@{size}/link.png"); }
  20         &.remote-link   { background-image: url("../../../images/icons/@{size}/link.png"); }
  21         &.lock          { background-image: url("../../../images/icons/@{size}/lock.png"); }
  22         &.unlock        { background-image: url("../../../images/icons/@{size}/unlock.png"); }
  23         &.plugin        { background-image: url("../../../images/icons/@{size}/plugin.png"); }
  24         &.type-unkn     { background-image: url("../../../images/icons/@{size}/zip.png"); }
  25         &.type-application      { background-image: url("../../../images/icons/@{size}/zip.png"); }
  26         &.type-audio{ background-image: url("../../../images/icons/@{size}/audio.png"); }
  27         &.type-video{ background-image: url("../../../images/icons/@{size}/video.png"); }
  28         &.type-image{ background-image: url("../../../images/icons/@{size}/image.png"); }
  29         &.type-text     { background-image: url("../../../images/icons/@{size}/text.png"); }
  30
  31         &.language      { background-image: url("icons/language.png"); }
  32
  33
  34
  35 }
  36
  37
  38 .icon {
  39         background-color: transparent ;
  40         background-repeat: no-repeat;
  41         background-position: left center;
  42         display: block;
  43         overflow: hidden;
  44         text-indent: -9999px;
  45         padding: 1px;
  46
  47         &.text {
  48                 text-indent: 0px;
  49         }
  50
  51     min-width:22px; height: 22px;
  52     .icons(22);
  53     &.text { padding: 10px 0px 0px 25px;  }
  54
  55         &.s10 {
  56                 min-width:10px; height: 10px;
  57                 .icons(10);
  58                 &.text { padding: 2px 0px 0px 15px;  }
  59         }
  60         &.s16 {
  61                 min-width:16px; height: 16px;
  62                 .icons(16);
  63                 &.text { padding: 4px 0px 0px 20px;  }
  64         }
  65         &.s22 {
  66                 min-width:22px; height: 22px;
  67                 .icons(22);
  68                 &.text { padding: 10px 0px 0px 25px;  }
  69         }
  70         &.s48 {
  71                 width:48px; height: 48px;
  72                 .icons(48);
  73         }
  74
  75         &.on {
  76             background-image: url("icons/addon_on.png");
  77             min-width:16px;
  78             height: 16px;
  79             background-position: 0px 0px;
  80         }
  81         &.off {
  82             background-image: url("icons/addon_off.png");
  83             width: 16px;
  84             height: 16px;
  85             background-position: 0px 0px;
  86         }
  87
  88 }