1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 | .hljs {
|
22 | display: block;
|
23 | overflow-x: auto;
|
24 | padding: 0.5em;
|
25 | color: #424242;
|
26 | background: #FAFAFA;
|
27 | }
|
28 |
|
29 | .hljs-comment,
|
30 | .hljs-quote {
|
31 | color: #424242;
|
32 | font-style: italic;
|
33 | }
|
34 |
|
35 | .hljs-doctag,
|
36 | .hljs-keyword,
|
37 | .hljs-formula {
|
38 | color: #c678dd;
|
39 | }
|
40 |
|
41 | .hljs-section,
|
42 | .hljs-name,
|
43 | .hljs-selector-tag,
|
44 | .hljs-deletion,
|
45 | .hljs-subst {
|
46 | color: #e06c75;
|
47 | }
|
48 |
|
49 | .hljs-literal {
|
50 | color: #56b6c2;
|
51 | }
|
52 |
|
53 | .hljs-string,
|
54 | .hljs-regexp,
|
55 | .hljs-addition,
|
56 | .hljs-attribute,
|
57 | .hljs-meta-string {
|
58 | color: #98c379;
|
59 | }
|
60 |
|
61 | .hljs-built_in,
|
62 | .hljs-class .hljs-title {
|
63 | color: #e6c07b;
|
64 | }
|
65 |
|
66 | .hljs-attr,
|
67 | .hljs-variable,
|
68 | .hljs-template-variable,
|
69 | .hljs-type,
|
70 | .hljs-selector-class,
|
71 | .hljs-selector-attr,
|
72 | .hljs-selector-pseudo,
|
73 | .hljs-number {
|
74 | color: #d19a66;
|
75 | }
|
76 |
|
77 | .hljs-symbol,
|
78 | .hljs-bullet,
|
79 | .hljs-link,
|
80 | .hljs-meta,
|
81 | .hljs-selector-id,
|
82 | .hljs-title {
|
83 | color: #61aeee;
|
84 | }
|
85 |
|
86 | .hljs-emphasis {
|
87 | font-style: italic;
|
88 | }
|
89 |
|
90 | .hljs-strong {
|
91 | font-weight: bold;
|
92 | }
|
93 |
|
94 | .hljs-link {
|
95 | text-decoration: underline;
|
96 | }
|
97 |
|
98 | .component-demo .u-panel {
|
99 | padding: 18px 20px;
|
100 | border: 1px solid #F0F0F0;
|
101 | }
|
102 | .component-demo .u-panel-default .u-panel-heading{
|
103 | background-color: #fff;
|
104 | padding: 0;
|
105 | position: relative;
|
106 | margin-bottom: 20px;
|
107 | }
|
108 | .component-demo p{
|
109 | margin: 0;
|
110 | font-size: 14px;
|
111 | }
|
112 |
|
113 | .component-demo .component-title{
|
114 | font-size: 14px;
|
115 | font-weight: bold;
|
116 | }
|
117 |
|
118 | .component-demo .component-code{
|
119 | position: absolute;
|
120 | right: 0;
|
121 | top: 0;
|
122 | color: #E14C46;
|
123 | font-size: 14px;
|
124 | cursor: pointer;
|
125 | }
|
126 | .component-demo .u-panel .u-panel-body{
|
127 | padding: 0;
|
128 | }
|
129 |
|
130 | .component-drawerc .pre-js,.component-drawerc .pre-css{
|
131 | margin: 0;
|
132 | }
|
133 |
|
134 |
|
135 | .component-drawerc .drawer-body {
|
136 | padding: 20px 20px;
|
137 | }
|
138 | .component-drawerc .component-code-copy {
|
139 | font-size: 14px;
|
140 | font-weight: 800;
|
141 | color: #424242;
|
142 | padding: 10px 0;
|
143 | position: relative;
|
144 | }
|
145 | .component-drawerc .component-code-copy .uf-copy::before{
|
146 | content: "\e6fc";
|
147 | }
|
148 | .component-drawerc .component-code-copy .uf{
|
149 | font-weight: 100;
|
150 | }
|
151 | .component-drawerc .component-code-copy.copy-css{
|
152 | margin-top: 20px;
|
153 | }
|
154 |
|
155 | .component-drawerc .component-code-copy .u-clipboard{
|
156 | position: absolute;
|
157 | right: 0;
|
158 | }
|
159 |
|
160 | .component-drawerc{
|
161 | position: fixed;
|
162 | top: 0;
|
163 | left: 0;
|
164 | z-index: 100000;
|
165 | width: 0;
|
166 | height: 100%;
|
167 | }
|
168 | .component-drawerc .drawer-mask{
|
169 | background-color: rgba(0,0,0,.3);
|
170 | width: 100%;
|
171 | height: 100%;
|
172 | position: fixed;
|
173 | top: 0;
|
174 | left: 0;
|
175 | transition: transform 300ms ease-in-out, opacity 300ms ease-in-out;
|
176 | }
|
177 | .component-drawerc .drawer-close{
|
178 | position: absolute;
|
179 | top: 10px;
|
180 | right: 10px;
|
181 | font-size: 20px;
|
182 | cursor: pointer;
|
183 | }
|
184 | .component-drawerc .drawer{
|
185 | position: fixed;
|
186 | background-color: #fff;
|
187 | transition: transform 300ms ease-in-out;
|
188 | overflow: auto;
|
189 | }
|
190 | .component-drawerc .drawer-left{
|
191 | top: 0;
|
192 | left: 0;
|
193 | height: 100%;
|
194 | }
|
195 | .component-drawerc .drawer-right{
|
196 | top: 0;
|
197 | right: 0;
|
198 | height: 100%;
|
199 | }
|
200 | .component-drawerc .drawer-top{
|
201 | top: 0;
|
202 | left: 0;
|
203 | width: 100%;
|
204 | }
|
205 | .component-drawerc .drawer-bottom{
|
206 | bottom: 0;
|
207 | left: 0;
|
208 | width: 100%;
|
209 | }
|
210 | .component-drawerc .drawer-header{
|
211 | padding: 0 20px;
|
212 | border-radius: 0;
|
213 | background: #E14C46;
|
214 | color: #fff;
|
215 | border-bottom: 1px solid #e8e8e8;
|
216 | }
|
217 | .component-drawerc .drawer-header-title{
|
218 | margin: 0;
|
219 | color: #fff;
|
220 | height: 40px;
|
221 | line-height: 40px;
|
222 | } |
\ | No newline at end of file |