pafat.css 18 KB

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