UNPKG

4.18 kBCSSView Raw
1/**
2 * prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
3 * Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
4 * @author Tim Shedor
5 */
6
7code[class*="language-"],
8pre[class*="language-"] {
9 color: black;
10 background: none;
11 font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
12 font-size: 1em;
13 text-align: left;
14 white-space: pre;
15 word-spacing: normal;
16 word-break: normal;
17 word-wrap: normal;
18 line-height: 1.5;
19
20 -moz-tab-size: 4;
21 -o-tab-size: 4;
22 tab-size: 4;
23
24 -webkit-hyphens: none;
25 -moz-hyphens: none;
26 -ms-hyphens: none;
27 hyphens: none;
28}
29
30/* Code blocks */
31pre[class*="language-"] {
32 position: relative;
33 margin: .5em 0;
34 overflow: visible;
35 padding: 0;
36}
37pre[class*="language-"]>code {
38 position: relative;
39 border-left: 10px solid #358ccb;
40 box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
41 background-color: #fdfdfd;
42 background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
43 background-size: 3em 3em;
44 background-origin: content-box;
45 background-attachment: local;
46}
47
48code[class*="language"] {
49 max-height: inherit;
50 height: inherit;
51 padding: 0 1em;
52 display: block;
53 overflow: auto;
54}
55
56/* Margin bottom to accommodate shadow */
57:not(pre) > code[class*="language-"],
58pre[class*="language-"] {
59 background-color: #fdfdfd;
60 -webkit-box-sizing: border-box;
61 -moz-box-sizing: border-box;
62 box-sizing: border-box;
63 margin-bottom: 1em;
64}
65
66/* Inline code */
67:not(pre) > code[class*="language-"] {
68 position: relative;
69 padding: .2em;
70 border-radius: 0.3em;
71 color: #c92c2c;
72 border: 1px solid rgba(0, 0, 0, 0.1);
73 display: inline;
74 white-space: normal;
75}
76
77pre[class*="language-"]:before,
78pre[class*="language-"]:after {
79 content: '';
80 z-index: -2;
81 display: block;
82 position: absolute;
83 bottom: 0.75em;
84 left: 0.18em;
85 width: 40%;
86 height: 20%;
87 max-height: 13em;
88 box-shadow: 0px 13px 8px #979797;
89 -webkit-transform: rotate(-2deg);
90 -moz-transform: rotate(-2deg);
91 -ms-transform: rotate(-2deg);
92 -o-transform: rotate(-2deg);
93 transform: rotate(-2deg);
94}
95
96:not(pre) > code[class*="language-"]:after,
97pre[class*="language-"]:after {
98 right: 0.75em;
99 left: auto;
100 -webkit-transform: rotate(2deg);
101 -moz-transform: rotate(2deg);
102 -ms-transform: rotate(2deg);
103 -o-transform: rotate(2deg);
104 transform: rotate(2deg);
105}
106
107.token.comment,
108.token.block-comment,
109.token.prolog,
110.token.doctype,
111.token.cdata {
112 color: #7D8B99;
113}
114
115.token.punctuation {
116 color: #5F6364;
117}
118
119.token.property,
120.token.tag,
121.token.boolean,
122.token.number,
123.token.function-name,
124.token.constant,
125.token.symbol,
126.token.deleted {
127 color: #c92c2c;
128}
129
130.token.selector,
131.token.attr-name,
132.token.string,
133.token.char,
134.token.function,
135.token.builtin,
136.token.inserted {
137 color: #2f9c0a;
138}
139
140.token.operator,
141.token.entity,
142.token.url,
143.token.variable {
144 color: #a67f59;
145 background: rgba(255, 255, 255, 0.5);
146}
147
148.token.atrule,
149.token.attr-value,
150.token.keyword,
151.token.class-name {
152 color: #1990b8;
153}
154
155.token.regex,
156.token.important {
157 color: #e90;
158}
159
160.language-css .token.string,
161.style .token.string {
162 color: #a67f59;
163 background: rgba(255, 255, 255, 0.5);
164}
165
166.token.important {
167 font-weight: normal;
168}
169
170.token.bold {
171 font-weight: bold;
172}
173.token.italic {
174 font-style: italic;
175}
176
177.token.entity {
178 cursor: help;
179}
180
181.token.namespace {
182 opacity: .7;
183}
184
185@media screen and (max-width: 767px) {
186 pre[class*="language-"]:before,
187 pre[class*="language-"]:after {
188 bottom: 14px;
189 box-shadow: none;
190 }
191
192}
193
194/* Plugin styles */
195.token.tab:not(:empty):before,
196.token.cr:before,
197.token.lf:before {
198 color: #e0d7d1;
199}
200
201/* Plugin styles: Line Numbers */
202pre[class*="language-"].line-numbers.line-numbers {
203 padding-left: 0;
204}
205
206pre[class*="language-"].line-numbers.line-numbers code {
207 padding-left: 3.8em;
208}
209
210pre[class*="language-"].line-numbers.line-numbers .line-numbers-rows {
211 left: 0;
212}
213
214/* Plugin styles: Line Highlight */
215pre[class*="language-"][data-line] {
216 padding-top: 0;
217 padding-bottom: 0;
218 padding-left: 0;
219}
220pre[data-line] code {
221 position: relative;
222 padding-left: 4em;
223}
224pre .line-highlight {
225 margin-top: 0;
226}