1/**
2 * @file       clock/style.css
3 * @brief      Default styles for the "clock" plugin
4 */
5
6#clock_wrapper {
7	padding: 0;
8	--clock-border: 2px solid gray;
9	--clock-border-radius: 2px;
10	--clock-text-font-size: inherit;
11	--clock-binary-font-size: large;
12	--clock-binary-digit0: '○';
13	--clock-binary-digit1: '●';
14}
15
16#clock_wrapper > div > #dw_clock_object {
17	min-width: 6em;
18	margin: 0 auto;
19	padding: 4px;
20	border: var(--clock-border);
21	border-radius: var(--clock-border-radius);
22}
23
24/**
25 * ---------------------------------------------------------------------
26 * Style #0    : plain
27 * Description : pretty plain
28 * Features    :
29 * With this style the face itself is not stulized, only some layout
30 * attributes are given as well as default style for the helpbar.
31 */
32#clock_wrapper > div.text {
33  text-align: center;
34}
35
36#clock_wrapper > div.text > #dw_clock_object {
37	font-size: var(--clock-text-font-size);
38}
39
40/*
41 * text clock styles
42 * */
43
44#clock_wrapper > div.text > #dw_clock_object.plain {
45  display: block;
46  font-family: monospace;
47  text-align: center;
48  color: __text__;
49  border: 4px inset __text_alt__;
50  background-color: __background_alt__;
51  }
52
53
54/**
55 * ---------------------------------------------------------------------
56 * Style #2    : aradio
57 * Description : some description
58 * Features    : a clock using a digital clock font in yellow face in a
59 *               black background and minor shadow.
60 *
61 * ---Warning---
62 * This style makes use of CSS3 @font-face specification,
63 * which is only supported by decent (or incredible, like Opera) web browsers.
64 * **Check the plugin page for support and indications**
65 *
66 * For full experience, it is _recommended_ to make the typeface available
67 * to clients via a direct download link, and source that URL from here.
68 * Take into consideration the licensing of the typeface, and offer a
69 * fallback or switch if it is now available at last as Freeware.
70 * ---End Warning---
71 */
72
73@font-face {
74  font-family: 'Atomic Clock Radio';
75  src: local('Atomic Clock Radio');
76  /* src: url(path/to/your/copy/of/atomicclockradio.ttf) format('truetype'); */
77  }
78
79#clock_wrapper > div.text > #dw_clock_object.aradio {
80  padding: 4px;
81  padding-right: 1em;
82  background-color: #c4c8ee;
83  border: 2px solid #b6b6d8;
84  font-family: "Atomic Clock Radio", fantasy;
85  font-size: 14pt;
86  text-align: right;
87  letter-spacing: 0.6pt;
88  text-shadow: -2px 1px #884446;
89  color: #848861;
90  }
91
92#clock_wrapper > div.text > #dw_clock_object.aradio span.sep {
93  color: #808080;
94  font-weight: bold;
95  }
96
97/**
98 * style: tv24
99 * a clock using a digital clock font with yellow face in a black background and a shadow, degrading to monospace if the digital clock is unavailable.
100 *
101 * This style uses four font fallbacks: 'LCDRegular', 'LCD', 'Segment7Standard' and 'dseg7classic'. They are not provided here, they must be available either client-side or provided via an external source (eg.: via usertsyle.css).
102 *
103 */
104
105#clock_wrapper > div.text > #dw_clock_object.tv24 {
106  min-width: 8em;
107  background-color: black;
108  border: 2px solid navy;
109  line-height: 20pt;
110  text-align: center;
111  font-family: "LCDRegular", 'LCD', "Segment7Standard", "Digital Readout", "DSEG7 Classic", monospace;
112  font-size: 14pt;
113  text-shadow: 2px 2px #404020;
114  letter-spacing: 0.2em;
115  color: yellow;
116}
117
118#dw_clock_object.text > div.tv24 .info {
119  position: absolute;
120  right: 0;
121  bottom: 0;
122  border: 2px solid black;
123}
124
125#dw_clock_object .face.tv24 .info:hover {
126  border: 2px solid __existing__;
127}
128
129/**
130 * ---------------------------------------------------------------------
131 * Style #4    : bluebox
132 * Description : "24"-like digital clock
133 * Features    : a blue box with a white typeface, shadows.
134 *
135 *
136 * ---Warning---
137 * This style makes use of CSS3 @font-face specification,
138 * which is only supported by decent (or incredible, like Opera) web browsers.
139 * **Check the plugin page for support and indications**
140 *
141 * For full experience, it is _recommended_ to make the typeface available
142 * to clients via a direct download link, and source that URL from here.
143 * Take into consideration the licensing of the typeface, and offer a
144 * fallback or switch if it is now available at last as Freeware.
145 * ---End Warning---
146 */
147#dw_clock_object .face.bluebox {
148  width: 75%;
149  max-width: 8em;
150  background-color: #2222aa;
151  border: 4px solid navy;
152  border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px;
153  line-height: 20pt;
154  text-align: center;
155  font-family: "Liberation", "Helvetica", cursive;
156  font-size: 14pt;
157  text-shadow: -1px 2px #80c080;
158  text-shadow: 2px -1px #882222;
159  letter-spacing: 0.2em;
160  color: #e0f0e0;
161}
162
163
164
165/*
166 * Helpbar styling
167 * */
168#clock_wrapper p.helpbar {
169  margin: 0 2em;
170  padding: 0 0.5em;
171  background-color: __background_alt__;
172  border: 1px solid __existing__;
173  border-radius: 6px;
174  font-size: 90%;
175  }
176
177
178