[Summary view] [Print] [Text view]

   1  /**
   2   * @provides aphront-bars
   3   */
   4  
   5  /**
   6   * Progress bars
   7   */
   8  
   9  div.aphront-bar.progress {
  10    border: 0px;
  11  }
  12  
  13  div.aphront-bar.progress div {
  14    width: 100px;
  15    border: 1px solid;
  16    border-top-color: {$lightgreyborder};
  17    border-right-color: {$lightgreyborder};
  18    border-bottom-color: {$lightgreyborder};
  19    border-left-color: {$greyborder};
  20    background: white;
  21    float: left;
  22    margin-right: 12px;
  23  }
  24  
  25  div.aphront-bar.progress div div {
  26    height: 10px;
  27  }
  28  
  29  div.aphront-bar.progress span {
  30    color: {$darkgreytext};
  31  }
  32  
  33  
  34  /**
  35   * Glyph bars
  36   */
  37  
  38  div.aphront-bar.glyph {
  39    clear: both;
  40  }
  41  
  42  div.aphront-bar.glyph div.glyphs {
  43    padding: 0;
  44    margin: 0;
  45  
  46    float: left;
  47    position: relative;
  48    color: #aaa;
  49    font-family: monospace;
  50    height: 16px;
  51  }
  52  
  53  div.aphront-bar.glyph div.glyphs.starstar {
  54    /* http://daringfireball.net/2005/08/star_star */
  55    font-family: "Hiragino Kaku Gothic Pro", "Osaka", "Zapf Dingbats";
  56  }
  57  
  58  div.aphront-bar.glyph div.glyphs div.fg {
  59    padding: 0;
  60    margin: 0;
  61    float: left;
  62    position: absolute;
  63    overflow: hidden;
  64  }
  65  
  66  div.aphront-bar.glyph div.caption {
  67    padding: 0;
  68    margin: 0;
  69    float: left;
  70    margin-left: 12px;
  71    color: {$greytext};
  72  }
  73  
  74  
  75  /**
  76   * Common color classes
  77   */
  78  div.aphront-bar.progress.color-default div div {
  79    background: {$blue};
  80  }
  81  
  82  div.aphront-bar.glyph.color-default div.glyphs div.fg {
  83    color: {$blue};
  84  }
  85  
  86  div.aphront-bar.progress.color-warning div div {
  87    background: {$yellow};
  88  }
  89  
  90  div.aphront-bar.glyph.color-warning div.glyphs div.fg {
  91    color: {$yellow};
  92  }
  93  
  94  div.aphront-bar.progress.color-danger div div {
  95    background: {$red};
  96  }
  97  
  98  div.aphront-bar.glyph.color-danger div.glyphs div.fg {
  99    color: {$red};
 100  }