adark.css 16 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126
  1. @charset "UTF-8";
  2. /*=== GENERAL */
  3. /*============*/
  4. html, body {
  5. background: #171717;
  6. height: 100%;
  7. color: #999;
  8. font-family: "OpenSans", "Cantarell", "Helvetica", "Arial", "PingFang SC", "Microsoft YaHei", sans-serif;
  9. }
  10. /*=== Links */
  11. a, button.as-link {
  12. color: #ccc;
  13. outline: none;
  14. }
  15. /*=== Forms */
  16. legend {
  17. margin: 20px 0 5px;
  18. padding: 5px 0;
  19. font-size: 1.4em;
  20. border-bottom: 1px solid #333;
  21. }
  22. label {
  23. min-height: 25px;
  24. padding: 5px 0;
  25. cursor: pointer;
  26. }
  27. textarea {
  28. width: 360px;
  29. height: 100px;
  30. }
  31. input, select, textarea {
  32. padding: 5px;
  33. background: #262626;
  34. color: #666;
  35. border: 1px solid #666;
  36. border-radius: 3px;
  37. min-height: 25px;
  38. line-height: 25px;
  39. vertical-align: middle;
  40. }
  41. option {
  42. padding: 0 .5em;
  43. }
  44. input:disabled, select:disabled {
  45. background: #eee;
  46. }
  47. input.extend {
  48. transition: width 200ms linear;
  49. }
  50. /*=== Tables */
  51. table {
  52. border-collapse: collapse;
  53. }
  54. tr, th, td {
  55. padding: 0.5em;
  56. border: 1px solid #ddd;
  57. }
  58. th {
  59. background: #f6f6f6;
  60. }
  61. form td,
  62. form th {
  63. font-weight: normal;
  64. text-align: center;
  65. }
  66. /*=== COMPONENTS */
  67. /*===============*/
  68. /*=== Forms */
  69. .form-group.form-actions {
  70. padding: 5px 0;
  71. background: #171717;
  72. border-top: 1px solid #333;
  73. }
  74. .form-group.form-actions .btn {
  75. margin: 0 10px;
  76. }
  77. .form-group .group-name {
  78. padding: 10px 0;
  79. text-align: right;
  80. }
  81. .form-group .group-controls {
  82. min-height: 25px;
  83. padding: 5px 0;
  84. }
  85. .form-group table {
  86. margin: 10px 0 0 220px;
  87. }
  88. /*=== Buttons */
  89. .stick {
  90. vertical-align: middle;
  91. font-size: 0;
  92. }
  93. .stick input,
  94. .stick .btn {
  95. border-radius: 0;
  96. }
  97. .stick .btn:first-child,
  98. .stick input:first-child {
  99. border-radius: 3px 0 0 3px;
  100. }
  101. .stick .btn-important:first-child {
  102. border-right: 1px solid #06f;
  103. }
  104. .stick .btn:last-child,
  105. .stick input:last-child {
  106. border-radius: 0 3px 3px 0;
  107. }
  108. .stick .btn + .btn,
  109. .stick .btn + input,
  110. .stick .btn + .dropdown > .btn,
  111. .stick input + .btn,
  112. .stick input + input,
  113. .stick input + .dropdown > .btn,
  114. .stick .dropdown + .btn,
  115. .stick .dropdown + input,
  116. .stick .dropdown + .dropdown > .btn {
  117. border-left: none;
  118. }
  119. .stick .btn + .dropdown > .btn {
  120. border-left: none;
  121. border-radius: 0 3px 3px 0;
  122. }
  123. .btn {
  124. margin: 0;
  125. padding: 5px 10px;
  126. background: #171717;
  127. display: inline-block;
  128. color: #bfbfbf;
  129. font-size: 0.9rem;
  130. border: 1px solid #777;
  131. border-right: 1px solid #777;
  132. border-bottom: 1px solid #777;
  133. border-radius: 3px;
  134. min-height: 37px;
  135. min-width: 15px;
  136. line-height: 25px;
  137. vertical-align: middle;
  138. cursor: pointer;
  139. overflow: hidden;
  140. }
  141. a.btn {
  142. min-height: 25px;
  143. line-height: 25px;
  144. }
  145. .btn:hover {
  146. background: #1d242f;
  147. text-decoration: none;
  148. color: #6b88ae;
  149. border: 1px solid #45699a;
  150. }
  151. .btn.active,
  152. .btn:active,
  153. .dropdown-target:target ~ .btn.dropdown-toggle {
  154. background: #262626;
  155. }
  156. .btn-important {
  157. background: #0062b7;
  158. color: #fff;
  159. border: 1px solid #0062b7;
  160. font-weight: normal;
  161. }
  162. .btn-important:hover {
  163. background: #0062b7;
  164. color: #eee;
  165. }
  166. .btn-important:active {
  167. background: #0044cb;
  168. box-shadow: none;
  169. }
  170. .btn-attention {
  171. color: #fff;
  172. }
  173. .btn-attention:active {
  174. background: #bd362f;
  175. box-shadow: none;
  176. }
  177. /*=== Navigation */
  178. .nav-list .nav-header,
  179. .nav-list .item {
  180. height: 2.5em;
  181. line-height: 2.5em;
  182. font-size: 0.9rem;
  183. }
  184. .nav-list .item:hover {
  185. background: #1f1f1f;
  186. }
  187. .nav-list .item.active {
  188. background: #171717;
  189. color: #fff;
  190. }
  191. .nav-list .item.active a {
  192. color: #fff;
  193. }
  194. .nav-list .disable {
  195. background: #fafafa;
  196. color: #aaa;
  197. text-align: center;
  198. }
  199. .nav-list .item > a {
  200. padding: 0 10px;
  201. }
  202. .nav-list a:hover {
  203. text-decoration: none;
  204. }
  205. .nav-list .item.empty a {
  206. color: #f39c12;
  207. }
  208. .nav-list .item.active.empty a {
  209. background: #f39c12;
  210. color: #fff;
  211. }
  212. .nav-list .item.error a {
  213. color: #bd362f;
  214. }
  215. .nav-list .item.active.error a {
  216. background: #bd362f;
  217. color: #fff;
  218. }
  219. .nav-list .nav-header {
  220. padding: 0 10px;
  221. color: #888;
  222. font-weight: bold;
  223. }
  224. .nav-list .nav-form {
  225. padding: 3px;
  226. text-align: center;
  227. }
  228. .nav-head {
  229. margin: 0;
  230. background: #fff;
  231. background: linear-gradient(to bottom, #fff, #f0f0f0);
  232. border-bottom: 1px solid #ddd;
  233. text-align: right;
  234. }
  235. .nav-head .item {
  236. padding: 5px 10px;
  237. font-size: 0.9rem;
  238. line-height: 1.5rem;
  239. }
  240. /*=== Horizontal-list */
  241. .horizontal-list {
  242. margin: 0;
  243. padding: 0;
  244. }
  245. .horizontal-list .item {
  246. vertical-align: middle;
  247. }
  248. /*=== Dropdown */
  249. .dropdown-menu {
  250. margin: 5px 0 0;
  251. padding: 5px 0;
  252. font-size: 0.8rem;
  253. border-radius: 5px;
  254. text-align: left;
  255. }
  256. .dropdown-menu::after {
  257. background: #fff;
  258. display: none;
  259. width: 10px;
  260. height: 10px;
  261. border-top: 1px solid #ddd;
  262. border-left: 1px solid #ddd;
  263. content: "";
  264. position: absolute;
  265. top: -6px;
  266. right: 13px;
  267. z-index: -10;
  268. transform: rotate(45deg);
  269. }
  270. .dropdown-header {
  271. padding: 0 5px 5px;
  272. color: #888;
  273. font-weight: bold;
  274. text-align: left;
  275. }
  276. .dropdown-menu > .item > a,
  277. .dropdown-menu > .item > span,
  278. .dropdown-menu > .item > .as-link {
  279. padding: 0 22px;
  280. line-height: 2.5em;
  281. font-size: 0.8rem;
  282. }
  283. .dropdown-menu > .item:hover {
  284. background: #262626;
  285. color: #fff;
  286. }
  287. .dropdown-menu > .item[aria-checked="true"] > a::before {
  288. font-weight: bold;
  289. margin: 0 0 0 -14px;
  290. }
  291. .dropdown-menu > .item:hover > a {
  292. color: #fff;
  293. text-decoration: none;
  294. }
  295. .dropdown-menu .input select,
  296. .dropdown-menu .input input {
  297. margin: 0 auto 5px;
  298. padding: 2px 5px;
  299. border-radius: 3px;
  300. }
  301. .separator {
  302. margin: 5px 0;
  303. border-bottom: 1px solid #292929;
  304. }
  305. /*=== Alerts */
  306. .alert {
  307. margin: 15px auto;
  308. padding: 10px 15px;
  309. background: #f4f4f4;
  310. color: #aaa;
  311. font-size: 0.9em;
  312. border: 1px solid #ccc;
  313. border-right: 1px solid #aaa;
  314. border-bottom: 1px solid #aaa;
  315. border-radius: 5px;
  316. }
  317. .alert-head {
  318. font-size: 1.15em;
  319. }
  320. .alert > a {
  321. color: inherit;
  322. text-decoration: underline;
  323. }
  324. .alert-warn {
  325. background: #171717;
  326. color: #999;
  327. border: 2px solid #615f20;
  328. }
  329. .alert-success {
  330. background: #171717;
  331. color: #999;
  332. border: 2px solid #18521d;
  333. }
  334. .alert-error {
  335. background: #171717;
  336. color: #999;
  337. border: 2px solid #902b2b;
  338. }
  339. /*=== Pagination */
  340. .pagination {
  341. background: #171717;
  342. text-align: center;
  343. color: #e8e8e8;
  344. font-size: 0.8em;
  345. }
  346. .content .pagination {
  347. margin: 0;
  348. padding: 0;
  349. }
  350. .pagination .item.pager-current {
  351. font-weight: bold;
  352. font-size: 1.5em;
  353. }
  354. .pagination .item a {
  355. display: block;
  356. color: #333;
  357. font-style: italic;
  358. line-height: 3em;
  359. text-decoration: none;
  360. }
  361. .pagination .item a:hover {
  362. background: #ddd;
  363. }
  364. .pagination:first-child .item {
  365. border-bottom: 1px solid #aaa;
  366. }
  367. .pagination:last-child .item {
  368. border-top: 1px solid #292929;
  369. }
  370. .pagination .loading,
  371. .pagination a:hover.loading {
  372. background: url("loader.gif") center center no-repeat #fff;
  373. font-size: 0;
  374. }
  375. /*=== Boxes */
  376. .box {
  377. background: #1f1f1f;
  378. border-radius: 3px;
  379. }
  380. .box .box-title {
  381. margin: 0;
  382. padding: 5px 10px;
  383. background: #f6f6f6;
  384. border: 1px solid #292929;
  385. border-radius: 5px 5px 0 0;
  386. }
  387. .box .box-content {
  388. min-height: 2.5em;
  389. max-height: 260px;
  390. }
  391. .box .box-content .item {
  392. padding: 0 10px;
  393. font-size: 0.9rem;
  394. line-height: 2.5em;
  395. }
  396. .box .box-title .configure,
  397. .box .box-content .item .configure {
  398. visibility: hidden;
  399. }
  400. .box .box-title:hover .configure,
  401. .box .box-content .item:hover .configure {
  402. visibility: visible;
  403. }
  404. /*=== Tree */
  405. .tree {
  406. margin: 10px 0;
  407. }
  408. .tree-folder-title {
  409. position: relative;
  410. padding: 0 10px;
  411. background: #262626;
  412. line-height: 2.5rem;
  413. font-size: 1rem;
  414. }
  415. .tree-folder-title:hover {
  416. background: #1f1f1f;
  417. }
  418. .tree-folder-title .title {
  419. background: inherit;
  420. color: #999;
  421. }
  422. .tree-folder-title .title:hover {
  423. text-decoration: none;
  424. }
  425. .tree-folder.active .tree-folder-title {
  426. background: #171717;
  427. font-weight: bold;
  428. }
  429. .tree-folder.active .tree-folder-title .title {
  430. color: #ccc;
  431. }
  432. .tree-folder-items {
  433. background: #262626;
  434. }
  435. .tree-folder-items:hover {
  436. background: #1f1f1f;
  437. }
  438. .tree-folder-items > .item {
  439. padding: 0 10px;
  440. line-height: 2.5rem;
  441. font-size: 0.8rem;
  442. }
  443. .tree-folder-items > .item.active {
  444. background: #171717;
  445. }
  446. .tree-folder-items > .item > a {
  447. text-decoration: none;
  448. }
  449. .tree-folder-items > .item.active > a {
  450. color: #999;
  451. }
  452. /*=== STRUCTURE */
  453. /*===============*/
  454. /*=== Header */
  455. .header {
  456. background: #171717;
  457. height: 85px;
  458. }
  459. .header > .item {
  460. padding: 10px;
  461. border-bottom: 1px solid #333;
  462. vertical-align: middle;
  463. text-align: center;
  464. }
  465. .header > .item.title {
  466. width: 230px;
  467. }
  468. .header > .item.title h1 {
  469. margin: 0.5em 0;
  470. }
  471. .header > .item.title h1 a {
  472. text-decoration: none;
  473. }
  474. .header > .item.search input {
  475. width: 230px;
  476. }
  477. .header .item.search input:focus {
  478. width: 350px;
  479. }
  480. /*=== Body */
  481. #global {
  482. height: calc(100% - 85px);
  483. }
  484. .aside {
  485. background: #262626;
  486. }
  487. .aside.aside_feed {
  488. padding: 10px 0;
  489. text-align: center;
  490. background: #262626;
  491. }
  492. .aside.aside_feed .tree {
  493. margin: 10px 0 50px;
  494. }
  495. /*=== Aside main page (categories) */
  496. .aside_feed .category .title:not([data-unread="0"])::after {
  497. margin: 10px 0;
  498. padding: 0 10px;
  499. background: inherit;
  500. font-size: 0.9rem;
  501. position: absolute;
  502. right: 0;
  503. line-height: 1.5rem;
  504. }
  505. /*=== Aside main page (feeds) */
  506. .feed.item.empty.active {
  507. background: #e67e22;
  508. }
  509. .feed.item.error.active {
  510. background: #bd362f;
  511. }
  512. .feed.item.empty,
  513. .feed.item.empty > a {
  514. color: #e67e22;
  515. }
  516. .feed.item.error,
  517. .feed.item.error > a {
  518. color: #bd362f;
  519. }
  520. .feed.item.empty.active,
  521. .feed.item.error.active,
  522. .feed.item.empty.active > a,
  523. .feed.item.error.active > a {
  524. color: #fff;
  525. }
  526. .aside_feed .tree-folder-items .dropdown-menu::after {
  527. left: 2px;
  528. }
  529. .aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon,
  530. .aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon {
  531. background-color: #fff;
  532. border-radius: 3px;
  533. }
  534. /*=== Configuration pages */
  535. .post {
  536. padding: 10px 50px;
  537. font-size: 0.9em;
  538. }
  539. .post form {
  540. margin: 10px 0;
  541. }
  542. .post.content {
  543. max-width: 550px;
  544. }
  545. /*=== Prompt (centered) */
  546. .prompt {
  547. text-align: center;
  548. }
  549. .prompt label {
  550. text-align: left;
  551. }
  552. .prompt form {
  553. margin: 10px auto 20px auto;
  554. width: 200px;
  555. }
  556. .prompt input {
  557. margin: 5px auto;
  558. width: 100%;
  559. }
  560. .prompt p {
  561. margin: 20px 0;
  562. }
  563. /*=== New article notification */
  564. #new-article {
  565. background: #0084cc;
  566. text-align: center;
  567. font-size: 0.9em;
  568. }
  569. #new-article:hover {
  570. background: #06c;
  571. }
  572. #new-article > a {
  573. line-height: 3em;
  574. color: #fff;
  575. font-weight: bold;
  576. }
  577. #new-article > a:hover {
  578. text-decoration: none;
  579. }
  580. /*=== Day indication */
  581. .day {
  582. padding: 0 10px;
  583. font-weight: bold;
  584. line-height: 3em;
  585. background: #171717;
  586. color: #ccc;
  587. border-top: 1px solid #aaa;
  588. }
  589. #new-article + .day {
  590. border-top: none;
  591. }
  592. .day .name {
  593. padding: 0 10px 0 0;
  594. color: #ccc;
  595. font-size: 1.8em;
  596. opacity: 0.3;
  597. text-shadow: 0px -1px 0px #666;
  598. font-style: italic;
  599. text-align: right;
  600. }
  601. /*=== Index menu */
  602. .nav_menu {
  603. padding: 5px 0;
  604. background: #171717;
  605. text-align: center;
  606. }
  607. /*=== Feed articles */
  608. .flux {
  609. background: #171717;
  610. border-left: 1px solid #292929;
  611. }
  612. .flux:hover {
  613. background: #333!important;
  614. }
  615. .flux.current {
  616. background: #191919;
  617. border-left: 2px solid #0062be;
  618. }
  619. .flux.current.active {
  620. background: #333;
  621. }
  622. .flux.not_read {
  623. border-left: 2px solid #e74c3c;
  624. }
  625. .flux.not_read:not(.current) {
  626. background: #171717;
  627. }
  628. .flux.not_read:not(.current):hover .item.title {
  629. background: inherit;
  630. }
  631. .flux.favorite {
  632. border-left: 2px solid #ffc300;
  633. }
  634. .flux.favorite:not(.current) {
  635. background: #171717;
  636. }
  637. .flux_header {
  638. font-size: 0.8rem;
  639. border-top: 1px solid #292929;
  640. cursor: pointer;
  641. }
  642. .flux_header .title {
  643. font-size: 0.9rem;
  644. }
  645. .flux .website .favicon {
  646. padding: 5px;
  647. }
  648. .flux .date {
  649. color: #ababab;
  650. font-size: 0.7rem;
  651. }
  652. .flux .bottom {
  653. font-size: 0.8rem;
  654. text-align: center;
  655. }
  656. /*=== Content of feed articles */
  657. .content {
  658. padding: 20px 10px;
  659. color: #999;
  660. }
  661. .content > h1.title > a {
  662. color: #949494;
  663. }
  664. .content hr {
  665. margin: 30px 10px;
  666. background: #ddd;
  667. height: 1px;
  668. border: 0;
  669. box-shadow: 0 2px 5px #ccc;
  670. }
  671. .content pre {
  672. margin: 10px auto;
  673. padding: 10px 20px;
  674. overflow: auto;
  675. background: #222;
  676. color: #fff;
  677. font-size: 0.9rem;
  678. border-radius: 3px;
  679. }
  680. .content code {
  681. padding: 2px 5px;
  682. background: #262626;
  683. border: 1px solid #262626;
  684. border-radius: 3px;
  685. }
  686. .content pre code {
  687. background: transparent;
  688. color: #fff;
  689. border: none;
  690. }
  691. .content blockquote {
  692. margin: 0;
  693. padding: 25px;
  694. background: #262626;
  695. display: block;
  696. color: #999;
  697. }
  698. .content blockquote p {
  699. margin: 0;
  700. }
  701. /*=== Notification and actualize notification */
  702. .notification {
  703. padding: 0 0 0 5px;
  704. font-size: 0.9em;
  705. border: 1px solid #eeb;
  706. border-radius: 3px;
  707. text-align: center;
  708. font-weight: bold;
  709. line-height: 3em;
  710. z-index: 10;
  711. vertical-align: middle;
  712. }
  713. .notification.good {
  714. background: #262626;
  715. color: #999;
  716. border: 2px solid #3b5981;
  717. }
  718. .notification.bad {
  719. background: #fdd;
  720. color: #844;
  721. border: 1px solid #ecc;
  722. }
  723. .notification a.close {
  724. padding: 0 15px;
  725. line-height: 3em;
  726. }
  727. .notification.bad a.close:hover {
  728. background: #ecc;
  729. }
  730. .notification#actualizeProgress {
  731. line-height: 2em;
  732. }
  733. /*=== "Load more" part */
  734. #bigMarkAsRead {
  735. background: #171717;
  736. color: #0062be;
  737. text-align: center;
  738. text-decoration: none;
  739. }
  740. /*=== Navigation menu (for articles) */
  741. #nav_entries {
  742. margin: 0;
  743. background: #262626;
  744. text-align: center;
  745. line-height: 3em;
  746. table-layout: fixed;
  747. }
  748. /*=== READER VIEW */
  749. /*================*/
  750. #stream.reader .flux {
  751. padding: 0 0 50px;
  752. color: #333;
  753. border-bottom: 10px solid #171717;
  754. }
  755. #stream.reader .flux.current.active {
  756. background: #333;
  757. }
  758. #stream.reader .flux .author {
  759. margin: 0 0 10px;
  760. color: #666;
  761. font-size: 90%;
  762. }
  763. /*=== GLOBAL VIEW */
  764. /*================*/
  765. .box.category .box-title .title {
  766. font-weight: normal;
  767. text-decoration: none;
  768. text-align: left;
  769. }
  770. .box.category:not([data-unread="0"]) .box-title {
  771. background: #262626;
  772. }
  773. .box.category:not([data-unread="0"]) .box-title:active {
  774. background: #171717;
  775. }
  776. .box.category:not([data-unread="0"]) .box-title .title {
  777. color: #999;
  778. font-weight: bold;
  779. }
  780. .box.category .title:not([data-unread="0"])::after {
  781. background: none;
  782. color: #fff;
  783. border: 0;
  784. box-shadow: none;
  785. position: absolute;
  786. top: 5px; right: 10px;
  787. font-weight: bold;
  788. text-shadow: none;
  789. }
  790. .box.category .item.feed {
  791. padding: 2px 10px;
  792. font-size: 0.8rem;
  793. }
  794. /*=== DIVERS */
  795. /*===========*/
  796. .aside.aside_feed .nav-form input,
  797. .aside.aside_feed .nav-form select {
  798. width: 140px;
  799. }
  800. .aside.aside_feed .nav-form .dropdown .dropdown-menu {
  801. right: -20px;
  802. }
  803. .aside.aside_feed .nav-form .dropdown .dropdown-menu::after {
  804. right: 33px;
  805. }
  806. /*=== STATISTICS */
  807. /*===============*/
  808. .stat {
  809. margin: 10px 0 20px;
  810. }
  811. .stat th,
  812. .stat td,
  813. .stat tr {
  814. border: none;
  815. }
  816. .stat > table td,
  817. .stat > table th {
  818. border-bottom: 1px solid #ddd;
  819. }
  820. .stat > .horizontal-list {
  821. margin: 0 0 5px;
  822. }
  823. .stat > .horizontal-list .item {
  824. overflow: hidden;
  825. white-space: nowrap;
  826. text-overflow: ellipsis;
  827. }
  828. .stat > .horizontal-list .item:first-child {
  829. width: 270px;
  830. }
  831. /*=== LOGS */
  832. /*=========*/
  833. .loglist {
  834. border: 1px solid #aaa;
  835. border-radius: 5px;
  836. overflow: hidden;
  837. }
  838. .log {
  839. padding: 5px 10px;
  840. background: #fafafa;
  841. color: #333;
  842. font-size: 0.8rem;
  843. }
  844. .log+.log {
  845. border-top: 1px solid #aaa;
  846. }
  847. .log .date {
  848. display: block;
  849. font-weight: bold;
  850. }
  851. .log.error {
  852. background: #fdd;
  853. color: #844;
  854. }
  855. .log.warning {
  856. background: #ffe;
  857. color: #c95;
  858. }
  859. .log.notice {
  860. background: #f4f4f4;
  861. color: #aaa;
  862. }
  863. .log.debug {
  864. background: #333;
  865. color: #eee;
  866. }
  867. /*=== MOBILE */
  868. /*===========*/
  869. @media (max-width: 840px) {
  870. .aside {
  871. box-shadow: 3px 0 3px #aaa;
  872. transition: width 200ms linear;
  873. }
  874. .aside .toggle_aside,
  875. #panel .close {
  876. background: #f6f6f6;
  877. display: block;
  878. width: 100%;
  879. height: 50px;
  880. border-bottom: 1px solid #ddd;
  881. line-height: 50px;
  882. text-align: center;
  883. }
  884. .aside.aside_feed {
  885. padding: 0;
  886. }
  887. .nav_menu .btn {
  888. margin: 5px 10px;
  889. }
  890. .nav_menu .stick {
  891. margin: 0 10px;
  892. }
  893. .nav_menu .stick .btn {
  894. margin: 5px 0;
  895. }
  896. .nav_menu .search {
  897. display: inline-block;
  898. max-width: 97%;
  899. }
  900. .nav_menu .search input {
  901. max-width: 97%;
  902. width: 90px;
  903. }
  904. .nav_menu .search input:focus {
  905. width: 400px;
  906. }
  907. .day .name {
  908. display: none!important;
  909. font-size: 1.1rem;
  910. text-shadow: none;
  911. }
  912. .pagination {
  913. margin: 0 0 3.5em;
  914. border-top: 1px solid #292929;
  915. }
  916. .notification a.close {
  917. background: transparent;
  918. display: block;
  919. left: 0;
  920. }
  921. .notification a.close:hover {
  922. opacity: 0.5;
  923. }
  924. .notification a.close .icon {
  925. display: none;
  926. }
  927. }