Skip to content

Commit 030634e

Browse files
libangruilibangrui
authored
Merge pull request #44 from libangrui/upgrade/homepage-mobile
add mobile homepage
2 parents 88e3280 + 0df19d0 commit 030634e

File tree

10 files changed

+937
-135
lines changed

10 files changed

+937
-135
lines changed

‎layouts/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{{ partial "header.html" . }}
22

3-
<div id="main">
3+
<div id="main" class="main">
44
<section class="first" id="first">
55
<div class="container">
66
{{ with .Site.Params.Index.First }}
@@ -131,7 +131,7 @@ <h3 class="section-title">
131131

132132
<section class="seventh" id="seventh">
133133
<div class="section-wave">
134-
<img class="section-img70" src="/assets/7-0.svg" alt="wave1" />
134+
<img class="section-img70 pc-show" src="/assets/7-0.svg" alt="wave1" />
135135
</div>
136136

137137
<div class="container">
@@ -147,7 +147,7 @@ <h3 class="section-title">{{ .title }}</h3>
147147

148148
<img class="section-img71" src="/assets/7-1.svg" alt="wave2" />
149149
<img class="section-img72" src="/assets/7-2.svg" alt="diamond1" />
150-
<img class="section-img73" src="/assets/7-3.svg" alt="diamond2" />
150+
<img class="section-img73 pc-show" src="/assets/7-3.svg" alt="diamond2" />
151151
</div>
152152
</section>
153153

‎layouts/partials/header.html‎

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,12 @@
22
<html lang="{{ .Site.LanguageCode }}">
33
<head>
44
<meta charset="utf-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>{{ .Title }} | {{ .Site.Title }}</title>
77

88
{{ if .IsHome }}
99
<link rel="stylesheet" href="{{ "/css/plugin/aos.css" | relURL }}" />
1010
<link rel="stylesheet" href="{{ "/css/style.css" | relURL }}" />
11-
<link rel="stylesheet" href="{{ "/css/home_clip.css" | relURL }}">
1211
{{ end }}
1312

1413
{{ partial "head_custom.html" . }}
@@ -17,11 +16,23 @@
1716
<body>
1817
<nav class="header">
1918
<div class="container">
20-
<h1 class="logo"><a href="#"><img src="/assets/logo.svg" alt="" height="36"></a></h1>
21-
<ul class="menu">
22-
{{ range .Site.Menus.main }}
23-
<li><a href="{{ .URL | relURL }}">{{ .Name }}</a></li>
24-
{{ end }}
25-
</ul>
19+
<h1 class="logo">
20+
<a href="#">
21+
<img class="pc-show" src="/assets/logo.svg" alt="openPitrix" height="36">
22+
<span class="logo1 mobile-show" style="background-image: url('/assets/logo-1.svg');"></span>
23+
<span class="logo2" style="background-image: url('/assets/logo-2.svg');"></span>
24+
</a>
25+
</h1>
26+
<button class="menu-btn mobile-show"></button>
27+
<div class="menu-wrapper">
28+
<ul class="menu">
29+
{{ range .Site.Menus.main }}
30+
<li>
31+
<a href="{{ .URL | relURL }}">{{ .Name }}</a>
32+
<img class="mobile-show" src="/assets/arrow-right.svg" alt="arrow-right">
33+
</li>
34+
{{ end }}
35+
</ul>
36+
</div>
2637
</div>
2738
</nav>

‎layouts/partials/home_clip.html‎

Lines changed: 138 additions & 119 deletions
Large diffs are not rendered by default.

‎static/assets/arrow-right.svg‎

Lines changed: 13 additions & 0 deletions
Loading

‎static/assets/logo-1.svg‎

Lines changed: 16 additions & 0 deletions
Loading

‎static/assets/logo-2.svg‎

Lines changed: 18 additions & 0 deletions
Loading

‎static/css/home_clip.css‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -280,3 +280,84 @@
280280
animation-delay: .5s;
281281
}
282282

283+
/* common */
284+
.pc-show {
285+
display: block;
286+
}
287+
.mobile-show {
288+
display: none;
289+
}
290+
291+
/* pc narrow screen */
292+
@media (max-width: 1200px) {
293+
.section-process .center-pitrix-icon {
294+
left: 550px;
295+
}
296+
}
297+
298+
/* ipad pro vertical screen & mobile */
299+
@media (max-width: 1024px) {
300+
.section-process {
301+
display: flex;
302+
justify-content: center;
303+
align-items: center;
304+
}
305+
.img-sources img {
306+
width: 0.4rem;
307+
height: 0.4rem;
308+
}
309+
.img-sources #java {
310+
top: 0.3rem;
311+
left: 0.2rem;
312+
}
313+
.img-sources #php {
314+
top: auto;
315+
bottom: 0.3rem;
316+
left: 0.2rem;
317+
}
318+
.img-sources #more {
319+
top: 0.77rem;
320+
left: 0.65rem;
321+
}
322+
.left-dots {
323+
top: 0.66rem;
324+
left: 0.55rem;
325+
}
326+
.img-targets img {
327+
width: 0.6rem;
328+
right: 0.15rem !important;
329+
}
330+
.img-targets #aws {
331+
top: 0.1rem;
332+
}
333+
.img-targets #qingcloud {
334+
top: 0.73rem;
335+
}
336+
.img-targets #vmware {
337+
top: auto;
338+
bottom: 0.1rem;
339+
}
340+
.center-pitrix-icon {
341+
position: static;
342+
width: auto !important;
343+
height: auto !important;
344+
margin: 0.05rem 0 0 0.1rem;
345+
transform: scale(1);
346+
}
347+
.right-dots {
348+
top: 0.4rem;
349+
right: 0.68rem;
350+
}
351+
}
352+
353+
@media (max-width: 768px) {
354+
.center-pitrix-icon {
355+
transform: scale(0.8);
356+
}
357+
}
358+
359+
@media (max-width: 414px) {
360+
.center-pitrix-icon {
361+
transform: scale(0.5);
362+
}
363+
}

0 commit comments

Comments
 (0)