New UI merge in progress

10 files changed, 1118 insertions, 0 deletions

diff --git a/public/ng/less/ui/alert.less b/public/ng/less/ui/alert.less
new file mode 100644
index 0000000000..a52bc7f9f2
--- /dev/null
+++ b/public/ng/less/ui/alert.less
@@ -0,0 +1,47 @@
+@import "var";
+
+.alert{
+  padding: .6em 1.5em;
+  margin-bottom: 10px;
+  i{
+    margin-right: 8px;
+  }
+}
+
+.alert-radius{
+  border-radius: .25em;
+}
+
+.alert-red{
+  color: @alertRedColor;
+  border: 1px solid darken(@alertRedColor,10%);
+  background-color: lighten(@alertRedColor,40%);
+}
+
+.alert-blue{
+  color: @alertBlueColor;
+  border: 1px solid darken(@alertBlueColor,10%);
+  background-color: lighten(@alertBlueColor,45%);
+}
+
+.alert-green{
+  color: @alertGreenColor;
+  border: 1px solid darken(@alertGreenColor,10%);
+  background-color: lighten(@alertGreenColor,45%);
+}
+
+.alert-gray{
+  color: @alertGrayColor;
+  border: 1px solid darken(@alertGrayColor,10%);
+  background-color: lighten(@alertGrayColor,35%);
+}
+
+.alert-orange{
+  color: @alertOrangeColor;
+  border: 1px solid darken(@alertOrangeColor,10%);
+  background-color: lighten(@alertOrangeColor,45%);
+}
+
+
+
+
diff --git a/public/ng/less/ui/bread.less b/public/ng/less/ui/bread.less
new file mode 100644
index 0000000000..9e96eb43b9
--- /dev/null
+++ b/public/ng/less/ui/bread.less
@@ -0,0 +1,18 @@
+@import "var";
+
+.breads {
+  .bread {
+    &:after {
+      content: "/";
+      font-weight: bold;
+      margin: 0 4px 0 7px;
+      color:@breadColor;
+    }
+  }
+  .bread:last-child {
+    &:after {
+      content: "";
+      margin: 0;
+    }
+  }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/form.less b/public/ng/less/ui/form.less
new file mode 100644
index 0000000000..017432935f
--- /dev/null
+++ b/public/ng/less/ui/form.less
@@ -0,0 +1,192 @@
+@import "var";
+
+// colored buttons
+.btn {
+  &:hover {
+  }
+}
+
+.btn-small {
+  font-size: 0.9*@baseFontSize;
+  padding: .4em .9em;
+}
+
+.btn-large {
+  font-size: 1.2*@baseFontSize;
+}
+
+.btn-green {
+  background-color: @btnGreenColor;
+  border: 1px solid @btnGreenColor;
+  &:hover {
+    background-color: @btnHoverGreenColor;
+    color: #FFF;
+  }
+}
+
+.btn-blue {
+  background-color: @btnBlueColor;
+  border: 1px solid @btnBlueColor;
+  &:hover {
+    background-color: @btnHoverBlueColor;
+    color: #FFF;
+  }
+}
+
+.btn-red {
+  background-color: @btnRedColor;
+  border: 1px solid @btnRedColor;
+  &:hover {
+    background-color: @btnHoverRedColor;
+    color: #FFF;
+  }
+}
+
+.btn-orange {
+  background-color: @btnOrangeColor;
+  border: 1px solid @btnOrangeColor;
+  &:hover {
+    background-color: @btnHoverOrangeColor;
+    color: #FFF;
+  }
+}
+
+.btn-black {
+  background-color: @btnBlackColor;
+  border: 1px solid @btnBlackColor;
+  &:hover {
+    background-color: @btnHoverBlackColor;
+    color: #FFF;
+  }
+}
+
+.btn-gray {
+  background-color: @btnGrayColor;
+  color: @baseFontColor;
+  border: 1px solid @btnGrayBorderColor;
+  &:hover {
+    background-color: @btnGrayHoverColor;
+    color: @baseFontColor;
+  }
+}
+
+// status buttons
+
+.btn-active {
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, .1) inset, 0 0 4px rgba(0, 0, 0, .15) inset
+}
+
+.btn-radius {
+  border-radius: .25em;
+}
+
+.btn-left-radius {
+  border-top-left-radius: .25em;
+  border-bottom-left-radius: .25em;
+}
+
+.btn-right-radius {
+  border-top-right-radius: .25em;
+  border-bottom-right-radius: .25em;
+}
+
+.btn-block {
+  display: block;
+  width: 100%;
+  box-sizing: content-box;
+  text-align: center;
+}
+
+.btn-disabled {
+  opacity: .6;
+  cursor: not-allowed;
+  box-shadow: none;
+  background-image: none !important;
+  border: none;
+  &:hover {
+    background-image: none !important;
+    color: @btnHoverFontColor;
+  }
+}
+
+// input form elements
+
+.ipt {
+  &:focus {
+    border-color: @iptFocusBorderColor;
+  }
+}
+
+.ipt-radius {
+  border-radius: .25em;
+}
+
+.ipt-small {
+  font-size: .8*@baseFontSize;
+}
+
+.ipt-large {
+  font-size: 1.2*@baseFontSize;
+}
+
+.ipt-disabled,
+input[disabled] {
+  background-color: @iptDisabledColor !important;
+  &:focus {
+    background-color: @iptDisabledColor !important;
+  }
+  color: #888;
+  cursor: not-allowed;
+}
+
+.ipt-readonly,
+input[readonly] {
+  &:focus {
+    background-color: @iptDisabledColor !important;
+  }
+}
+
+.ipt-error {
+  border-color: @iptErrorBorderColor !important;
+  background-color: @iptErrorFocusColor !important;
+}
+
+.form {
+  label {
+    margin-right: 1em;
+  }
+  .help {
+    color: @formHelpFontColor;
+    padding-top: .6em;
+    display: inline-block;
+  }
+}
+
+.form-stack {
+  label {
+    display: block;
+  }
+  .field {
+    margin-bottom: 1em;
+  }
+}
+
+.form-align {
+  label,
+  .form-label {
+    display: inline-block;
+    width: 120px;
+    text-align: right;
+    margin-right: 1em;
+  }
+  .field {
+    margin-bottom: 1em;
+  }
+}
+
+label.req {
+  &:after {
+    content: "*";
+    color: @labelRedColor;
+  }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/grid.less b/public/ng/less/ui/grid.less
new file mode 100644
index 0000000000..2b7d004340
--- /dev/null
+++ b/public/ng/less/ui/grid.less
@@ -0,0 +1,99 @@
+@import "var";
+@import "reset";
+
+// float elements
+
+.left {
+  float: left;
+}
+
+.right {
+  float: right;
+}
+
+.clear::after {
+  clear: both;
+  content: " ";
+  width: 0;
+  height: 0;
+  display: block;
+}
+
+.hide {
+  display: none;
+}
+
+// 12 based grids
+
+.grid-1-12 {
+  width: 8.33%;
+}
+
+.grid-2-12,
+.grid-1-6 {
+  width: 16.67%;
+}
+
+.grid-3-12,
+.grid-1-4 {
+  width: 25%;
+}
+
+.grid-4-12,
+.grid-1-3 {
+  width: 33%;
+}
+
+.grid-5-12 {
+  width: 41.67%;
+}
+
+.grid-6-12,
+.grid-1-2 {
+  width: 50%;
+}
+
+.grid-7-12 {
+  width: 58.33%;
+}
+
+.grid-8-12,
+.grid-2-3 {
+  width: 66.67%;
+}
+
+.grid-9-12,
+.grid-3-4 {
+  width: 75%;
+}
+
+.grid-10-12,
+.grid-5-6 {
+  width: 83.33%;
+}
+
+.grid-11-12 {
+  width: 91.67%;
+}
+
+*[class*="grid-"] {
+  box-sizing: content-box;
+}
+
+// 5 based
+
+.grid-1-5 {
+  width: 20%;
+}
+
+.grid-2-5 {
+  width: 40%;
+}
+
+.grid-3-5 {
+  width: 60%;
+}
+
+.grid-4-5 {
+  width: 80%;
+}
diff --git a/public/ng/less/ui/label.less b/public/ng/less/ui/label.less
new file mode 100644
index 0000000000..1cf0a81d85
--- /dev/null
+++ b/public/ng/less/ui/label.less
@@ -0,0 +1,41 @@
+@import "var";
+
+.label {
+  padding: 2px 6px;
+  color: @labelFontColor;
+}
+
+.label-red {
+  background-color: @labelRedColor;
+}
+
+.label-blue {
+  background-color: @labelBlueColor;
+}
+
+.label-gray {
+  background-color: @labelGrayColor;
+}
+
+.label-green {
+  background-color: @labelGreenColor;
+}
+
+.label-orange {
+  background-color: @labelOrangeColor;
+}
+
+.label-black {
+  background-color: @labelBlackColor;
+}
+
+.label-radius{
+  border-radius: .2em;
+}
+
+.label-link{
+  color: @labelFontColor;
+  &:hover{
+    color: @labelFontColor;
+  }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/menu.less b/public/ng/less/ui/menu.less
new file mode 100644
index 0000000000..e36667ce26
--- /dev/null
+++ b/public/ng/less/ui/menu.less
@@ -0,0 +1,158 @@
+@import "var";
+
+// lined menu
+
+ul.menu {
+  > li {
+    list-style: none;
+    > a {
+      padding: .8em 1.2em;
+      &:hover {
+        background-color: @lineMenuHoverBgColor;
+        color: @lineMenuHoverFontColor;
+      }
+    }
+    &.current > a,
+    &.hover > a {
+      color: @lineMenuHoverFontColor;
+    }
+  }
+  > li.head {
+    font-weight: bold;
+    padding: .8em 1.2em;
+  }
+  > li.down:hover {
+    > ul.menu-down {
+      display: block;
+    }
+  }
+  > li.border-bottom {
+    border-bottom: 1px solid @menuBorderColor;
+    height: 0;
+    margin: .5em 0;
+  }
+}
+
+ul.menu-line {
+  > li,
+  > li > a {
+    display: inline-block;
+  }
+  > li.down {
+    position: relative;
+    > a:after {
+      content: "\25BE";
+      margin-left: .4em;
+    }
+    > ul.menu-down {
+      top: 2.1em;
+      width: 150%;
+    }
+  }
+  > li.hover {
+    position: relative;
+    > a:after {
+      position: absolute;
+      content: "\25B4";
+      left: 50%;
+      bottom: -1.1em;
+      margin-left: -4px;
+    }
+  }
+}
+
+ul.menu-vertical,
+ul.menu-down {
+  > li > a,
+  > li.head {
+    display: block;
+    padding: .4em 1.2em;
+  }
+  > li.down {
+    position: relative;
+    > a:after {
+      content: "\25B8";
+      position: absolute;
+      right: .6em;
+    }
+  }
+  > li.hover {
+    position: relative;
+    > a:after {
+      content: "\25B8";
+      position: absolute;
+      left: .5em;
+    }
+  }
+}
+
+ul.menu-border,
+ul.menu-down {
+  border: 1px solid @menuBorderColor;
+  > li.head {
+    border-bottom: 1px solid @menuBorderColor;
+  }
+}
+
+ul.menu-down {
+  position: absolute;
+  display: none;
+  z-index: 99;
+  box-shadow: 0 0 2px @menuShadowColor;
+  background-color: @menuDownBgColor;
+}
+
+ul.menu-radius {
+  border-radius: .3em;
+  > li {
+    &:first-child {
+      border-top-left-radius: .3em;
+      border-top-right-radius: .3em;
+      > a {
+        border-top-left-radius: .2em;
+        border-top-right-radius: .2em;
+      }
+    }
+    &:last-child {
+      border-bottom-left-radius: .3em;
+      border-bottom-right-radius: .3em;
+      > a {
+        border-bottom-left-radius: .2em;
+        border-bottom-right-radius: .2em;
+      }
+    }
+  }
+}
+
+.drop {
+  position: relative;
+  &:hover {
+    > .drop-down {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 200%;
+      display: block;
+    }
+  }
+  > .drop-down {
+    display: none;
+    border: 1px solid @dropBorderColor;
+    box-shadow: 0 0 3px @menuShadowColor;
+    background-color: @dropDownBgColor;
+  }
+}
+
+.drop-bottom {
+  &:after {
+    content: "\25BE";
+    margin-left: .4em;
+  }
+}
+
+.drop-top {
+  &:after {
+    content: "\25B4";
+    margin-left: .4em;
+  }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/panel.less b/public/ng/less/ui/panel.less
new file mode 100644
index 0000000000..52f8dafb00
--- /dev/null
+++ b/public/ng/less/ui/panel.less
@@ -0,0 +1,41 @@
+@import "var";
+.panel {
+    border: 1px solid@panelBorderColor;
+    .panel-header {
+        font-size: 16px;
+        padding: .6em 1.2em;
+        background-color: @panelHeaderBgColor;
+        border-bottom: 1px solid@panelBorderColor;
+    }
+    .panel-body {
+        .panel-desc {
+            margin-bottom: 20px;
+        }
+    }
+    .panel-content {
+        padding: 1em 1.2em;
+    }
+    .panel-footer {
+        padding: .6em 1.2em;
+        background-color: @panelFooterBgColor;
+        border-top: 1px solid@panelBorderColor;
+    }
+    &.panel-radius {
+        border-radius: .3em;
+        .panel-header {
+            border-top-left-radius: .3em;
+            border-top-right-radius: .3em;
+        }
+        .panel-footer {
+            border-bottom-left-radius: .3em;
+            border-bottom-right-radius: .3em;
+        }
+    }
+    &.panel-warning {
+        border-color: #F0C36D;
+        > .panel-header {
+            background-color: #F9EDBE;
+            border-color: #F0C36D;
+        }
+    }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/reset.less b/public/ng/less/ui/reset.less
new file mode 100644
index 0000000000..a1501d6574
--- /dev/null
+++ b/public/ng/less/ui/reset.less
@@ -0,0 +1,376 @@
+@import "var";
+
+* {
+  padding: 0;
+  margin: 0;
+}
+
+html {
+  font-size: @baseFontSize+1;
+  font-family: Helvetica, "Microsoft Yahei", Menlo, Monaco, Consolas, "Courier New", monospace;
+  // make sure min font size
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  line-height: @baseLineHeight;
+
+  color: @baseFontColor;
+  background-color: @baseBgColor;
+
+}
+
+input,
+textarea,
+select,
+option,
+button {
+  font-family: Helvetica, "Microsoft Yahei", Menlo, Monaco, Consolas, "Courier New", monospace;
+}
+
+// html5 block elements
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+main,
+nav,
+section,
+summary,
+.block {
+  display: block;
+}
+
+.inline {
+  display: inline;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.dis-table {
+  display: table;
+}
+
+.dis-table-cell {
+  display: table-cell;
+}
+
+.dis-flex {
+  display: flex;
+}
+
+// html5 media elements
+
+audio,
+canvas,
+progress,
+video {
+  display: inline-block;
+  vertical-align: baseline;
+}
+
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+
+// display hidden elements
+
+[hidden],
+template
+.hidden {
+  display: none;
+}
+
+.opacity {
+  opacity: 0;
+}
+
+.opacity-half {
+  opacity: .5;
+}
+
+// links element
+
+a,
+.text-link {
+  color: @linkColor;
+  text-decoration: none;
+  &:hover {
+    color: @linkHoverColor;
+    text-decoration: none;
+  }
+  &:focus {
+    outline: none;
+  }
+}
+
+// stylus elements
+
+b,
+strong,
+.text-bold {
+  font-weight: bold;
+}
+
+dfn,
+.text-italic {
+  font-style: italic;
+}
+
+// headers elements
+
+h1,
+.text-h1 {
+  font-size: 2em;
+  margin-bottom: 0.67em;
+}
+
+h2,
+.text-h2 {
+  font-size: 1.6em;
+  margin-bottom: 0.625em;
+}
+
+h3,
+.text-h3 {
+  font: 1.2em;
+  margin-bottom: 0.5em;
+}
+
+h4,
+h5,
+h6,
+.text-h4,
+.text-h5,
+.text-h6 {
+  font-size: 1em;
+  margin-bottom: .3em;
+}
+
+// text elements
+
+small,
+.text-small {
+  font-size: .8em;
+}
+
+sub,
+sup,
+.text-sup,
+.text-sub {
+  font-size: .7em;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sup,
+.text-sup {
+  top: -0.5em;
+}
+
+sub,
+.text-sub {
+  bottom: -0.25em;
+}
+
+.figure,
+.blockquote {
+  margin: 1em 1.5em;
+}
+
+pre {
+  overflow: auto;
+  margin: 0;
+  padding: .4em 1em;
+}
+
+code,
+kbd,
+pre,
+samp {
+  font-family: monospace, monospace;
+  font-size: 1em;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.list-no-style {
+  list-style: none;
+}
+
+// image elements
+
+img {
+  border: none;
+}
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+// form elements
+
+label {
+  font-weight: bold;
+}
+
+input,
+.ipt {
+  padding: .6em;
+  line-height: normal;
+  border: 1px solid @iptBorderColor;
+  &:focus {
+    background-color: @iptFocusColor;
+    outline: none;
+  }
+}
+
+button {
+  overflow: visible;
+  padding: .6em 1.2em;
+}
+
+button,
+select {
+  text-transform: none;
+  &:focus {
+    outline: none;
+  }
+}
+
+button,
+input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+  -webkit-appearance: button;
+  -moz-appearance: button;
+  cursor: pointer;
+  background-color: @btnBgColor;
+  color: @btnFontColor;
+  border: none;
+  &:hover {
+    background-color: @btnHoverBgColor;
+    color: @btnHoverFontColor;
+  }
+}
+
+button[disabled],
+html input[disabled] {
+  cursor: default;
+}
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+input[type="search"] {
+  -webkit-appearance: textfield;
+  -moz-appearance: textfield;
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+fieldset {
+  border: 1px solid @iptBorderColor;
+  margin: 0 2px;
+  padding: 0.4em 0.8em 0.8em;
+}
+
+legend {
+  border: 0;
+  padding: 0;
+}
+
+textarea {
+  overflow: auto;
+  border: 1px solid @iptBorderColor;
+  padding: .6em;
+  &:focus {
+    background-color: @iptFocusColor;
+    outline: none;
+  }
+}
+
+optgroup {
+  font-weight: bold;
+}
+
+// table elements
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+td,
+th {
+  padding: 0;
+}
+
+// hr element
+
+hr {
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+  height: 0;
+  border: none;
+  border-bottom: 1px solid @hrColor;
+  margin-bottom: .75em;
+}
+
+// code element
+
+p {
+  code {
+    color: @inlineCodeColor;
+  }
+}
+
+// radius element
+
+.radius {
+  border-radius: .25em;
+}
+
+// truncate element
+
+.text-truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: inline-block;
+  vertical-align: top;
+}
+
+// code elements
+
+pre {
+  line-height: 1.6;
+  overflow: auto;
+  padding: 0;
+}
diff --git a/public/ng/less/ui/table.less b/public/ng/less/ui/table.less
new file mode 100644
index 0000000000..0ceb5e8c95
--- /dev/null
+++ b/public/ng/less/ui/table.less
@@ -0,0 +1,63 @@
+@import "var";
+
+table {
+  th,
+  td {
+    padding: .3em .6em;
+    line-height: 30px;
+  }
+}
+
+.table-border {
+  border: 1px solid @tableBorderColor;
+  tr {
+    border-top: 1px solid @tableCellBorderColor;
+    th,
+    td, {
+      border-top: 1px solid @tableCellBorderColor;
+    }
+    &:first-child {
+      border-top: none;
+    }
+  }
+  thead {
+    border-bottom: 1px solid @tableBorderColor;
+  }
+}
+
+.table-block {
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.table-radius {
+  border-collapse: separate !important;
+  border-radius: .3em;
+  thead:first-child {
+    border-top-left-radius: .3em;
+    border-top-right-radius: .3em;
+    tr:first-child {
+      border-top-left-radius: .3em;
+      > th:first-child {
+        border-top-left-radius: .3em;
+      }
+      > th:last-child {
+        border-top-right-radius: .3em;
+      }
+    }
+  }
+  tbody {
+    border-bottom-left-radius: .3em;
+    border-bottom-right-radius: .3em;
+    tr:last-child {
+      border-bottom-left-radius: .3em;
+      border-bottom-right-radius: .3em;
+      > td:first-child {
+        border-bottom-left-radius: .3em;
+      }
+      > td:last-child {
+        border-bottom-right-radius: .3em;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/public/ng/less/ui/var.less b/public/ng/less/ui/var.less
new file mode 100644
index 0000000000..e3c5ada633
--- /dev/null
+++ b/public/ng/less/ui/var.less
@@ -0,0 +1,83 @@
+@baseFontSize: 12px;
+
+@baseLineHeight: 24px;
+
+@baseBgColor: #FAFAFA;
+@baseFontColor: #444;
+
+@linkColor: #428BCA;
+@linkHoverColor: #399ADE;
+@linkVisitedColor: #0c172f;
+
+@iptBorderColor: #BBB;
+@iptFocusColor: #f2fffc;
+@iptFocusBorderColor: #428BCA;
+@iptDisabledColor: #F2F2F2;
+@iptErrorBorderColor: #b63b2c;
+@iptErrorFocusColor: #ffF0F0;
+@formHelpFontColor:#999;
+
+@hrColor: #DDD;
+
+@inlineCodeColor: #b63b2c;
+
+@btnBgColor: #888;
+@btnFontColor: #FAFAFA;
+@btnHoverBgColor: #444;
+@btnHoverFontColor: #FFF;
+
+@btnGreenColor: #65AD4E;
+@btnHoverGreenColor: #71BF57;
+
+@btnBlueColor: #428BCA;
+@btnHoverBlueColor: #539CDB;
+
+@btnRedColor: #D9453D;
+@btnHoverRedColor: #FF635A;
+
+@btnBlackColor: #444;
+@btnHoverBlackColor: #383838;
+
+@btnOrangeColor: #DF7514;
+@btnHoverOrangeColor: #df8229;
+
+@btnGrayColor: #F0F0F0;
+@btnGrayHoverColor: #FAFAFA;
+@btnGrayBorderColor: #D0D0D0;
+
+@lineMenuHoverBgColor: #EAEAEA;
+@lineMenuHoverFontColor: #444;
+
+@menuBorderColor: #BBB;
+@dropBorderColor: #BBB;
+@menuShadowColor: #666;
+@dropShadowColor: #666;
+@menuDownBgColor: #FFF;
+@dropDownBgColor: #FFF;
+
+@panelBorderColor: #CCC;
+@panelHeaderBgColor: #EEE;
+@panelFooterBgColor: #EEE;
+
+@labelRedColor: #D9453D;
+@labelBlueColor: #428BCA;
+@labelGreenColor: #65AD4E;
+@labelOrangeColor: #DF7514;
+@labelBlackColor: #444;
+@labelFontColor: #FFF;
+@labelGrayColor: #999;
+
+@breadColor: #444;
+
+@alertRedColor: #D9453D;
+@alertBlueColor: #428BCA;
+@alertGreenColor: #65AD4E;
+@alertOrangeColor: #DF7514;
+@alertBlackColor: #444;
+@alertGrayColor: #999;
+
+@tableBorderColor:#D6D6D6;
+@tableCellBorderColor:#EAEAEA;
+
+@preBgColor:#444;
+@preFontColor:#FFF;