pafat.css 18 KB

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