Mercurial > hg > Papers > 2016 > kaito-master

comparison slide/blank.css.less @ 13:9d3bc0073675

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
slide
author Kaito Tokumori <e105711@ie.u-ryukyu.ac.jp>
date Sun, 14 Feb 2016 18:51:54 +0900
parents
children
comparison
equal deleted inserted replaced
12:a077276f53cc 13:9d3bc0073675
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: #dd0000;
8 @color-step-hidden: silver;
9
10 @background-color-code: #ffffa9;
11
12 // -- gradient colors used for slides classified with cover | title
13
14 @background-gradient-color1-cover: white;
15 @background-gradient-color2-cover: white;
16
17 // -- gradient colors for all other slides
18
19 @background-gradient-color1: white;
20 @background-gradient-color2: white;
21
22 // --- font size
23
24 @font-size-h1: 200%; // 30pt / 40px (assuming 100% => 12pt / 16px)
25 @font-size-h2: 220%; // 28pt / 37px
26 @font-size-h3: 180%; // 24pt / 32px
27 @font-size-hX: 250%;
28 @font-size-text: 150%; // 18pt / 24px
29 @font-size-list: 160%; // 18pt / 24px
30 @font-size-code: 100%; // 16pt / 22px
31 @font-small-size: 90%;
32 @font-smaller-size: 80%;
33
34 /////////////////////////////
35
36 body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }
37
38 a:link,
39 a:visited { color: @color; }
40
41
42 .slide {
43
44 color: @color;
45
46 h1 { font-size: @font-size-h1;
47 color: white;
48 text-align: center;
49
50 &.fullscreen { position: absolute;
51 top: 40%;
52 width: 100%; }
53
54 // lets you create slides with no heading (that is, heading gets hidden but included in toc)
55 &.hidden { display: none; }
56 }
57
58 hX { font-size: @font-size-hX;
59 color: white;
60 text-align: center;
61 font-weight: bold;
62 &.fullscreen { position: absolute;
63 top: 40%;
64 width: 100%; }
65
66 // lets you create slides with no heading (that is, heading gets hidden but included in toc)
67 &.hidden { display: none; }
68 }
69
70 h2 { font-size: @font-size-h2; background-color: #808db5; color:white; padding: 5px;}
71
72 h3 { font-size: @font-size-h3; }
73 name {
74 font-size: @font-size-h3;
75 background-color: #ffcc00;
76 &.fullscreen { position: absolute;
77 top: 40%;
78 width: 100%; }
79 }
80
81 .stepcurrent { color: @color-step; }
82 .step { color: @color-step-hidden; } // or hide next steps e.g. .step { visibility: hidden; }
83
84
85 }
86
87 div.highlight {background-color:@background-color-code; display: inline-block; _display: inline;}
88 div > ul { list-style-type: square; font-size: @font-size-list;}
89 div > ol {font-size: @font-size-list;}
90 li { margin-bottom: 15px;}
91
92 p, dt, dd, td{ font-size: @font-size-text; }
93 th { font-size: @font-small-size;}
94
95 p.emphasize {font-size: @font-size-h3}
96 pre {font-size: @font-size-code; }
97
98 .code {
99 background-color: @background-color-code;
100 padding: 5px;
101 }
102 .small_code {
103 font-size: @font-small-size;
104 padding: 2px;
105 }
106
107 .smaller_code {
108 font-size: @font-smaller-size;
109 padding: 2px;
110 }
111
112 code {
113 font-size: @font-size-code;
114 background-color: @background-color-code;
115 padding: 5px;
116 }
117 .footnote a:first-of-type { text-decoration: none; }
118
119
120 p.footnote { font-size: 88%; }
121
122 .help {
123 p, td { font-size: 88%; }
124 }
125
126 /********
127 * example gradient background using css3
128 */
129
130 .slide {
131 background-image: -webkit-linear-gradient(top, @background-gradient-color1,
132 @background-gradient-color2,
133 @background-gradient-color1,
134 @background-gradient-color2);
135
136 background-image: -moz-linear-gradient(top, @background-gradient-color1,
137 @background-gradient-color2,
138 @background-gradient-color1,
139 @background-gradient-color2);
140
141 &.cover, &.title {
142 background-image: -webkit-linear-gradient(top, @background-gradient-color1-cover,
143 @background-gradient-color2-cover,
144 @background-gradient-color1-cover,
145 @background-gradient-color2-cover);
146
147 background-image: -moz-linear-gradient(top, @background-gradient-color1-cover,
148 @background-gradient-color2-cover,
149 @background-gradient-color1-cover,
150 @background-gradient-color2-cover);
151
152 }
153 }