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