pafat.rtl.css 16 KB

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