summaryrefslogtreecommitdiff
path: root/default/_ikiwiki.scss
blob: 0187d3e5a2fa8aead3546a9c9c1f41462ca8870f (plain)
  1. @mixin ikiwiki-boilerplate {
  2. /* ikiwiki style sheet */
  3. /* Note that instead of modifying this style sheet, you can instead edit
  4. * local.css and use it to override or change settings in this one.
  5. */
  6. }
  7. @mixin ikiwiki-reset {
  8. /* html5 compat */
  9. article,
  10. header,
  11. footer,
  12. nav {
  13. display: block;
  14. }
  15. }
  16. @mixin ikiwiki-header {
  17. .header {
  18. margin: 0;
  19. font-size: 140%;
  20. font-weight: bold;
  21. line-height: 1em;
  22. display: block;
  23. }
  24. }
  25. @mixin ikiwiki-inlineheader {
  26. .inlineheader .author {
  27. margin: 0;
  28. font-size: 112%;
  29. font-weight: bold;
  30. display: block;
  31. }
  32. }
  33. @mixin ikiwiki-actions {
  34. .actions ul {
  35. margin: 0;
  36. padding: 6px .4em;
  37. height: 1em;
  38. list-style-type: none;
  39. }
  40. .actions li {
  41. display: inline;
  42. padding: .2em;
  43. }
  44. .pageheader .actions ul {
  45. border-bottom: 1px solid #000;
  46. }
  47. .inlinepage .actions ul {
  48. border-bottom: 0;
  49. }
  50. }
  51. @mixin ikiwiki-plugin-po {
  52. #otherlanguages ul {
  53. margin: 0;
  54. padding: 6px;
  55. list-style-type: none;
  56. }
  57. #otherlanguages li {
  58. display: inline;
  59. padding: .2em .4em;
  60. }
  61. .pageheader #otherlanguages {
  62. border-bottom: 1px solid #000;
  63. }
  64. }
  65. @mixin ikiwiki-inlinecontent {
  66. .inlinecontent {
  67. margin-top: .4em;
  68. }
  69. }
  70. @mixin ikiwiki-footer {
  71. .pagefooter,
  72. .inlinefooter,
  73. .comments {
  74. clear: both;
  75. }
  76. }
  77. @mixin ikiwiki-pageinfo {
  78. #pageinfo {
  79. margin: 1em 0;
  80. border-top: 1px solid #000;
  81. }
  82. }
  83. @mixin ikiwiki-tags {
  84. .tags {
  85. margin-top: 1em;
  86. }
  87. .inlinepage .tags {
  88. display: inline;
  89. }
  90. }
  91. @mixin ikiwiki-plugin-map {
  92. .mapparent {
  93. text-decoration: none;
  94. }
  95. }
  96. @mixin ikiwiki-plugin-img {
  97. .img caption {
  98. font-size: 80%;
  99. caption-side: bottom;
  100. text-align: center;
  101. }
  102. img.img {
  103. margin: 0.5ex;
  104. }
  105. }
  106. @mixin ikiwiki-alignment {
  107. .align-left {
  108. float: left;
  109. }
  110. .align-right {
  111. float: right;
  112. }
  113. }
  114. @mixin ikiwiki-backlinks {
  115. #backlinks {
  116. margin-top: 1em;
  117. }
  118. }
  119. @mixin ikiwiki-plugin-search {
  120. #searchform {
  121. display: inline;
  122. float: right;
  123. }
  124. }
  125. @mixin ikiwiki-plugin-editpage {
  126. #editcontent {
  127. width: 98%;
  128. }
  129. .editcontentdiv {
  130. width: auto;
  131. overflow: auto;
  132. }
  133. }
  134. @mixin ikiwiki-images {
  135. img {
  136. border-style: none;
  137. }
  138. }
  139. @mixin ikiwiki-pre {
  140. pre {
  141. overflow: auto;
  142. }
  143. }
  144. @mixin ikiwiki-plugin-recentchanges {
  145. div.recentchanges {
  146. border-style: solid;
  147. border-width: 1px;
  148. overflow: auto;
  149. width: auto;
  150. clear: none;
  151. background: #eee;
  152. color: black !important;
  153. }
  154. .recentchanges .metadata {
  155. padding: 0px 0.5em;
  156. }
  157. .recentchanges .changelog {
  158. font-style: italic;
  159. clear: both;
  160. display: block;
  161. padding: 1px 2px;
  162. background: white !important;
  163. color: black !important;
  164. }
  165. .recentchanges .desc {
  166. display: none;
  167. }
  168. .recentchanges .diff {
  169. display: none;
  170. }
  171. .recentchanges .committer {
  172. float: left;
  173. margin: 0;
  174. width: 40%;
  175. }
  176. .recentchanges .committype {
  177. float: left;
  178. margin: 0;
  179. width: 5%;
  180. font-size: small;
  181. }
  182. .recentchanges .changedate {
  183. float: left;
  184. margin: 0;
  185. width: 35%;
  186. font-size: small;
  187. }
  188. .recentchanges .pagelinks,
  189. .recentchanges .revert {
  190. float: right;
  191. margin: 0;
  192. width: 60%;
  193. }
  194. }
  195. @mixin ikiwiki-blogform {
  196. .blogform,
  197. #blogform {
  198. padding: 10px 10px;
  199. border: 1px solid #aaa;
  200. background: #eee;
  201. color: black !important;
  202. width: auto;
  203. overflow: auto;
  204. }
  205. }
  206. @mixin ikiwiki-inlinepage {
  207. .inlinepage {
  208. padding: 10px 10px;
  209. border: 1px solid #aaa;
  210. overflow: auto;
  211. }
  212. }
  213. @mixin ikiwiki-authorship {
  214. .pagedate,
  215. .pagelicense,
  216. .pagecopyright {
  217. font-style: italic;
  218. display: block;
  219. margin-top: 1em;
  220. }
  221. }
  222. @mixin ikiwiki-debug {
  223. .error {
  224. color: #C00;
  225. }
  226. }
  227. @mixin ikiwiki-plugin-sidebar {
  228. .sidebar {
  229. width: 20ex;
  230. float: right;
  231. margin-left: 4px;
  232. margin-bottom: 4px;
  233. margin-top: -1px;
  234. padding: 0ex 2ex;
  235. background: white;
  236. border: 1px solid black;
  237. color: black !important;
  238. }
  239. }
  240. @mixin ikiwiki-plugin-poll {
  241. hr.poll {
  242. height: 10pt;
  243. color: white !important;
  244. background: #eee;
  245. border: 2px solid black;
  246. }
  247. div.poll {
  248. margin-top: 1ex;
  249. margin-bottom: 1ex;
  250. padding: 1ex 1ex;
  251. border: 1px solid #aaa;
  252. }
  253. }
  254. @mixin ikiwiki-plugin-color {
  255. span.color {
  256. padding: 2px;
  257. }
  258. }
  259. @mixin ikiwiki-plugin-comments {
  260. .comment-header,
  261. .microblog-header {
  262. font-style: italic;
  263. margin-top: .3em;
  264. }
  265. .comment .author,
  266. .microblog .author {
  267. font-weight: bold;
  268. }
  269. .comment-subject {
  270. font-weight: bold;
  271. }
  272. .comment-avatar {
  273. float: right;
  274. }
  275. .comment {
  276. border: 1px solid #aaa;
  277. padding: 3px;
  278. }
  279. }
  280. @mixin ikiwiki-plugin-progress {
  281. div.progress {
  282. margin-top: 1ex;
  283. margin-bottom: 1ex;
  284. border: 1px solid #888;
  285. width: 400px;
  286. background: #eee;
  287. color: black !important;
  288. padding: 1px;
  289. }
  290. div.progress-done {
  291. background: #ea6 !important;
  292. color: black !important;
  293. text-align: center;
  294. padding: 1px;
  295. }
  296. }
  297. @mixin ikiwiki-site-print {
  298. /* things to hide in printouts */
  299. @media print {
  300. .actions {
  301. display: none;
  302. }
  303. .tags {
  304. display: none;
  305. }
  306. .trails {
  307. display: none;
  308. }
  309. .feedbutton {
  310. display: none;
  311. }
  312. #searchform {
  313. display: none;
  314. }
  315. .blogform,
  316. #blogform {
  317. display: none;
  318. }
  319. #backlinks {
  320. display: none;
  321. }
  322. }
  323. }
  324. @mixin ikiwiki-infobox {
  325. /* infobox template */
  326. .infobox {
  327. float: right;
  328. margin-left: 2ex;
  329. margin-top: 1ex;
  330. margin-bottom: 1ex;
  331. padding: 1ex 1ex;
  332. border: 1px solid #aaa;
  333. background: white;
  334. color: black !important;
  335. }
  336. }
  337. @mixin ikiwiki-notebook {
  338. /* notebox template */
  339. .notebox {
  340. float: right;
  341. margin-left: 2ex;
  342. margin-top: 1ex;
  343. margin-bottom: 1ex;
  344. padding: 1ex 1ex;
  345. border: 1px solid #aaa;
  346. width: 25%;
  347. background: white;
  348. color: black !important;
  349. }
  350. }
  351. @mixin ikiwiki-popup {
  352. /* popup template and backlinks hiding */
  353. .popup {
  354. border-bottom: 1px dotted #366;
  355. color: #366;
  356. }
  357. .popup .balloon,
  358. .popup .paren,
  359. .popup .expand {
  360. display: none;
  361. }
  362. .popup:hover .balloon,
  363. .popup:focus .balloon {
  364. position: absolute;
  365. display: inline;
  366. margin: 1em 0 0 -2em;
  367. padding: 0.625em;
  368. border: 2px solid;
  369. background-color: #dee;
  370. color: black;
  371. }
  372. }
  373. @mixin ikiwiki-forms {
  374. /* form styling */
  375. fieldset {
  376. margin: 1ex 0;
  377. border: 1px solid black;
  378. }
  379. legend {
  380. padding: 0 1ex;
  381. }
  382. .fb_submit {
  383. float: left;
  384. margin: 2px 0;
  385. }
  386. label.block {
  387. display: block;
  388. }
  389. label.inline {
  390. display: inline;
  391. }
  392. input#openid_identifier {
  393. background: url(wikiicons/openidlogin-bg.gif) no-repeat;
  394. background-color: #fff;
  395. background-position: 0 50%;
  396. color: #000;
  397. padding-left: 18px;
  398. }
  399. input#searchbox {
  400. background: url(wikiicons/search-bg.gif) no-repeat;
  401. background-color: #fff;
  402. background-position: 100% 50%;
  403. color: #000;
  404. padding-right: 16px;
  405. }
  406. /* invalid form fields */
  407. .fb_invalid {
  408. color: red;
  409. background: white !important;
  410. }
  411. /* required form fields */
  412. .fb_required {
  413. font-weight: bold;
  414. }
  415. }
  416. @mixin ikiwiki-plugin-highlight {
  417. /* highlight plugin */
  418. pre.hl {
  419. color: #000000;
  420. background-color: #ffffff;
  421. }
  422. .hl.num {
  423. color: #2928ff;
  424. }
  425. .hl.esc {
  426. color: #ff00ff;
  427. }
  428. .hl.str {
  429. color: #ff0000;
  430. }
  431. .hl.dstr {
  432. color: #818100;
  433. }
  434. .hl.slc {
  435. color: #838183;
  436. font-style: italic;
  437. }
  438. .hl.com {
  439. color: #838183;
  440. font-style: italic;
  441. }
  442. .hl.dir {
  443. color: #008200;
  444. }
  445. .hl.sym {
  446. color: #000000;
  447. }
  448. .hl.line {
  449. color: #555555;
  450. }
  451. .hl.mark {
  452. background-color: #ffffbb;
  453. }
  454. .hl.kwa {
  455. color: #000000;
  456. font-weight: bold;
  457. }
  458. .hl.kwb {
  459. color: #830000;
  460. }
  461. .hl.kwc {
  462. color: #000000;
  463. font-weight: bold;
  464. }
  465. .hl.kwd {
  466. color: #010181;
  467. }
  468. }
  469. @mixin ikiwiki-plugin-calendar {
  470. /* calendar plugin */
  471. .month-calendar-day-this-day,
  472. .year-calendar-this-month {
  473. background-color: #eee;
  474. }
  475. .month-calendar-day-head,
  476. .month-calendar-day-nolink,
  477. .month-calendar-day-link,
  478. .month-calendar-day-this-day,
  479. .month-calendar-day-future {
  480. text-align: right;
  481. }
  482. .month-calendar-arrow A:link,
  483. .year-calendar-arrow A:link,
  484. .month-calendar-arrow A:visited,
  485. .year-calendar-arrow A:visited {
  486. text-decoration: none;
  487. font-weight: normal;
  488. font-size: 150%;
  489. }
  490. }
  491. @mixin ikiwiki-lists {
  492. /* outlines */
  493. li.L1 {
  494. list-style: upper-roman;
  495. }
  496. li.L2 {
  497. list-style: decimal;
  498. }
  499. li.L3 {
  500. list-style: lower-alpha;
  501. }
  502. li.L4 {
  503. list-style: disc;
  504. }
  505. li.L5 {
  506. list-style: square;
  507. }
  508. li.L6 {
  509. list-style: circle;
  510. }
  511. li.L7 {
  512. list-style: lower-roman;
  513. }
  514. li.L8 {
  515. list-style: upper-alpha;
  516. }
  517. }
  518. @mixin ikiwiki-plugin-pagestats {
  519. /* tag cloud */
  520. .pagecloud {
  521. float: right;
  522. width: 30%;
  523. text-align: center;
  524. padding: 10px 10px;
  525. border: 1px solid #aaa;
  526. background: #eee;
  527. color: black !important;
  528. }
  529. .smallestPC {
  530. font-size: 70%;
  531. }
  532. .smallPC {
  533. font-size: 85%;
  534. }
  535. .normalPC {
  536. font-size: 100%;
  537. }
  538. .bigPC {
  539. font-size: 115%;
  540. }
  541. .biggestPC {
  542. font-size: 130%;
  543. }
  544. }
  545. @mixin ikiwiki-feedbutton {
  546. /* orange feed button */
  547. .feedbutton {
  548. background: #ff6600;
  549. color: white !important;
  550. border-left: 1px solid #cc9966;
  551. border-top: 1px solid #ccaa99;
  552. border-right: 1px solid #993300;
  553. border-bottom: 1px solid #331100;
  554. padding: 0px 0.5em 0px 0.5em;
  555. font-family: sans-serif;
  556. font-weight: bold;
  557. font-size: small;
  558. text-decoration: none;
  559. margin-top: 1em;
  560. }
  561. .feedbutton:hover {
  562. color: white !important;
  563. background: #ff9900;
  564. }
  565. }
  566. @mixin ikiwiki-plugin-flattr {
  567. .FlattrButton {
  568. display: none;
  569. }
  570. }
  571. @mixin ikiwiki-plugin-openid {
  572. /* openid selector */
  573. #openid_choice {
  574. display: none;
  575. }
  576. #openid_input_area {
  577. clear: both;
  578. padding: 10px;
  579. }
  580. #openid_btns,
  581. #openid_btns br {
  582. clear: both;
  583. }
  584. #openid_highlight {
  585. background-color: black;
  586. float: left;
  587. }
  588. .openid_large_btn {
  589. padding: 1em 1.5em;
  590. border: 1px solid #DDD;
  591. margin: 3px;
  592. float: left;
  593. }
  594. .openid_small_btn {
  595. padding: 4px 4px;
  596. border: 1px solid #DDD;
  597. margin: 3px;
  598. float: left;
  599. }
  600. a.openid_large_btn:focus {
  601. outline: none;
  602. }
  603. a.openid_large_btn:focus {
  604. outline-style: none;
  605. }
  606. .openid_selected {
  607. border: 4px solid #DDD;
  608. }
  609. }
  610. @mixin ikiwiki-plugin-attachment {
  611. .fileupload-content .ui-progressbar {
  612. width: 200px;
  613. height: 20px;
  614. }
  615. .fileupload-content .ui-progressbar-value {
  616. background: url(ikiwiki/images/pbar-ani.gif);
  617. }
  618. @mixin ikiwiki-plugin-trail {
  619. .trails {
  620. margin-top: 1em;
  621. margin-bottom: 1em;
  622. }
  623. .trail {
  624. display: block;
  625. clear: both;
  626. position: relative;
  627. }
  628. .trailprev {
  629. display: block;
  630. text-align: left;
  631. position: absolute;
  632. top: 0%;
  633. left: 3%;
  634. width: 30%;
  635. }
  636. .trailup {
  637. display: block;
  638. text-align: center;
  639. margin-left: 35%;
  640. margin-right: 35%;
  641. }
  642. .trailnext {
  643. display: block;
  644. text-align: right;
  645. position: absolute;
  646. top: 0%;
  647. width: 30%;
  648. right: 3%;
  649. }
  650. .trailsep {
  651. display: none;
  652. }
  653. }
  654. // all styles in same order as original Ikiwiki stylesheet
  655. @mixin ikiwiki-style-legacy {
  656. @include ikiwiki-header;
  657. @include ikiwiki-inlineheader;
  658. @include ikiwiki-actions;
  659. @include ikiwiki-plugin-po;
  660. @include ikiwiki-inlinecontent;
  661. @include ikiwiki-footer;
  662. @include ikiwiki-pageinfo;
  663. @include ikiwiki-tags;
  664. @include ikiwiki-plugin-map;
  665. @include ikiwiki-plugin-img;
  666. @include ikiwiki-alignment;
  667. @include ikiwiki-backlinks;
  668. @include ikiwiki-plugin-search;
  669. @include ikiwiki-plugin-editpage;
  670. @include ikiwiki-images;
  671. @include ikiwiki-pre;
  672. @include ikiwiki-plugin-recentchanges;
  673. @include ikiwiki-blogform;
  674. @include ikiwiki-inlinepage;
  675. @include ikiwiki-authorship;
  676. @include ikiwiki-debug;
  677. @include ikiwiki-plugin-sidebar;
  678. @include ikiwiki-plugin-poll;
  679. @include ikiwiki-plugin-color;
  680. @include ikiwiki-plugin-comments;
  681. @include ikiwiki-plugin-progress;
  682. @include ikiwiki-site-print;
  683. @include ikiwiki-infobox;
  684. @include ikiwiki-notebook;
  685. @include ikiwiki-popup;
  686. @include ikiwiki-forms;
  687. @include ikiwiki-plugin-highlight;
  688. @include ikiwiki-plugin-calendar;
  689. @include ikiwiki-lists;
  690. @include ikiwiki-plugin-pagestats;
  691. @include ikiwiki-feedbutton;
  692. @include ikiwiki-plugin-flattr;
  693. @include ikiwiki-plugin-openid;
  694. @include ikiwiki-plugin-attachment;
  695. @include ikiwiki-plugin-trail;
  696. }
  697. @mixin ikiwiki-site {
  698. // main content
  699. @include ikiwiki-inlinepage;
  700. @include ikiwiki-inlineheader;
  701. @include ikiwiki-inlinecontent;
  702. @include ikiwiki-plugin-comments;
  703. // header
  704. @include ikiwiki-header;
  705. @include ikiwiki-plugin-search;
  706. @include ikiwiki-actions;
  707. @include ikiwiki-plugin-po;
  708. // footer
  709. @include ikiwiki-footer;
  710. @include ikiwiki-pageinfo;
  711. @include ikiwiki-tags;
  712. @include ikiwiki-backlinks;
  713. @include ikiwiki-authorship;
  714. @include ikiwiki-plugin-trail;
  715. // aside
  716. @include ikiwiki-plugin-sidebar;
  717. }
  718. // http://www.louddog.com/2008/create-maintainable-code-with-a-css-styleguide/
  719. @mixin ikiwiki-style {
  720. // site defaults
  721. @include ikiwiki-images;
  722. @include ikiwiki-pre;
  723. // generic styles
  724. @include ikiwiki-lists;
  725. @include ikiwiki-plugin-img;
  726. @include ikiwiki-feedbutton;
  727. @include ikiwiki-forms;
  728. @include ikiwiki-alignment;
  729. @include ikiwiki-debug;
  730. @include ikiwiki-plugin-highlight;
  731. @include ikiwiki-plugin-color;
  732. // shell
  733. // layout
  734. @include ikiwiki-site;
  735. @include ikiwiki-site-print;
  736. // modulars
  737. @include ikiwiki-infobox;
  738. @include ikiwiki-notebook;
  739. @include ikiwiki-popup;
  740. @include ikiwiki-plugin-calendar;
  741. @include ikiwiki-plugin-progress;
  742. @include ikiwiki-plugin-map;
  743. @include ikiwiki-plugin-poll;
  744. @include ikiwiki-plugin-pagestats;
  745. @include ikiwiki-plugin-flattr;
  746. @include ikiwiki-blogform;
  747. // section/page specific
  748. @include ikiwiki-plugin-recentchanges;
  749. @include ikiwiki-plugin-editpage;
  750. @include ikiwiki-plugin-attachment;
  751. @include ikiwiki-plugin-openid;
  752. }
  753. @mixin ikiwiki {
  754. @include ikiwiki-boilerplate;
  755. @include ikiwiki-reset;
  756. @include ikiwiki-style-legacy;
  757. }
  758. .pageheader .trails {
  759. /* allow space for the action tabs */
  760. margin-bottom: 2em;
  761. }