comparison 2014/2014_01_14/s6_trunk/blank.css.less @ 0:845ff8ff4fc9

1st
author Kaito Tokumori <e105711@ie.u-ryukyu.ac.jp>
date Tue, 14 Jan 2014 01:31:42 +0900
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:845ff8ff4fc9
1 ////////
2 // variables for easy configuration
3 //
4 // (note: this is a less extendend css script, to learn more about less; see lesscss.org)
5
6 @color: black;
7 @color-step-hidden: silver;
8
9 @background-color-code: azure;
10
11 // -- gradient colors used for slides classified with cover | title
12
13 @background-gradient-color1-cover: blue;
14 @background-gradient-color2-cover: aqua;
15
16 // -- gradient colors for all other slides
17
18 @background-gradient-color1: yellow;
19 @background-gradient-color2: orange;
20
21 // --- font size
22
23 @font-size-h1: 245%; // 30pt / 40px (assuming 100% => 12pt / 16px)
24 @font-size-h2: 230%; // 28pt / 37px
25 @font-size-h3: 200%; // 24pt / 32px
26 @font-size-text: 150%; // 18pt / 24px
27 @font-size-code: 140%; // 16pt / 22px
28
29
30 /////////////////////////////
31
32 body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }
33
34 a:link,
35 a:visited { color: @color; }
36
37
38 .slide {
39
40 color: @color;
41
42 h1 { font-size: @font-size-h1;
43 text-align: center;
44
45 &.fullscreen { position: absolute;
46 top: 40%;
47 width: 100%; }
48
49 // lets you create slides with no heading (that is, heading gets hidden but included in toc)
50 &.hidden { display: none; }
51 }
52
53 h2 { font-size: @font-size-h2; }
54
55 h3 { font-size: @font-size-h3; }
56
57 .stepcurrent { color: @color; }
58 .step { color: @color-step-hidden; } // or hide next steps e.g. .step { visibility: hidden; }
59 }
60
61
62 ul { list-style-type: square; }
63
64
65 p, li, dt, dd, td, th { font-size: @font-size-text; }
66
67
68 pre { font-size: @font-size-code; }
69
70 .code {
71 background-color: @background-color-code;
72 padding: 5px;
73 }
74
75 .footnote a:first-of-type { text-decoration: none; }
76
77 p.footnote { font-size: 88%; }
78
79 .help {
80 p, td { font-size: 88%; }
81 }
82
83 /********
84 * example gradient background using css3
85 */
86
87 .slide {
88 background-image: -webkit-linear-gradient(top, @background-gradient-color1,
89 @background-gradient-color2,
90 @background-gradient-color1,
91 @background-gradient-color2);
92
93 background-image: -moz-linear-gradient(top, @background-gradient-color1,
94 @background-gradient-color2,
95 @background-gradient-color1,
96 @background-gradient-color2);
97
98 &.cover, &.title {
99 background-image: -webkit-linear-gradient(top, @background-gradient-color1-cover,
100 @background-gradient-color2-cover,
101 @background-gradient-color1-cover,
102 @background-gradient-color2-cover);
103
104 background-image: -moz-linear-gradient(top, @background-gradient-color1-cover,
105 @background-gradient-color2-cover,
106 @background-gradient-color1-cover,
107 @background-gradient-color2-cover);
108
109 }
110 }