ansum.css 33 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295
  1. @font-face {
  2. font-family: "lato";
  3. font-style: normal;
  4. font-stretch: normal;
  5. font-weight: 400;
  6. src: local("Lato"), url("../fonts/LatoLatin-Regular.woff") format("woff"); }
  7. @font-face {
  8. font-family: "lato";
  9. font-style: italic;
  10. font-stretch: normal;
  11. font-weight: 400;
  12. src: local("Lato"), url("../fonts/LatoLatin-Italic.woff") format("woff"); }
  13. @font-face {
  14. font-family: "lato";
  15. font-style: normal;
  16. font-stretch: normal;
  17. font-weight: 700;
  18. src: local("Lato"), url("../fonts/LatoLatin-Bold.woff") format("woff"); }
  19. @font-face {
  20. font-family: "lato";
  21. font-style: italic;
  22. font-stretch: normal;
  23. font-weight: 700;
  24. src: local("Lato"), url("../fonts/LatoLatin-BoldItalic.woff") format("woff"); }
  25. @font-face {
  26. font-family: "spectral";
  27. font-style: normal;
  28. font-stretch: normal;
  29. font-weight: 400;
  30. src: local("Spectral"), url("../fonts/Spectral-Regular.woff") format("woff"); }
  31. @font-face {
  32. font-family: "spectral";
  33. font-style: italic;
  34. font-stretch: normal;
  35. font-weight: 400;
  36. src: local("Spectral"), url("../fonts/Spectral-Italic.woff") format("woff"); }
  37. @font-face {
  38. font-family: "spectral";
  39. font-style: normal;
  40. font-stretch: normal;
  41. font-weight: 700;
  42. src: local("Spectral"), url("../fonts/Spectral-Bold.woff") format("woff"); }
  43. @font-face {
  44. font-family: "spectral";
  45. font-style: italic;
  46. font-stretch: normal;
  47. font-weight: 700;
  48. src: local("Spectral"), url("../fonts/Spectral-BoldItalic.woff") format("woff"); }
  49. /* stylelint-disable property-no-vendor-prefix */
  50. /* FUNCTIONS */
  51. /* btns */
  52. .btn {
  53. margin: 0;
  54. padding: 0.5rem 1.5rem;
  55. background: #fcfaf8;
  56. display: inline-block;
  57. color: #766556;
  58. font-size: 1rem;
  59. border: none;
  60. border-radius: 5px;
  61. min-height: 38px;
  62. min-width: 15px;
  63. line-height: 25px;
  64. vertical-align: middle;
  65. cursor: pointer;
  66. overflow: hidden;
  67. -webkit-transition: all 0.15s ease-in-out;
  68. -moz-transition: all 0.15s ease-in-out;
  69. -o-transition: all 0.15s ease-in-out;
  70. transition: all 0.15s ease-in-out; }
  71. .btn.btn-important {
  72. background: #ca7227;
  73. color: #fff; }
  74. .btn.btn-important:hover, .btn.btn-important:active {
  75. background: #b7641d; }
  76. .btn.btn-attention {
  77. background: #f5633e;
  78. color: #fff; }
  79. .btn.btn-attention:hover, .btn.btn-attention:active {
  80. background: #73341f; }
  81. .btn:hover {
  82. text-decoration: none; }
  83. a.btn {
  84. min-height: 25px;
  85. line-height: 25px; }
  86. /*=== Forms */
  87. legend {
  88. margin: 2rem 0 1rem 0;
  89. padding: 0;
  90. display: inline-block;
  91. width: auto;
  92. font-size: 1rem;
  93. clear: both;
  94. text-transform: uppercase;
  95. letter-spacing: 1px;
  96. font-weight: 700; }
  97. label {
  98. min-height: 25px;
  99. padding: 5px 0;
  100. cursor: pointer;
  101. color: #766556; }
  102. textarea {
  103. width: 360px;
  104. height: 100px; }
  105. input, select, textarea, button {
  106. padding: 5px 10px;
  107. background: #fff;
  108. color: #766556;
  109. font-family: "lato", "Helvetica", "Arial", sans-serif;
  110. font-size: 1rem;
  111. border: 1px solid #f5f0ec;
  112. border-radius: 2px;
  113. min-height: 25px;
  114. line-height: 25px;
  115. vertical-align: middle; }
  116. option {
  117. padding: 0 .5em; }
  118. input:focus, select:focus, textarea:focus {
  119. color: #363330;
  120. border-color: #ca7227; }
  121. input:invalid, select:invalid {
  122. color: #f5633e;
  123. border-color: #f5633e;
  124. box-shadow: none; }
  125. input:disabled, select:disabled {
  126. background: #f5f0ec; }
  127. input.extend {
  128. transition: width 200ms linear; }
  129. .form-group {
  130. padding: 5px;
  131. border-radius: 3px; }
  132. .form-group::after {
  133. content: "";
  134. display: block;
  135. clear: both; }
  136. .form-group .group-name {
  137. padding: 10px 0;
  138. text-align: right; }
  139. .form-group .group-controls {
  140. min-height: 25px;
  141. padding: 5px 0; }
  142. .form-group .group-controls .control {
  143. line-height: 2.0em; }
  144. .form-group table {
  145. margin: 10px 0 0 220px; }
  146. .form-group.form-actions {
  147. margin: 15px 0 25px;
  148. padding: 5px 0; }
  149. .form-group.form-actions .btn {
  150. margin: 0 0.5rem 0 0; }
  151. /*=== Tables */
  152. table {
  153. border-collapse: collapse; }
  154. tr, th, td {
  155. padding: 0.5em;
  156. border: 1px solid #e4d8cc; }
  157. th {
  158. background: #fcfaf8; }
  159. form td,
  160. form th {
  161. font-weight: normal;
  162. text-align: center; }
  163. /*=== COMPONENTS */
  164. /*===============*/
  165. /*=== Forms */
  166. /*=== Horizontal-list */
  167. .horizontal-list {
  168. margin: 0;
  169. padding: 0.1rem 0; }
  170. .horizontal-list .item {
  171. vertical-align: middle; }
  172. .horizontal-list .item:first-child {
  173. padding-left: 0.5rem; }
  174. /*=== Dropdown */
  175. .dropdown-menu {
  176. margin: 0;
  177. padding: 0.5rem 0 1rem 0;
  178. background: #fcfaf8;
  179. font-size: 1rem;
  180. border: none;
  181. border-radius: 3px;
  182. box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, 0.35);
  183. text-align: left; }
  184. .dropdown-menu::after {
  185. background: white;
  186. width: 10px;
  187. height: 10px;
  188. content: "";
  189. position: absolute;
  190. top: -4px;
  191. right: 13px;
  192. z-index: -10;
  193. transform: rotate(45deg); }
  194. .dropdown-menu .dropdown-header {
  195. margin: 1.75rem 0 0.5rem 2rem;
  196. font-weight: bold;
  197. text-align: left;
  198. color: #766556;
  199. text-transform: uppercase;
  200. letter-spacing: 1px; }
  201. .dropdown-menu .item {
  202. -webkit-transition: all 0.075s ease-in-out;
  203. -moz-transition: all 0.075s ease-in-out;
  204. -o-transition: all 0.075s ease-in-out;
  205. transition: all 0.075s ease-in-out; }
  206. .dropdown-menu .item a, .dropdown-menu .item span, .dropdown-menu .item .as-link {
  207. padding: 0 2rem;
  208. color: #363330;
  209. font-size: 1rem;
  210. line-height: 2.5em; }
  211. .dropdown-menu .item:hover {
  212. background: #ca7227;
  213. color: #fff; }
  214. .dropdown-menu .item:hover a, .dropdown-menu .item:hover button {
  215. text-decoration: none;
  216. color: #fff; }
  217. .dropdown-menu .item[aria-checked="true"] a::before {
  218. margin: 0 0 0 -14px;
  219. font-weight: bold; }
  220. .dropdown-menu .input select, .dropdown-menu .input input {
  221. margin: 0 auto 5px;
  222. padding: 2px 5px;
  223. border-radius: 3px; }
  224. .dropdown-menu .separator {
  225. margin: 0.75rem 0;
  226. border-bottom: 1px solid #f5f0ec; }
  227. .tree .tree-folder .tree-folder-items .dropdown-menu .item {
  228. padding: 0; }
  229. .tree .tree-folder .tree-folder-items .dropdown-menu .item a,
  230. .tree .tree-folder .tree-folder-items .dropdown-menu .item button {
  231. color: #363330; }
  232. .tree .tree-folder .tree-folder-items .dropdown-menu .item a:hover,
  233. .tree .tree-folder .tree-folder-items .dropdown-menu .item button:hover {
  234. color: #fff; }
  235. .tree .tree-folder .tree-folder-items .dropdown-menu .item:hover {
  236. background: #ca7227; }
  237. /*=== Alerts */
  238. .alert {
  239. margin: 1rem 0;
  240. padding: 1rem;
  241. background: #fcfaf8;
  242. color: #766556;
  243. font-size: 1rem;
  244. border: 1px solid #d9ccbf;
  245. border-radius: 3px;
  246. text-shadow: 0 0 1px #f5f0ec; }
  247. .alert-head {
  248. font-size: 1.15em; }
  249. .alert > a {
  250. text-decoration: underline;
  251. color: inherit; }
  252. .alert-warn {
  253. background: #fdfde0;
  254. color: #73762f;
  255. border: 1px solid #73762f33; }
  256. .alert-success {
  257. background: #cffdef;
  258. color: #0c7556;
  259. border: 1px solid #0c755633; }
  260. .alert-error {
  261. background: #fde0d8;
  262. color: #73341f;
  263. border: 1px solid #73341f33; }
  264. /*=== Pagination */
  265. .pagination {
  266. background: #f5f0ec;
  267. color: #363330;
  268. font-size: 0.8em;
  269. text-align: center; }
  270. .pagination .item.pager-current {
  271. background: #fbf9f6;
  272. color: #f5f0ec;
  273. font-size: 1.5em;
  274. font-weight: bold; }
  275. .pagination .item a {
  276. display: block;
  277. color: #363330;
  278. font-style: italic;
  279. line-height: 3em;
  280. text-decoration: none; }
  281. .pagination .item a:hover {
  282. background: #363330;
  283. color: #f5f0ec; }
  284. .pagination .loading,
  285. .pagination a:hover.loading {
  286. background: url("loader.gif") center center no-repeat #34495e;
  287. font-size: 0; }
  288. .content .pagination {
  289. margin: 0;
  290. padding: 0; }
  291. /*=== Boxes */
  292. .box {
  293. background: #fff;
  294. border: none;
  295. border-radius: 3px;
  296. box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25); }
  297. .box .box-title {
  298. margin: 0;
  299. padding: 0.5rem 0.75rem;
  300. background: #f5f0ec;
  301. color: #363330;
  302. border-radius: 2px 2px 0 0; }
  303. .box .box-title img {
  304. margin-right: 0.75rem; }
  305. .box .box-title:hover .configure {
  306. background: url("icons/cog.svg") no-repeat 4px 4px;
  307. display: block;
  308. float: left;
  309. width: 1.75rem;
  310. height: 1.75rem;
  311. border-radius: 2px;
  312. visibility: visible;
  313. margin-right: 0.5rem; }
  314. .box .box-title:hover .configure .icon {
  315. display: none;
  316. border-radius: 3px;
  317. vertical-align: middle; }
  318. .box .box-title:hover .configure:hover {
  319. background: url("icons/cog-white.svg") no-repeat 4px 4px #ca7227; }
  320. .box .box-title .configure {
  321. visibility: hidden; }
  322. .box .box-title form input {
  323. width: 85%; }
  324. .box .box-title form .dropdown {
  325. float: right; }
  326. .box .box-title form .dropdown a.dropdown-toggle {
  327. padding: 0;
  328. border-radius: 0;
  329. background-image: url(icons/more.svg);
  330. background-repeat: no-repeat;
  331. background-position: right 8px; }
  332. .box .box-title form .dropdown a.dropdown-toggle img {
  333. display: none; }
  334. .box .box-content .item {
  335. padding: 0.5rem 0.75rem;
  336. color: #363330;
  337. font-size: 1rem;
  338. border-bottom: 1px solid #f5f0ec;
  339. line-height: 1.7em; }
  340. .box .box-content .item img {
  341. margin-right: 0.75rem; }
  342. .box .box-content .item .configure {
  343. background: url("icons/cog.svg") no-repeat 4px 4px;
  344. display: block;
  345. float: left;
  346. width: 1.75rem;
  347. height: 1.75rem;
  348. border-radius: 2px;
  349. visibility: hidden;
  350. margin-right: 0.5rem; }
  351. .box .box-content .item .configure .icon {
  352. display: none;
  353. border-radius: 3px;
  354. vertical-align: middle; }
  355. .box .box-content .item .configure:hover {
  356. background: url("icons/cog-white.svg") no-repeat 4px 4px #ca7227; }
  357. .box .box-content .item:hover .configure {
  358. visibility: visible; }
  359. .box .box-content .item:last-child {
  360. border-bottom: none; }
  361. /*=== "Load more" part */
  362. #bigMarkAsRead {
  363. text-align: center;
  364. text-decoration: none;
  365. background: #fdf6ef;
  366. color: #ca7227;
  367. -webkit-transition: all 0.15s ease-in-out;
  368. -moz-transition: all 0.15s ease-in-out;
  369. -o-transition: all 0.15s ease-in-out;
  370. transition: all 0.15s ease-in-out; }
  371. #bigMarkAsRead:hover {
  372. background: #ca7227;
  373. color: #fff; }
  374. #bigMarkAsRead:hover .bigTick {
  375. background: url(icons/tick-white.svg) center no-repeat; }
  376. #bigMarkAsRead .bigTick {
  377. margin: 0.5rem 0;
  378. background: url(icons/tick-color.svg) center no-repeat;
  379. display: inline-block;
  380. width: 64px;
  381. height: 64px;
  382. text-indent: -9999px;
  383. white-space: nowrap; }
  384. .formLogin {
  385. background: #fbf9f6; }
  386. .formLogin .header .configure {
  387. padding-right: 1rem; }
  388. .formLogin .header .configure img {
  389. margin-right: 0.5rem; }
  390. .formLogin .header .configure a.signin {
  391. color: #fff; }
  392. .formLogin h1 {
  393. color: #fff; }
  394. .formLogin form#crypto-form div {
  395. margin-bottom: 1rem; }
  396. .formLogin form#crypto-form div label {
  397. color: #d9ccbf;
  398. font-size: 1rem; }
  399. .formLogin form#crypto-form div input {
  400. background: #221f1d; }
  401. .formLogin form#crypto-form div input:focus {
  402. background: #fcfaf8;
  403. color: #363330; }
  404. /*=== DIVERS */
  405. /*===========*/
  406. .aside.aside_feed .nav-form input,
  407. .aside.aside_feed .nav-form select {
  408. width: 140px; }
  409. .aside.aside_feed .nav-form .dropdown .dropdown-menu {
  410. right: -20px; }
  411. .aside.aside_feed .nav-form .dropdown .dropdown-menu::after {
  412. right: 33px; }
  413. /*=== Tree */
  414. .tree {
  415. margin: 10px 0; }
  416. .tree#sidebar {
  417. scrollbar-color: rgba(255, 255, 0, 0.1) rgba(0, 0, 0, 0.05);
  418. scrollbar-color: #36333033 #36333022; }
  419. .tree .tree-folder {
  420. border-bottom: 1px solid #f0e7da;
  421. box-shadow: inset -1px -11px 8px #0003; }
  422. .tree .tree-folder .tree-folder-title {
  423. padding: 12px 16px;
  424. background: #fbf9f6;
  425. position: relative;
  426. font-size: 0.85rem;
  427. letter-spacing: 1px;
  428. font-weight: 700;
  429. text-transform: uppercase; }
  430. .tree .tree-folder .tree-folder-title .title {
  431. background: inherit;
  432. color: #363330; }
  433. .tree .tree-folder .tree-folder-title .title:hover {
  434. text-decoration: none; }
  435. .tree .tree-folder.active .tree-folder-title {
  436. background: #fbf9f6;
  437. font-weight: bold; }
  438. .tree .tree-folder .tree-folder-items {
  439. background: #f7f2ea; }
  440. .tree .tree-folder .tree-folder-items .item {
  441. padding: 0 1rem;
  442. line-height: 2.5rem;
  443. font-size: 1rem;
  444. font-weight: 400;
  445. -webkit-transition: all 0.15s ease-in-out;
  446. -moz-transition: all 0.15s ease-in-out;
  447. -o-transition: all 0.15s ease-in-out;
  448. transition: all 0.15s ease-in-out; }
  449. .tree .tree-folder .tree-folder-items .item.active {
  450. background: #ca7227; }
  451. .tree .tree-folder .tree-folder-items .item.active .dropdown li a {
  452. color: #363330; }
  453. .tree .tree-folder .tree-folder-items .item.active .dropdown li a:hover {
  454. color: #363330; }
  455. .tree .tree-folder .tree-folder-items .item.active a {
  456. color: #fff; }
  457. .tree .tree-folder .tree-folder-items .item:hover {
  458. background: #efe3d3; }
  459. .tree .tree-folder .tree-folder-items .item a {
  460. text-decoration: none;
  461. color: #363330; }
  462. .tree .tree-folder .tree-folder-items .feed .item-title:not([data-unread="0"])::before {
  463. margin: 11px 6px 0 4px;
  464. padding: 3px 4px;
  465. background: rgba(35, 35, 0, 0.15);
  466. display: block;
  467. float: left;
  468. font-size: 0.75rem;
  469. border-radius: 12px;
  470. content: attr(data-unread);
  471. text-align: center;
  472. line-height: 0.75rem; }
  473. /*=== Buttons */
  474. .stick {
  475. vertical-align: middle;
  476. font-size: 0; }
  477. .stick input, .stick .btn {
  478. border-radius: 0; }
  479. .stick .btn:first-child,
  480. .stick input:first-child {
  481. border-radius: 5px 0 0 5px; }
  482. .stick .btn:last-child, .stick input:last-child, .stick .btn + .dropdown > .btn {
  483. border-radius: 0 5px 5px 0; }
  484. .stick .btn + .btn,
  485. .stick .btn + input,
  486. .stick .btn + .dropdown > .btn,
  487. .stick input + .btn,
  488. .stick input + input,
  489. .stick input + .dropdown > .btn,
  490. .stick .dropdown + .btn,
  491. .stick .dropdown + input,
  492. .stick .dropdown + .dropdown > .btn {
  493. border-left: 1px solid #e4d8cc; }
  494. .aside {
  495. background: #fbf9f6; }
  496. .aside.aside_feed {
  497. padding: 10px 0;
  498. text-align: center;
  499. background: #fbf9f6;
  500. border-right: 1px solid #f0e7da; }
  501. .aside.aside_feed .tree {
  502. margin: 10px 0 50px; }
  503. /* Sidebar des pages de configuration */
  504. /*=== Navigation */
  505. .nav-list .nav-header,
  506. .nav-list .item {
  507. height: 2.5em;
  508. line-height: 2.5em;
  509. font-size: 1rem; }
  510. .nav-list .item {
  511. background: #fbf9f6;
  512. -webkit-transition: all 0.15s ease-in-out;
  513. -moz-transition: all 0.15s ease-in-out;
  514. -o-transition: all 0.15s ease-in-out;
  515. transition: all 0.15s ease-in-out; }
  516. .nav-list .item a {
  517. padding: 0 1rem;
  518. color: #363330; }
  519. .nav-list .item .error a {
  520. color: #f5633e; }
  521. .nav-list .item:hover {
  522. background: #efe3d3;
  523. color: #363330; }
  524. .nav-list .item:hover .error a {
  525. background: #ca7227;
  526. color: #363330; }
  527. .nav-list .item:hover .empty a {
  528. background: #f4f762;
  529. color: #363330; }
  530. .nav-list .item:hover a {
  531. color: #363330;
  532. text-decoration: none; }
  533. .nav-list .item.active {
  534. background: #ca7227;
  535. color: #fff; }
  536. .nav-list .item.active .error a {
  537. background: #ca7227;
  538. color: #fff; }
  539. .nav-list .item.active .empty a {
  540. background: #f4f762;
  541. color: #fff; }
  542. .nav-list .item.active a {
  543. color: #fff;
  544. text-decoration: none; }
  545. .nav-list.empty a {
  546. color: #f4f762; }
  547. .nav-list .disable {
  548. text-align: center;
  549. background: #fcfaf8;
  550. color: #ba9; }
  551. .nav-list .nav-header {
  552. padding: 0 10px;
  553. font-weight: bold;
  554. color: #766556;
  555. text-transform: uppercase;
  556. letter-spacing: 1px;
  557. margin-top: 1rem; }
  558. .nav-list .nav-form {
  559. padding: 3px;
  560. text-align: center; }
  561. .nav-list .nav-head {
  562. margin: 0;
  563. text-align: right;
  564. color: #fff; }
  565. .nav-list .nav-head a {
  566. color: #fff; }
  567. .nav-list .nav-head .item {
  568. padding: 5px 10px;
  569. font-size: 0.9rem;
  570. line-height: 1.5rem; }
  571. /*=== Aside main page (categories) */
  572. .aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
  573. margin: -0.5rem 1rem 0 0;
  574. padding: 0 0.75rem;
  575. background: rgba(35, 35, 0, 0.15);
  576. border-radius: 12px;
  577. position: absolute;
  578. right: 0;
  579. line-height: 1.5rem;
  580. text-align: center; }
  581. .feed.item.empty.active {
  582. background: #766556; }
  583. .feed.item.error.active {
  584. background: #766556; }
  585. .feed.item.empty,
  586. .feed.item.empty > a {
  587. color: #766556; }
  588. .feed.item.error,
  589. .feed.item.error > a {
  590. color: #766556; }
  591. .feed.item.empty.active,
  592. .feed.item.error.active,
  593. .feed.item.empty.active > a,
  594. .feed.item.error.active > a {
  595. color: #fff; }
  596. .aside_feed .tree-folder-items .dropdown-menu::after {
  597. left: 2px; }
  598. .aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon,
  599. .aside_feed .tree-folder-items .item:hover .dropdown-toggle > .icon,
  600. .aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon {
  601. border-radius: 3px; }
  602. .aside_feed .stick #btn-importExport {
  603. border-left-color: #fbf9f6; }
  604. /*=== STRUCTURE */
  605. /*===============*/
  606. /*=== Header */
  607. .header {
  608. padding: 0.5rem 1.35rem;
  609. background: #fbf9f6;
  610. display: block;
  611. width: auto;
  612. table-layout: none; }
  613. .header .item {
  614. vertical-align: middle; }
  615. .header .item.title {
  616. width: 280px;
  617. font-weight: 400; }
  618. .header .item.title h1 a {
  619. text-decoration: none;
  620. color: #363330;
  621. font-size: 1rem;
  622. text-transform: uppercase;
  623. letter-spacing: 1px; }
  624. .header .item.title h1 a img {
  625. margin-right: 0.5rem; }
  626. .header .item.search input {
  627. width: 230px;
  628. color: #363330;
  629. border: none;
  630. border-radius: 2px 0 0 2px;
  631. background-color: #f7f2ea;
  632. -webkit-transition: all 0.15s ease-in-out;
  633. -moz-transition: all 0.15s ease-in-out;
  634. -o-transition: all 0.15s ease-in-out;
  635. transition: all 0.15s ease-in-out; }
  636. .header .item.search input:hover {
  637. background-color: #efe3d3; }
  638. .header .item.search input:focus {
  639. width: 350px;
  640. color: #766556;
  641. background-color: #fff; }
  642. .header .item.search .btn {
  643. width: 3rem;
  644. border-radius: 0 2px 2px 0;
  645. background-color: #ca7227;
  646. background-position: center;
  647. background-repeat: no-repeat;
  648. background-image: url(icons/magnifier.svg);
  649. border-left-width: 0;
  650. min-height: 35px; }
  651. .header .item.search .btn img {
  652. display: none; }
  653. .header .item.search .btn:hover {
  654. background-color: #b7641d; }
  655. .header .item.configure {
  656. width: 2rem;
  657. position: absolute;
  658. right: 1rem;
  659. top: 1.25rem;
  660. text-align: center; }
  661. .header .item.configure .btn {
  662. padding: 0 0.5rem;
  663. background-color: transparent;
  664. background-position: center;
  665. background-repeat: no-repeat;
  666. background-image: url(icons/cog.svg); }
  667. .header .item.configure .btn img {
  668. display: none; }
  669. /*=== Body */
  670. #global {
  671. height: calc(100% - 85px); }
  672. /*=== Prompt (centered) */
  673. .prompt {
  674. text-align: center; }
  675. .prompt label {
  676. text-align: left; }
  677. .prompt form {
  678. margin: 10px auto 20px auto;
  679. width: 200px; }
  680. .prompt input {
  681. margin: 5px auto;
  682. width: 100%; }
  683. .prompt p {
  684. margin: 20px 0; }
  685. /*=== New article notification */
  686. #new-article {
  687. background: #ca7227;
  688. font-size: 1rem;
  689. text-align: center; }
  690. #new-article:hover {
  691. background: #b7641d; }
  692. #new-article > a {
  693. line-height: 3em;
  694. font-weight: bold;
  695. color: #fff; }
  696. #new-article > a:hover {
  697. text-decoration: none; }
  698. /*=== Day indication */
  699. .day {
  700. padding: 1rem 0 0 1.25rem;
  701. color: #6d655f;
  702. font-size: 0.875rem;
  703. font-weight: 700;
  704. line-height: 3em;
  705. letter-spacing: 1px;
  706. text-transform: uppercase; }
  707. .day .name {
  708. padding: 0 1rem 0 1rem;
  709. color: #363330;
  710. font-size: 0.875rem;
  711. position: relative;
  712. left: 0;
  713. text-transform: uppercase; }
  714. /*=== Index menu */
  715. .nav_menu {
  716. text-align: center;
  717. padding: 5px 0; }
  718. .nav_menu .btn {
  719. border-left-width: 0;
  720. padding: 0.5rem 1rem;
  721. background-color: #fcfaf8;
  722. background-position: center;
  723. background-repeat: no-repeat; }
  724. .nav_menu .btn:hover {
  725. background-color: #f5f0ec; }
  726. .nav_menu .stick {
  727. background: #fcfaf8; }
  728. .nav_menu .stick .btn {
  729. border-left-width: 0;
  730. padding: 0.5rem 1rem;
  731. background-color: #fcfaf8;
  732. background-position: center;
  733. background-repeat: no-repeat;
  734. -webkit-transition: all 0.15s ease-in-out;
  735. -moz-transition: all 0.15s ease-in-out;
  736. -o-transition: all 0.15s ease-in-out;
  737. transition: all 0.15s ease-in-out; }
  738. .nav_menu .stick .btn:hover {
  739. background-color: #e4d8cc; }
  740. .nav_menu .stick .btn.active {
  741. background-color: #ca7227; }
  742. .nav_menu .stick .btn img.icon {
  743. display: none; }
  744. .nav_menu .stick .btn#toggle-read {
  745. background-image: url(icons/read.svg); }
  746. .nav_menu .stick .btn#toggle-read.active {
  747. background-image: url(icons/read-white.svg); }
  748. .nav_menu .stick .btn#toggle-unread {
  749. background-image: url(icons/unread.svg); }
  750. .nav_menu .stick .btn#toggle-unread.active {
  751. background-image: url(icons/unread-white.svg); }
  752. .nav_menu .stick .btn#toggle-starred {
  753. background-image: url(icons/starred.svg); }
  754. .nav_menu .stick .btn#toggle-starred.active {
  755. background-image: url(icons/starred-white.svg); }
  756. .nav_menu .stick .btn#toggle-non-starred {
  757. background-image: url(icons/non-starred.svg); }
  758. .nav_menu .stick .btn#toggle-non-starred.active {
  759. background-image: url(icons/non-starred-white.svg); }
  760. .nav_menu .stick .btn.read_all {
  761. padding: 5px 16px;
  762. color: #363330;
  763. background-color: #fcfaf8;
  764. -webkit-transition: all 0.15s ease-in-out;
  765. -moz-transition: all 0.15s ease-in-out;
  766. -o-transition: all 0.15s ease-in-out;
  767. transition: all 0.15s ease-in-out; }
  768. .nav_menu .stick .btn.read_all:hover {
  769. background-color: #e4d8cc; }
  770. .nav_menu .stick .btn.view-normal {
  771. background-image: url(icons/view-list.svg); }
  772. .nav_menu .stick .btn.view-normal.active {
  773. background-image: url(icons/view-list-white.svg); }
  774. .nav_menu .stick .btn.view-global {
  775. background-image: url(icons/view-global.svg); }
  776. .nav_menu .stick .btn.view-global.active {
  777. background-image: url(icons/view-global-white.svg); }
  778. .nav_menu .stick .btn.view-reader {
  779. background-image: url(icons/view-reader.svg); }
  780. .nav_menu .stick .btn.view-reader.active {
  781. background-image: url(icons/view-reader-white.svg); }
  782. .nav_menu .stick .btn.view-rss {
  783. background-image: url(icons/rss.svg); }
  784. .nav_menu .stick .dropdown a.dropdown-toggle {
  785. border-left-width: 0;
  786. background-image: url(icons/more.svg); }
  787. #dropdown-query ~ .dropdown-menu .dropdown-header .icon {
  788. vertical-align: middle;
  789. background-color: #ba9;
  790. border-radius: 3px; }
  791. /*=== Content of feed articles */
  792. .content, .content.thin {
  793. padding: 20px 10px;
  794. font-size: 1.125rem;
  795. line-height: 1.8rem; }
  796. .content h1.title a, .content h1 a, .content.thin h1.title a, .content.thin h1 a {
  797. color: #363330;
  798. font-family: "spectral", serif;
  799. font-size: 2rem; }
  800. .content h1.title a:hover, .content h1 a:hover, .content.thin h1.title a:hover, .content.thin h1 a:hover {
  801. color: #ca7227;
  802. text-decoration: none; }
  803. .content .author, .content.thin .author {
  804. color: #6d655f;
  805. font-size: 1.125rem; }
  806. .content p, .content ul, .content.thin p, .content.thin ul {
  807. font-size: 1.125rem;
  808. line-height: 1.8rem; }
  809. .content .content hr, .content.thin .content hr {
  810. margin: 30px 10px;
  811. background: #e4d8cc;
  812. height: 1px;
  813. border: 0;
  814. box-shadow: 0 2px 5px #ccc; }
  815. .content pre, .content.thin pre {
  816. margin: 10px auto;
  817. padding: 10px 20px;
  818. overflow: auto;
  819. background: #221f1d;
  820. color: #fff;
  821. font-size: 0.9rem;
  822. border-radius: 3px; }
  823. .content pre code, .content.thin pre code {
  824. background: transparent;
  825. color: #fff;
  826. border: none; }
  827. .content code, .content.thin code {
  828. padding: 2px 5px;
  829. background: #fcfaf8;
  830. color: #f5f0ec;
  831. border: 1px solid #f5f0ec;
  832. border-radius: 3px; }
  833. .content blockquote, .content.thin blockquote {
  834. margin: 0;
  835. padding: 5px 20px;
  836. background: #fcfaf8;
  837. display: block;
  838. color: #363330;
  839. border-top: 1px solid #e4d8cc;
  840. border-bottom: 1px solid #e4d8cc; }
  841. .content blockquote p, .content.thin blockquote p {
  842. margin: 0; }
  843. /*=== Notification and actualize notification */
  844. .notification {
  845. padding: 1rem 0;
  846. background: #e4d8cc;
  847. width: 100%;
  848. height: 3rem;
  849. color: #766556;
  850. font-size: 1em;
  851. border: none;
  852. position: fixed;
  853. top: auto;
  854. bottom: 0;
  855. left: 0;
  856. right: 0;
  857. text-align: center;
  858. line-height: 3em;
  859. z-index: 10;
  860. vertical-align: middle; }
  861. .notification .msg {
  862. display: inline-block;
  863. font-size: 1rem; }
  864. .notification.good {
  865. background: #10f5b2;
  866. color: #fff; }
  867. .notification.bad {
  868. background: #f5633e;
  869. color: #fff; }
  870. .notification a.close {
  871. padding: 0 15px;
  872. border-radius: 0 3px 3px 0;
  873. line-height: 3em; }
  874. .notification.good a.close:hover {
  875. background: #0c7556; }
  876. .notification.bad a.close:hover {
  877. background: #73341f; }
  878. .notification#actualizeProgress {
  879. line-height: 2em; }
  880. .notification#actualizeProgress br {
  881. display: none; }
  882. /*=== Navigation menu (for articles) */
  883. #nav_entries {
  884. margin: 0;
  885. text-align: center;
  886. line-height: 3em;
  887. table-layout: fixed;
  888. background: #fbf9f6; }
  889. /*=== Feed articles */
  890. .flux {
  891. background: #fff;
  892. -webkit-transition: all 0.15s ease-in-out;
  893. -moz-transition: all 0.15s ease-in-out;
  894. -o-transition: all 0.15s ease-in-out;
  895. transition: all 0.15s ease-in-out; }
  896. .flux:hover {
  897. background: #fcfaf8; }
  898. .flux:hover:not(.current):hover .item.title {
  899. background: #fcfaf8; }
  900. .flux.current {
  901. background: #fff;
  902. border-left-color: #ca7227; }
  903. .flux.not_read:not(.current) {
  904. background: #f2f6f8; }
  905. .flux.not_read:not(.current):hover .item.title {
  906. background: #f2f6f8; }
  907. .flux.not_read .item.title a {
  908. color: #161a38; }
  909. .flux.not_read .item.website a {
  910. color: #161a38; }
  911. .flux.not_read .item.date {
  912. color: #161a3899; }
  913. .flux.favorite {
  914. border-left-color: #ffc300;
  915. -webkit-transition: all 0.15s ease-in-out;
  916. -moz-transition: all 0.15s ease-in-out;
  917. -o-transition: all 0.15s ease-in-out;
  918. transition: all 0.15s ease-in-out; }
  919. .flux.favorite:not(.current) {
  920. background: #fff6da; }
  921. .flux.favorite:not(.current):hover .item.title {
  922. background: #fff6da; }
  923. .flux .website a {
  924. color: #363330;
  925. opacity: 0.75; }
  926. .flux .website .favicon {
  927. padding: 5px; }
  928. .flux .date {
  929. color: #363330;
  930. font-size: 0.85rem;
  931. opacity: 0.75; }
  932. .flux .bottom {
  933. font-size: 1rem;
  934. text-align: center; }
  935. .flux_header {
  936. font-size: 1rem;
  937. cursor: pointer;
  938. border-top: 1px solid #f5f0ec; }
  939. .flux_header .title {
  940. font-size: 1rem; }
  941. /*=== GLOBAL VIEW */
  942. /*================*/
  943. #stream .box.category:not([data-unread="0"]) .box-title .title {
  944. font-weight: bold; }
  945. #stream .box.category .box-title {
  946. padding: 1.5rem;
  947. background: none; }
  948. #stream .box.category .box-title a.title {
  949. color: #766556;
  950. font-size: 1rem;
  951. font-weight: normal;
  952. text-decoration: none;
  953. text-align: left;
  954. text-transform: uppercase;
  955. letter-spacing: 1px; }
  956. #stream .box.category .box-title a.title:not([data-unread="0"])::after {
  957. margin: -0.5rem 1rem 0 0;
  958. padding: 0 0.75rem;
  959. background: #f5f0ec;
  960. border-radius: 12px;
  961. position: absolute;
  962. top: 1.75rem;
  963. right: 0;
  964. line-height: 1.5rem;
  965. text-align: center; }
  966. #stream .box.category .box-title a.title:hover {
  967. color: #ca7227; }
  968. #stream .box.category .box-content {
  969. padding-bottom: 0.5rem; }
  970. #stream .box.category .box-content .item.feed {
  971. padding: 0.5rem 1.5rem;
  972. font-size: 1rem; }
  973. #stream .box.category .box-content .item.feed a {
  974. color: #363330;
  975. font-weight: 400; }
  976. #stream .box.category .box-content .item.feed a:hover {
  977. color: #ca7227;
  978. text-decoration: none; }
  979. #overlay {
  980. background: rgba(0, 0, 0, 0.65); }
  981. #panel {
  982. top: 3rem;
  983. right: 3rem;
  984. bottom: 3rem;
  985. left: 3rem;
  986. border-radius: 3px; }
  987. /*=== READER VIEW */
  988. /*================*/
  989. #stream.reader .flux {
  990. padding: 0 0 50px;
  991. background: #f5f0ec;
  992. color: #363330;
  993. border: none; }
  994. #stream.reader .flux .author {
  995. margin: 0 0 10px;
  996. color: #ba9;
  997. font-size: 90%; }
  998. /*=== Configuration pages */
  999. .post {
  1000. padding: 1rem 2rem;
  1001. font-size: 1rem; }
  1002. .post form {
  1003. margin: 1rem 0; }
  1004. .post form .horizontal-list {
  1005. margin-bottom: 0.5rem; }
  1006. .post.content {
  1007. max-width: 550px; }
  1008. .post h1, .post h2 {
  1009. color: #363330;
  1010. font-size: 3rem;
  1011. margin-top: 1.75rem;
  1012. font-weight: 300;
  1013. line-height: 1.2em; }
  1014. .post a[href="./"] {
  1015. margin: 0;
  1016. padding: 0.75rem 1.5rem;
  1017. background: #fcfaf8;
  1018. display: inline-block;
  1019. color: #766556;
  1020. font-size: 1rem;
  1021. border: 1px solid #e4d8cc;
  1022. border-radius: 5px;
  1023. min-width: 15px;
  1024. line-height: 25px;
  1025. vertical-align: middle;
  1026. cursor: pointer;
  1027. overflow: hidden; }
  1028. .post a[href="./"]:hover {
  1029. background: #ca7227;
  1030. color: white;
  1031. border: 1px solid #ca7227;
  1032. text-decoration: none; }
  1033. #slider {
  1034. border-left: none;
  1035. box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, 0.35); }
  1036. .slide-container .properties {
  1037. padding: 1rem;
  1038. background: rgba(0, 0, 0, 0.75);
  1039. color: white;
  1040. border: 0; }
  1041. .slide-container .properties .page-number {
  1042. right: 1rem;
  1043. top: 1rem; }
  1044. /*=== LOGS */
  1045. /*=========*/
  1046. .loglist {
  1047. overflow: hidden;
  1048. border: 1px solid #ba9; }
  1049. .log {
  1050. margin: 10px 0;
  1051. padding: 5px 2%;
  1052. background: #fcfaf8;
  1053. color: #766556;
  1054. font-size: 0.8rem;
  1055. overflow: auto; }
  1056. .log > .date {
  1057. margin: 0 10px 0 0;
  1058. padding: 5px 10px;
  1059. border-radius: 20px; }
  1060. .log.error > .date {
  1061. background: #f5633e;
  1062. color: #fff; }
  1063. .log.warning > .date {
  1064. background: #f4f762; }
  1065. .log.notice > .date {
  1066. background: #f5f0ec; }
  1067. .log.debug > .date {
  1068. background: #221f1d;
  1069. color: #fff; }
  1070. /*=== STATISTICS */
  1071. /*===============*/
  1072. .stat {
  1073. margin: 10px 0 20px; }
  1074. .stat th,
  1075. .stat td,
  1076. .stat tr {
  1077. border: none; }
  1078. .stat > table td,
  1079. .stat > table th {
  1080. border-bottom: 1px solid #e4d8cc; }
  1081. .stat > .horizontal-list {
  1082. margin: 0 0 5px; }
  1083. .stat > .horizontal-list .item {
  1084. overflow: hidden;
  1085. white-space: nowrap;
  1086. text-overflow: ellipsis; }
  1087. .stat > .horizontal-list .item:first-child {
  1088. width: 270px; }
  1089. /*=== MOBILE */
  1090. /*===========*/
  1091. @media (max-width: 840px) {
  1092. ul.nav .item {
  1093. width: 100%; }
  1094. ul.nav .item img {
  1095. display: none; }
  1096. ul.nav .item a {
  1097. padding: 1rem 1rem 1rem 2.5rem;
  1098. background: url("../../themes/icons/logout.svg") no-repeat #efe3d3 3% center;
  1099. display: inline-block;
  1100. width: 100%;
  1101. color: #363330;
  1102. -webkit-transition: all 0.2s ease-in-out;
  1103. -moz-transition: all 0.2s ease-in-out;
  1104. -o-transition: all 0.2s ease-in-out;
  1105. transition: all 0.2s ease-in-out; }
  1106. ul.nav .item a:hover, ul.nav .item a:active {
  1107. background: url("../../themes/icons/logout.svg") no-repeat #f5633e 3% center;
  1108. text-decoration: none;
  1109. color: #fff; }
  1110. .aside {
  1111. -webkit-transition: all 0.2s ease-in-out;
  1112. -moz-transition: all 0.2s ease-in-out;
  1113. -o-transition: all 0.2s ease-in-out;
  1114. transition: all 0.2s ease-in-out; }
  1115. .aside.aside_feed {
  1116. padding: 0; }
  1117. .aside .tree .tree-folder .tree-folder-items .item a {
  1118. padding: 0.5rem 1rem; }
  1119. .aside .toggle_aside,
  1120. #panel .close {
  1121. background: #b7641d;
  1122. display: block;
  1123. width: 100%;
  1124. height: 50px;
  1125. line-height: 50px;
  1126. text-align: center; }
  1127. .header {
  1128. padding: 0.5rem; }
  1129. .header .item.title {
  1130. display: none; }
  1131. .header .item.search input {
  1132. width: 90%;
  1133. height: 3.5rem; }
  1134. .header .item.search input:focus {
  1135. width: 100%; }
  1136. .header .item.search .btn {
  1137. min-height: 49px;
  1138. padding: 0.5rem 2rem; }
  1139. .header .item.configure {
  1140. width: 2.75rem;
  1141. top: 3.125rem; }
  1142. .header .item.configure .dropdown .btn {
  1143. padding: 1.125rem; }
  1144. .nav_menu .btn {
  1145. margin: 0;
  1146. padding: 0.85rem 1.25rem; }
  1147. .nav_menu .stick {
  1148. margin: 0.5rem 0.5rem; }
  1149. .nav_menu .stick .btn {
  1150. margin: 0;
  1151. padding: 0.85rem 1.25rem; }
  1152. .nav_menu .stick .btn.read_all {
  1153. padding: 0.85rem 1.25rem; }
  1154. .nav_menu .search {
  1155. display: none;
  1156. max-width: 97%; }
  1157. .nav_menu .search .input {
  1158. max-width: 97%;
  1159. width: 90px; }
  1160. .nav_menu .search .input:focus {
  1161. width: 400px; }
  1162. #stream .flux .flux_header {
  1163. padding: 0.5rem 0; }
  1164. .day {
  1165. text-align: center;
  1166. padding: 1rem 0; }
  1167. .day .name {
  1168. padding: 0;
  1169. display: block;
  1170. width: 100%;
  1171. line-height: 1.5rem;
  1172. margin-bottom: 1rem; }
  1173. .pagination {
  1174. margin: 0 0 3.5em; }
  1175. #nav_entries {
  1176. line-height: 4.5rem; }
  1177. .notification {
  1178. border-radius: 0; }
  1179. .notification a.close {
  1180. background: transparent;
  1181. display: block;
  1182. left: 0; }
  1183. .notification a.close:hover {
  1184. opacity: 0.5; }
  1185. .notification a.close .icon {
  1186. display: none; } }
  1187. /*=== GENERAL */
  1188. /*============*/
  1189. html, body {
  1190. background: #f5f0ec;
  1191. height: 100%;
  1192. font-family: "lato", "Helvetica", "Arial", sans-serif;
  1193. font-size: 0.875rem; }
  1194. /*=== Links */
  1195. a, button.as-link {
  1196. outline: none;
  1197. color: #ca7227; }
  1198. /*# sourceMappingURL=ansum.css.map */