default.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541
  1. /* skin-aria-ng core */
  2. .skin-aria-ng {
  3. overflow-y: hidden;
  4. }
  5. .skin-aria-ng,
  6. .skin-aria-ng h1,
  7. .skin-aria-ng h2,
  8. .skin-aria-ng h3,
  9. .skin-aria-ng h4,
  10. .skin-aria-ng h5,
  11. .skin-aria-ng h6,
  12. .skin-aria-ng .h1,
  13. .skin-aria-ng .h2,
  14. .skin-aria-ng .h3,
  15. .skin-aria-ng .h4,
  16. .skin-aria-ng .h5,
  17. .skin-aria-ng .h6,
  18. .skin-aria-ng .main-header .logo,
  19. .skin-aria-ng .sweet-alert,
  20. .skin-aria-ng .popover,
  21. .skin-aria-ng .tooltip {
  22. font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  23. }
  24. .skin-aria-ng .main-header .navbar {
  25. background-color: #f6f6f6;
  26. border-bottom: 1px solid #ddd;
  27. }
  28. .skin-aria-ng .main-header .navbar .nav > li > a {
  29. color: #707070;
  30. font-size: 16px;
  31. }
  32. .skin-aria-ng .main-header .navbar .nav > li > a:hover,
  33. .skin-aria-ng .main-header .navbar .nav > li > a:active,
  34. .skin-aria-ng .main-header .navbar .nav > li > a:focus,
  35. .skin-aria-ng .main-header .navbar .nav .open > a,
  36. .skin-aria-ng .main-header .navbar .nav .open > a:hover,
  37. .skin-aria-ng .main-header .navbar .nav .open > a:focus,
  38. .skin-aria-ng .main-header .navbar .nav > .active > a {
  39. color: #0080ff;
  40. }
  41. .skin-aria-ng .main-header .navbar .nav > li.disabled > a {
  42. color: #ccc !important;
  43. }
  44. .skin-aria-ng .main-header .navbar .nav > li.divider {
  45. padding: 10px 0 10px 0;
  46. margin-left: 4px;
  47. margin-right: 4px;
  48. border-right: 1px solid #ccc;
  49. position: relative;
  50. top: 15px;
  51. }
  52. .skin-aria-ng .main-header .navbar .navbar-searchbar .form-control-icon {
  53. color: #999999;
  54. }
  55. @media (max-width: 767px) {
  56. .skin-aria-ng .main-header .navbar {
  57. padding-left: 20px;
  58. }
  59. .skin-aria-ng .main-header .navbar .navbar-nav {
  60. margin-left: -10px;
  61. }
  62. .skin-aria-ng .main-header .navbar .nav > li.divider {
  63. margin-left: 0;
  64. margin-right: 0;
  65. top: 5px;
  66. }
  67. }
  68. .skin-aria-ng .main-header .logo {
  69. background-color: #3c4852;
  70. color: #ffffff;
  71. border-bottom: 1px solid #59636b;
  72. }
  73. .skin-aria-ng .main-header .logo .logo-lg:hover {
  74. color: #cccccc;
  75. }
  76. .skin-aria-ng .main-header .logo .logo-lg .logo-lg-title {
  77. margin-right: 6px;
  78. }
  79. .skin-aria-ng .main-header .logo .dropdown-menu {
  80. margin-top: -1px;
  81. border-top-left-radius: 0;
  82. border-top-right-radius: 0;
  83. }
  84. .skin-aria-ng .main-header .logo .dropdown-menu > li.active > a {
  85. color: #777;
  86. background-color: #fff;
  87. }
  88. .skin-aria-ng .main-header .logo .dropdown-menu > li.active:hover > a {
  89. color: #333;
  90. background-color: #e1e3e9;
  91. }
  92. .skin-aria-ng .content-header {
  93. background: transparent;
  94. }
  95. .skin-aria-ng .wrapper,
  96. .skin-aria-ng .main-sidebar,
  97. .skin-aria-ng .left-side {
  98. background-color: #3c4852;
  99. }
  100. .skin-aria-ng .sidebar-menu > li.header {
  101. color: #707070;
  102. background-color: #2e343c;
  103. padding-top: 3px;
  104. padding-bottom: 3px;
  105. }
  106. .skin-aria-ng .sidebar-menu > li > a {
  107. border-left: 3px solid transparent;
  108. padding-top: 9px;
  109. padding-bottom: 9px;
  110. }
  111. .skin-aria-ng .sidebar-menu > li:hover > a {
  112. color: #dfdfdf;
  113. background-color: #313a42;
  114. }
  115. .skin-aria-ng .sidebar-menu > li.active > a {
  116. color: #5399e8;
  117. background-color: #252c30;
  118. }
  119. .skin-aria-ng .sidebar-menu > li.treeview:hover > a {
  120. color: #a2b5b9;
  121. background-color: #3c4852;
  122. }
  123. .skin-aria-ng .sidebar-menu > li.treeview.active > a, .skin-aria-ng .sidebar-menu > li.treeview.active:hover > a {
  124. color: #5399e8;
  125. background-color: #3c4852;
  126. }
  127. .skin-aria-ng .sidebar-menu > li.treeview > a:hover {
  128. color: #dfdfdf;
  129. background-color: #313a42;
  130. }
  131. .skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu {
  132. margin: 0;
  133. padding: 0;
  134. background-color: #3c4852;
  135. }
  136. .skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li > a {
  137. color: #8aa4af;
  138. }
  139. .skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li > a:hover {
  140. color: #dfdfdf;
  141. background-color: #313a42;
  142. }
  143. .skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li.active > a {
  144. color: #5399e8;
  145. background-color: #252c30;
  146. }
  147. .skin-aria-ng .sidebar-menu i.fa {
  148. font-size: 18px;
  149. margin-right: 2px;
  150. }
  151. .skin-aria-ng .sidebar a {
  152. color: #a2b5b9;
  153. }
  154. .skin-aria-ng .sidebar a:hover {
  155. text-decoration: none;
  156. }
  157. @media (max-width: 767px) {
  158. .skin-aria-ng .main-sidebar {
  159. margin-top: 5px;
  160. }
  161. }
  162. .skin-aria-ng .sidebar .status-label {
  163. max-width: 95px;
  164. }
  165. .skin-aria-ng .content-wrapper, .right-side {
  166. background-color: #fff;
  167. }
  168. .skin-aria-ng .content-wrapper .form-control[type='text'] {
  169. padding-left: 14px;
  170. }
  171. @media screen and (max-width: 767px) {
  172. .skin-aria-ng .content-wrapper .content {
  173. margin-top: 5px;
  174. }
  175. }
  176. .skin-aria-ng .main-footer {
  177. font-size: 12px;
  178. }
  179. .skin-aria-ng .main-footer > .navbar {
  180. border: 0;
  181. }
  182. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li.divider {
  183. padding-top: 16px;
  184. margin-left: 4px;
  185. margin-right: 4px;
  186. border-right: 1px solid #ccc;
  187. position: relative;
  188. top: 0;
  189. }
  190. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a {
  191. color: #707070;
  192. line-height: 17px;
  193. }
  194. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:hover,
  195. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:active,
  196. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:focus,
  197. .skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li.open > a {
  198. color: #0080ff;
  199. background: none;
  200. }
  201. .skin-aria-ng .global-status {
  202. margin-right: 10px;
  203. color: inherit;
  204. }
  205. .skin-aria-ng .global-status:hover {
  206. border: 1px solid #ccc;
  207. margin-right: 9px;
  208. margin-top: -1px
  209. }
  210. .skin-aria-ng .progress-bar-primary {
  211. background-color: #208fe5;
  212. }
  213. .skin-aria-ng .progress-bar-warning {
  214. background-color: #f39c12;
  215. }
  216. .skin-aria-ng .icon-primary {
  217. color: #3c8dbc;
  218. }
  219. .skin-aria-ng .icon-download {
  220. color: #3a89e9;
  221. }
  222. .skin-aria-ng .icon-upload {
  223. color: #74a329;
  224. }
  225. .skin-aria-ng .icon-seeder {
  226. margin-left: 4px;
  227. color: #74a329;
  228. }
  229. .skin-aria-ng .icon-error {
  230. margin-left: 4px;
  231. color: #dd4b39;
  232. }
  233. .skin-aria-ng .icon-expand {
  234. color: #5399e8;
  235. }
  236. .skin-aria-ng .icon-dir-expand {
  237. color: #999;
  238. }
  239. .skin-aria-ng .nav-tabs-custom {
  240. -webkit-box-shadow: none;
  241. -moz-box-shadow: none;
  242. box-shadow: none;
  243. margin-bottom: 0;
  244. }
  245. .skin-aria-ng .nav-tabs-custom > .nav-tabs {
  246. border-bottom: 1px dotted #ddd;
  247. }
  248. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li {
  249. border-top: 0;
  250. margin-top: 1px;
  251. margin-right: 2px;
  252. }
  253. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.active {
  254. border-bottom: 2px solid #208fe5;
  255. }
  256. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.slim > a {
  257. padding-left: 5px;
  258. padding-right: 5px;
  259. }
  260. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.slim.active {
  261. margin-bottom: -1px;
  262. border-bottom: inherit;
  263. }
  264. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.divider {
  265. padding: 10px 0 10px 0;
  266. margin-left: 4px;
  267. margin-right: 4px;
  268. margin-top: 11px;
  269. border-right: 1px solid #ccc;
  270. }
  271. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.nav-toolbar {
  272. margin-left: 15px;
  273. margin-right: 5px;
  274. }
  275. @media (max-width: 767px) {
  276. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.nav-toolbar {
  277. float: right;
  278. }
  279. }
  280. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.nav-toolbar > .btn-group {
  281. margin-right: 4px;
  282. }
  283. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a {
  284. color: #aaa;
  285. border: 0;
  286. }
  287. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a:hover,
  288. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a:active,
  289. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li.active > a {
  290. color: #208fe5;
  291. }
  292. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a.nav-tab-close:hover {
  293. color: #dd4b39 !important;
  294. margin-left: -14px;
  295. }
  296. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > a.nav-tab-close:hover > .fa-times:before {
  297. content:"\f057"; /* The same as .fa-times-circle:before */
  298. font-size: 1.1em;
  299. }
  300. .skin-aria-ng .nav-tabs-custom > .nav-tabs > li > div.btn-group {
  301. padding-top: 5px;
  302. padding-bottom: 5px;
  303. }
  304. .skin-aria-ng .tooltip.tooltip-success.in, .skin-aria-ng .tooltip.tooltip-warning.in, .skin-aria-ng .tooltip.tooltip-error.in {
  305. filter: alpha(opacity=95);
  306. opacity: 0.95
  307. }
  308. .skin-aria-ng .tooltip.tooltip-success.top .tooltip-arrow,
  309. .skin-aria-ng .tooltip.tooltip-success.top-left .tooltip-arrow,
  310. .skin-aria-ng .tooltip.tooltip-success.top-right .tooltip-arrow {
  311. border-top-color: #00a65a;
  312. }
  313. .skin-aria-ng .tooltip.tooltip-warning.top .tooltip-arrow,
  314. .skin-aria-ng .tooltip.tooltip-warning.top-left .tooltip-arrow,
  315. .skin-aria-ng .tooltip.tooltip-warning.top-right .tooltip-arrow {
  316. border-top-color: #f39c12;
  317. }
  318. .skin-aria-ng .tooltip.tooltip-error.top .tooltip-arrow,
  319. .skin-aria-ng .tooltip.tooltip-error.top-left .tooltip-arrow,
  320. .skin-aria-ng .tooltip.tooltip-error.top-right .tooltip-arrow {
  321. border-top-color: #dd4b39;
  322. }
  323. .skin-aria-ng .tooltip.tooltip-success.left .tooltip-arrow {
  324. border-left-color: #00a65a;
  325. }
  326. .skin-aria-ng .tooltip.tooltip-warning.left .tooltip-arrow {
  327. border-left-color: #f39c12;
  328. }
  329. .skin-aria-ng .tooltip.tooltip-error.left .tooltip-arrow {
  330. border-left-color: #dd4b39;
  331. }
  332. .skin-aria-ng .tooltip.tooltip-success.right .tooltip-arrow {
  333. border-right-color: #00a65a;
  334. }
  335. .skin-aria-ng .tooltip.tooltip-warning.right .tooltip-arrow {
  336. border-right-color: #f39c12;
  337. }
  338. .skin-aria-ng .tooltip.tooltip-error.right .tooltip-arrow {
  339. border-right-color: #dd4b39;
  340. }
  341. .skin-aria-ng .tooltip.tooltip-success.bottom .tooltip-arrow,
  342. .skin-aria-ng .tooltip.tooltip-success.bottom-left .tooltip-arrow,
  343. .skin-aria-ng .tooltip.tooltip-success.bottom-right .tooltip-arrow {
  344. border-bottom-color: #00a65a;
  345. }
  346. .skin-aria-ng .tooltip.tooltip-warning.bottom .tooltip-arrow,
  347. .skin-aria-ng .tooltip.tooltip-warning.bottom-left .tooltip-arrow,
  348. .skin-aria-ng .tooltip.tooltip-warning.bottom-right .tooltip-arrow {
  349. border-bottom-color: #f39c12;
  350. }
  351. .skin-aria-ng .tooltip.tooltip-error.bottom .tooltip-arrow,
  352. .skin-aria-ng .tooltip.tooltip-error.bottom-left .tooltip-arrow,
  353. .skin-aria-ng .tooltip.tooltip-error.bottom-right .tooltip-arrow {
  354. border-bottom-color: #dd4b39;
  355. }
  356. .skin-aria-ng .tooltip.tooltip-success .tooltip-inner {
  357. background-color: #00a65a;
  358. }
  359. .skin-aria-ng .tooltip.tooltip-warning .tooltip-inner {
  360. background-color: #f39c12;
  361. }
  362. .skin-aria-ng .tooltip.tooltip-error .tooltip-inner {
  363. background-color: #dd4b39;
  364. }
  365. .skin-aria-ng .input-group .form-group.has-success + .input-group-addon {
  366. border-color: #00a65a;
  367. background-color: #00a65a;
  368. color: #ffffff;
  369. }
  370. .skin-aria-ng .input-group .form-group.has-warning + .input-group-addon {
  371. border-color: #f39c12;
  372. background-color: #f39c12;
  373. color: #ffffff;
  374. }
  375. .skin-aria-ng .input-group .form-group.has-error + .input-group-addon {
  376. border-color: #dd4b39;
  377. background-color: #dd4b39;
  378. color: #ffffff;
  379. }
  380. .skin-aria-ng input::-webkit-input-placeholder,
  381. .skin-aria-ng input:-moz-placeholder,
  382. .skin-aria-ng input::-moz-placeholder,
  383. .skin-aria-ng input:-ms-input-placeholder {
  384. color: #999;
  385. }
  386. .skin-aria-ng select.placeholder {
  387. color: #999;
  388. }
  389. /* awesome-bootstrap-checkbox extend */
  390. .skin-aria-ng .checkbox-primary input[type="checkbox"]:checked + label::before,
  391. .skin-aria-ng .checkbox-primary input[type="radio"]:checked + label::before,
  392. .skin-aria-ng .checkbox-primary input[type="checkbox"]:indeterminate + label::before,
  393. .skin-aria-ng .checkbox-primary input[type="radio"]:indeterminate + label::before {
  394. background-color: #208fe5;
  395. border-color: #208fe5;
  396. }
  397. /* task-table */
  398. .skin-aria-ng .task-table {
  399. background-color: #fff;
  400. }
  401. .skin-aria-ng .task-table > .task-table-body > div.row:nth-of-type(odd) {
  402. background-color: #f9f9f9;
  403. }
  404. .skin-aria-ng .task-table > .task-table-body > div.row:hover {
  405. background-color: #f5f5f5;
  406. }
  407. .skin-aria-ng .task-table .peer-client {
  408. color: #888;
  409. font-size: 12px;
  410. }
  411. /* settings-table */
  412. .skin-aria-ng .settings-table {
  413. background-color: #fff;
  414. }
  415. .skin-aria-ng .settings-table.striped > div.row:nth-of-type(odd) {
  416. background-color: #f9f9f9;
  417. }
  418. .skin-aria-ng .settings-table.striped > div.row.no-background {
  419. background-color: inherit;
  420. }
  421. .skin-aria-ng .settings-table.hoverable > div.row:hover {
  422. background-color: #f5f5f5;
  423. }
  424. .skin-aria-ng .settings-table.hoverable > div.row.no-hover:hover {
  425. background-color: inherit;
  426. }
  427. .skin-aria-ng .settings-table.hoverable > div.row:nth-of-type(odd).no-hover:hover {
  428. background-color: #f9f9f9;
  429. }
  430. /* new-task-table */
  431. .skin-aria-ng .new-task-table {
  432. background-color: #fff;
  433. }
  434. /* misc */
  435. .skin-aria-ng .keyboard-key {
  436. border: 1px solid #aaa;
  437. background-color: #f8f8f8;
  438. box-shadow: 1px 2px 2px #ddd;
  439. }