mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-30 01:10:58 +01:00
4a6efd36b4
Summary: Consilidate some of the bar colors, used in Releeph? Test Plan: UIExamples Reviewers: epriestley Reviewed By: epriestley CC: Korvin, aran Differential Revision: https://secure.phabricator.com/D6974
100 lines
1.6 KiB
CSS
100 lines
1.6 KiB
CSS
/**
|
|
* @provides aphront-bars
|
|
*/
|
|
|
|
/**
|
|
* Progress bars
|
|
*/
|
|
|
|
div.aphront-bar.progress {
|
|
border: 0px;
|
|
}
|
|
|
|
div.aphront-bar.progress div {
|
|
width: 100px;
|
|
border: 1px solid;
|
|
border-top-color: {$lightgreyborder};
|
|
border-right-color: {$lightgreyborder};
|
|
border-bottom-color: {$lightgreyborder};
|
|
border-left-color: {$greyborder};
|
|
background: white;
|
|
float: left;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
div.aphront-bar.progress div div {
|
|
height: 10px;
|
|
}
|
|
|
|
div.aphront-bar.progress span {
|
|
color: {$darkgreytext};
|
|
}
|
|
|
|
|
|
/**
|
|
* Glyph bars
|
|
*/
|
|
|
|
div.aphront-bar.glyph {
|
|
clear: both;
|
|
}
|
|
|
|
div.aphront-bar.glyph div.glyphs {
|
|
padding: 0;
|
|
margin: 0;
|
|
|
|
float: left;
|
|
position: relative;
|
|
color: #aaa;
|
|
font-family: monospace;
|
|
height: 16px;
|
|
}
|
|
|
|
div.aphront-bar.glyph div.glyphs.starstar {
|
|
/* http://daringfireball.net/2005/08/star_star */
|
|
font-family: "Hiragino Kaku Gothic Pro", "Osaka", "Zapf Dingbats";
|
|
}
|
|
|
|
div.aphront-bar.glyph div.glyphs div.fg {
|
|
padding: 0;
|
|
margin: 0;
|
|
float: left;
|
|
position: absolute;
|
|
overflow: hidden;
|
|
}
|
|
|
|
div.aphront-bar.glyph div.caption {
|
|
padding: 0;
|
|
margin: 0;
|
|
float: left;
|
|
margin-left: 12px;
|
|
color: {$greytext};
|
|
}
|
|
|
|
|
|
/**
|
|
* Common color classes
|
|
*/
|
|
div.aphront-bar.progress.color-default div div {
|
|
background: {$blue};
|
|
}
|
|
|
|
div.aphront-bar.glyph.color-default div.glyphs div.fg {
|
|
color: {$blue};
|
|
}
|
|
|
|
div.aphront-bar.progress.color-warning div div {
|
|
background: {$yellow};
|
|
}
|
|
|
|
div.aphront-bar.glyph.color-warning div.glyphs div.fg {
|
|
color: {$yellow};
|
|
}
|
|
|
|
div.aphront-bar.progress.color-danger div div {
|
|
background: {$red};
|
|
}
|
|
|
|
div.aphront-bar.glyph.color-danger div.glyphs div.fg {
|
|
color: {$red};
|
|
}
|