Skip to content

Commit b68a4bc

Browse files
coxi-wikcoxi-wik
committed
perf: 更新首页上方学习中心内容
1 parent 415cb10 commit b68a4bc

File tree

5 files changed

+1679
-2
lines changed

5 files changed

+1679
-2
lines changed

‎docs/css/extra.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@
1414
}
1515

1616
.md-header{
17-
top: 48px;
17+
top: 91px;
1818
}
1919

2020
.md-main__inner {
21-
margin-top: 3rem;
21+
margin-top: 6rem;
2222
}
2323

2424
.progress-bar {

‎theme/css/f2c-header.css

+232
Original file line numberDiff line numberDiff line change
@@ -199,3 +199,235 @@ h4,h5{font-family:-apple-system, BlinkMacSystemFont, "Neue Haas Grotesk Text Pro
199199
.mdx-content__footer a:hover{transform:scale(1.2)}
200200
.mdx-content__footer hr{display:inline-block;width:2rem;margin:1em;vertical-align:middle;background-color:currentColor;border:none}
201201
.mdx-heart{-webkit-animation:mdx-heart 1s infinite;animation:mdx-heart 1s infinite}
202+
203+
.alert{padding:8px 15px;border-radius:6px;font-size:14px;}
204+
.alert.alert-dismissible{padding-right:30px;}
205+
.alert.alert-dismissible .close{top:-6px;right:-10px;font-size:16px!important;}
206+
.alert-release{padding:4px 16px;border-radius:0px;font-size:14px;margin-bottom:0px;background-color:rgba(43, 147, 124);color:#ffffff;border-color:rgba(43, 147, 124);}
207+
.fade{transition:opacity .15s linear;}
208+
@media (max-width: 768px){
209+
.notice-phone{display:none!important;}
210+
.mega-nav-sandbox .mega-nav-body{background-color:white;box-shadow:0 2px 16px rgba(79,99,122,0.2);color:black;margin:1em;padding:1em!important;}
211+
}
212+
.pr-4{padding-right:1.5rem!important;}
213+
.btn-outline-release{padding:6px 12px;border:1px solid white;color:white;background-color:transparent;line-height:2.5;}
214+
215+
216+
.carousel {
217+
position: relative
218+
}
219+
220+
.carousel.pointer-event {
221+
-ms-touch-action: pan-y;
222+
touch-action: pan-y
223+
}
224+
225+
.carousel-inner {
226+
position: relative;
227+
width: 100%;
228+
overflow: hidden
229+
}
230+
231+
.carousel-inner::after {
232+
display: block;
233+
clear: both;
234+
content: ""
235+
}
236+
237+
.carousel-item {
238+
position: relative;
239+
display: none;
240+
float: left;
241+
width: 100%;
242+
margin-right: -100%;
243+
-webkit-backface-visibility: hidden;
244+
backface-visibility: hidden;
245+
transition: -webkit-transform .6s ease-in-out;
246+
transition: transform .6s ease-in-out;
247+
transition: transform .6s ease-in-out, -webkit-transform .6s ease-in-out
248+
}
249+
250+
@media (prefers-reduced-motion: reduce) {
251+
.carousel-item {
252+
transition: none
253+
}
254+
}
255+
256+
.carousel-item-next, .carousel-item-prev, .carousel-item.active {
257+
display: block
258+
}
259+
260+
.active.carousel-item-right, .carousel-item-next:not(.carousel-item-left) {
261+
-webkit-transform: translateX(100%);
262+
transform: translateX(100%)
263+
}
264+
265+
.active.carousel-item-left, .carousel-item-prev:not(.carousel-item-right) {
266+
-webkit-transform: translateX(-100%);
267+
transform: translateX(-100%)
268+
}
269+
270+
.carousel-fade .carousel-item {
271+
opacity: 0;
272+
transition-property: opacity;
273+
-webkit-transform: none;
274+
transform: none
275+
}
276+
277+
.carousel-fade .carousel-item-next.carousel-item-left, .carousel-fade .carousel-item-prev.carousel-item-right, .carousel-fade .carousel-item.active {
278+
z-index: 1;
279+
opacity: 1
280+
}
281+
282+
.carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-right {
283+
z-index: 0;
284+
opacity: 0;
285+
transition: opacity 0s .6s
286+
}
287+
288+
@media (prefers-reduced-motion: reduce) {
289+
.carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-right {
290+
transition: none
291+
}
292+
}
293+
294+
.carousel-control-next, .carousel-control-prev {
295+
position: absolute;
296+
top: 0;
297+
bottom: 0;
298+
z-index: 1;
299+
display: -ms-flexbox;
300+
display: flex;
301+
-ms-flex-align: center;
302+
align-items: center;
303+
-ms-flex-pack: center;
304+
justify-content: center;
305+
width: 15%;
306+
color: #fff;
307+
text-align: center;
308+
opacity: .5;
309+
transition: opacity .15s ease
310+
}
311+
312+
@media (prefers-reduced-motion: reduce) {
313+
.carousel-control-next, .carousel-control-prev {
314+
transition: none
315+
}
316+
}
317+
318+
.carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover {
319+
color: #fff;
320+
text-decoration: none;
321+
outline: 0;
322+
opacity: .9
323+
}
324+
325+
.carousel-control-prev {
326+
left: 0
327+
}
328+
329+
.carousel-control-next {
330+
right: 0
331+
}
332+
333+
.carousel-control-next-icon, .carousel-control-prev-icon {
334+
display: inline-block;
335+
width: 20px;
336+
height: 20px;
337+
background: no-repeat 50%/100% 100%
338+
}
339+
340+
.carousel-control-prev-icon {
341+
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e")
342+
}
343+
344+
.carousel-control-next-icon {
345+
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e")
346+
}
347+
348+
.carousel-indicators {
349+
position: absolute;
350+
right: 0;
351+
bottom: 0;
352+
left: 0;
353+
z-index: 15;
354+
display: -ms-flexbox;
355+
display: flex;
356+
-ms-flex-pack: center;
357+
justify-content: center;
358+
padding-left: 0;
359+
margin-right: 15%;
360+
margin-left: 15%;
361+
list-style: none
362+
}
363+
364+
.carousel-indicators li {
365+
box-sizing: content-box;
366+
-ms-flex: 0 1 auto;
367+
flex: 0 1 auto;
368+
width: 30px;
369+
height: 3px;
370+
margin-right: 3px;
371+
margin-left: 3px;
372+
text-indent: -999px;
373+
cursor: pointer;
374+
background-color: #fff;
375+
background-clip: padding-box;
376+
border-top: 10px solid transparent;
377+
border-bottom: 10px solid transparent;
378+
opacity: .5;
379+
transition: opacity .6s ease
380+
}
381+
382+
@media (prefers-reduced-motion: reduce) {
383+
.carousel-indicators li {
384+
transition: none
385+
}
386+
}
387+
388+
.carousel-indicators .active {
389+
opacity: 1
390+
}
391+
392+
.carousel-caption {
393+
position: absolute;
394+
right: 15%;
395+
bottom: 20px;
396+
left: 15%;
397+
z-index: 10;
398+
padding-top: 20px;
399+
padding-bottom: 20px;
400+
color: #fff;
401+
text-align: center
402+
}
403+
404+
.sr-only {
405+
position: absolute;
406+
width: 1px;
407+
height: 1px;
408+
padding: 0;
409+
margin: -1px;
410+
overflow: hidden;
411+
clip: rect(0, 0, 0, 0);
412+
border: 0
413+
}
414+
415+
.glyphicon {
416+
position: relative;
417+
top: 1px;
418+
display: inline-block;
419+
font-family: "Glyphicons Halflings";
420+
font-style: normal;
421+
font-weight: 400;
422+
line-height: 1;
423+
-webkit-font-smoothing: antialiased;
424+
-moz-osx-font-smoothing: grayscale
425+
}
426+
427+
.glyphicon-chevron-left:before {
428+
content: "\e079"
429+
}
430+
431+
.glyphicon-chevron-right:before {
432+
content: "\e080"
433+
}

‎theme/f2c-header.html

+17
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,21 @@
11
<header id="topnav" class="defaultscroll sticky">
2+
<div id="myCarousel" class="carousel slide" data-ride="carousel">
3+
<div class="carousel-inner">
4+
<div class="carousel-item active alert alert-release alert-dismissible fade show text-center notice-phone" role="alert">
5+
<span class="pr-4">JumpServer 广受欢迎的开源堡垒机开课啦！</span>
6+
<a target="_blank" href="https://lkh.xet.tech/s/4htgv1" class="btn-outline-release mr-2">
7+
立即学习 </a>
8+
</div>
9+
</div>
10+
<a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev">
11+
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
12+
<span class="sr-only">Previous</span>
13+
</a>
14+
<a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
15+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
16+
<span class="sr-only">Next</span>
17+
</a>
18+
</div>
219
<svg class="hidden-print" aria-hidden="true" style="position: absolute; width: 0; height: 0;" width="0" height="0" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
320
<defs>
421
<symbol id="mega-nav-icon-angle" viewBox="0 0 13 7">

0 commit comments

Comments
 (0)