summaryrefslogtreecommitdiff
path: root/style.scss
blob: 0298874a8b5dad6ad56105ed8ea93dc9373e6505 (plain)
  1. @charset 'utf-8';
  2. @import "partials/base";
  3. @import "toolkit";
  4. @import "compass/typography";
  5. @import "../shared/themes/default/ikiwiki";
  6. // site defaults
  7. @include ikiwiki-images;
  8. @include ikiwiki-pre;
  9. // generic styles
  10. @include ikiwiki-lists;
  11. @include ikiwiki-plugin-img;
  12. @include ikiwiki-feedbutton;
  13. @include ikiwiki-forms;
  14. @include ikiwiki-alignment;
  15. @include ikiwiki-debug;
  16. @include ikiwiki-plugin-highlight;
  17. @include ikiwiki-plugin-color;
  18. // shell
  19. // Content
  20. //
  21. // Light grey underlay
  22. // Max. 45 chars., balanced margins on large viewports
  23. %anycontent {
  24. max-width: 45em;
  25. margin: 0 auto;
  26. padding: .5em 2em;
  27. background-color: $color-primary-1;
  28. }
  29. // layout - main content
  30. #content {
  31. @extend %anycontent;
  32. }
  33. @include ikiwiki-inlinepage;
  34. @include ikiwiki-inlineheader;
  35. @include ikiwiki-inlinecontent;
  36. @include ikiwiki-plugin-comments;
  37. // layout - header
  38. .pageheader .header {
  39. @extend %anycontent;
  40. & span {
  41. font-size: xx-large;
  42. font-weight: bold;
  43. }
  44. }
  45. @include ikiwiki-plugin-search;
  46. @include ikiwiki-actions;
  47. @include ikiwiki-plugin-po;
  48. // layout - footer
  49. #footer {
  50. @extend %anycontent;
  51. }
  52. @include ikiwiki-footer;
  53. @include ikiwiki-pageinfo;
  54. @include ikiwiki-tags;
  55. @include ikiwiki-backlinks;
  56. @include ikiwiki-authorship;
  57. // layout - aside
  58. @include ikiwiki-plugin-sidebar;
  59. @include ikiwiki-plugin-trail;
  60. // layout - print
  61. @include ikiwiki-site-print;
  62. // modulars
  63. @include ikiwiki-infobox;
  64. @include ikiwiki-notebook;
  65. @include ikiwiki-popup;
  66. @include ikiwiki-plugin-calendar;
  67. @include ikiwiki-plugin-progress;
  68. @include ikiwiki-plugin-map;
  69. @include ikiwiki-plugin-poll;
  70. @include ikiwiki-plugin-pagestats;
  71. @include ikiwiki-plugin-flattr;
  72. @include ikiwiki-blogform;
  73. // section/page specific
  74. @include ikiwiki-archivepage;
  75. @include ikiwiki-plugin-recentchanges;
  76. @include ikiwiki-plugin-editpage;
  77. @include ikiwiki-plugin-attachment;
  78. @include ikiwiki-plugin-openid;
  79. // Action items
  80. //
  81. // Right-aligned horizontal items, hidden unless hovered
  82. .pageheader .actions {
  83. position: absolute;
  84. top: 0;
  85. right: 2em;
  86. background-color: transparent;
  87. ul {
  88. @include inline-block-list;
  89. height: 2em;
  90. }
  91. a {
  92. color: transparent;
  93. &:hover {
  94. color: $color-complement-0;
  95. text-decoration: none;
  96. }
  97. }
  98. }
  99. // Page
  100. //
  101. // Grey underlay, Helvetica text
  102. body {
  103. background-color: $color-primary-0;
  104. font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  105. }
  106. // Links
  107. //
  108. // Use primary color; underlined only when hovered
  109. a {
  110. @include link-colors($color-complement-0, $color-complement-2);
  111. @include hover-link;
  112. }
  113. // Wine menu items (definition lists within ordered lists)
  114. //
  115. // Single count across main content
  116. // Strongly typed titles (definition title)
  117. // Right end reserved for prices (definition data)
  118. #content {
  119. counter-reset: unified;
  120. ol li {
  121. list-style-type: none;
  122. &:before {
  123. float: left;
  124. margin-left: -2em;
  125. counter-increment: unified;
  126. content: counters(unified, ".") " ";
  127. }
  128. dt {
  129. font-weight: bold;
  130. }
  131. p {
  132. margin-right: 5em;
  133. }
  134. > p {
  135. margin-top: 0;
  136. }
  137. }
  138. }
  139. // Definition lists
  140. //
  141. // Full-width horizontal items with definitions right-aligned
  142. dl {
  143. display: inline-block;
  144. width: 100%;
  145. margin: 0;
  146. }
  147. dt {
  148. float: left;
  149. clear: right;
  150. }
  151. dd {
  152. float: right;
  153. clear: right;
  154. margin-left: 1em;
  155. }
  156. // Images
  157. //
  158. // Full-width with slight side padding
  159. #content img {
  160. width: 70%;
  161. padding: 0 15%;
  162. }
  163. #branding-logo img {
  164. width: 100%;
  165. }
  166. // Pagedate
  167. //
  168. // very tiny in lower right corner
  169. .pagedate {
  170. text-align: right;
  171. font-size: xx-small;
  172. }