Introduction
Introduction Statistics Contact Development Disclaimer Help
css.md - cl-yag - Common Lisp Yet Another website Generator
git clone git://bitreich.org/cl-yag/ git://enlrupgkhuxnvlhsf6lc3fziv5h2hhfrinws…
Log
Files
Refs
Tags
README
LICENSE
---
css.md (3994B)
---
1 # CSS For cl-yag
2
3 cl-yag provides you with a default theme and a useful approach to
4 handle CSS style sheets as well as CSS frameworks.
5
6
7 ## Where The Style Sheets Live
8
9 All of cl-yag's style sheets are located in **static/css/**.
10 Currently there are the following files:
11
12 css/
13 |-- clym.css
14 |-- custom.css
15 |-- pure_r1.0.0/
16 | |-- LICENSE.md
17 | `-- pure.css
18 `-- style.css
19
20
21 ## style.css -- One Sheet To Rule Them All
22
23 In order to keep it simple cl-yag uses **static/css/style.css** to
24 administrate all of its style sheets. Use the ``@import`` rule to
25 include your own, or comments to get rid of what is already there -
26 but mind the [cascade](https://www.w3.org/TR/css-cascade-3/ "W3C: CSS Ca…
27
28 Currently, **style.css** looks like this:
29
30 /* =============================================================…
31 /* style.css for cl-yag */
32 /* =============================================================…
33 @charset "utf-8";
34
35
36 /* ~ PURE …
37 @import url("pure_r1.0.0/pure.css");
38
39
40 /* ~ CLYM …
41 @import url("clym.css");
42
43
44 /* ~ LAST ENTRY …
45 /* ~ use custom.css for overriding rules …
46 @import url("custom.css");
47
48
49
50 ## Pure -- "A Set Of Small, Responsive CSS Modules"
51
52 cl-yag uses a style sheet called **pure.css**, taken from
53 [Pure](https://purecss.io/ "purecss.io"), a minimal, BSD licensed CSS
54 framework, to provide a set of expected UI features, among which are
55 sane resets (such as
56 [normalize.css](https://necolas.github.io/normalize.css/
57 "Normalize.css - A modern, HTML5-ready alternative to CSS resets")'s
58 reset rules) and usable menus.
59
60 To deactivate Pure, put the *PURE.CSS* ``@import`` rule in
61 **static/css/style.css** in comments and re-run ``make``.
62
63
64 ## clym -- A Default Theme
65
66 Additionally, cl-yag comes with its first theme: *clym*.
67
68 *clym* stands for *cl-yag minimal*. It is a set of css rules designed to
69 work with cl-yag's html skeleton. It provides an unobtrusive color
70 scheme, basic typography, as well as basic responsiveness. You'll find
71 it in **static/css/clym.css**.
72
73 **clym.css** doesn't provide neither css resets nor a menu layout. This
74 is handled by [Pure](https://purecss.io/ "purecss.io")'s
75 **pure.css**. Further, it doesn't need any JavaScript.
76
77 If you don't like *clym*, put comments around the line ``@import
78 url("clym.css");`` in **static/css/style.css**, around all pure-rules
79 in **static/css/custom.css**, and re-run ``make``.
80
81
82 ## **custom.css**
83
84 For information about **custom.css** you need to read it, as well as
85 the following section "Working With Style Sheets".
86
87
88 ## Working With Style Sheets
89
90 ### Current Styles And Minor Tweaks
91
92 If you are already using a combination of style sheets and you need to
93 adjust some parts of the layout, use cl-yag's
94 **static/css/custom.css**. It is currently used to override Pure's
95 default layout for horizontal menus with *clym*'s colorscheme.
96
97 #### MIND
98
99 - In order to override rules located in all previous(!) style sheets
100 **custom.css** needs to get sourced in as the last(!) file in
101 **static/css/style.css** (see section: "style.css – One Sheet To Rule …
102 All").
103 - Respect the [cascade](https://www.w3.org/TR/css-cascade-3/ "W3C: CSS C…
104
105
106 ### Frameworks
107
108 CSS frameworks provide an easy way to create your own theme. To make use
109 of a framework's rulesets,
110
111 - its style sheets need to get included via your **static/css/style.css*…
112 - their ids and classes need to get wired into cl-yag's template files a…
113 - the template files need to get used by cl-yag's **generator.lisp**.
114
115 So you need to edit cl-yag's template files in **templates/** and - in
116 case you've choosen to rename your templates - you need to adjust their
117 corresponding paths and filenames in **generator.lisp**.
118
119
120
121
122
123
You are viewing proxied material from bitreich.org. The copyright of proxied material belongs to its original authors. Any comments or complaints in relation to proxied material should be directed to the original authors of the content concerned. Please see the disclaimer for more details.