mirror of
https://github.com/kubesphere/website.git
synced 2025-12-26 00:12:48 +00:00
Merge pull request #1819 from liuboaibc/update/header-github
update header
This commit is contained in:
LiuBo
GitHub
commit
9fdcbfdab0
|
|
@ -66,8 +66,8 @@
|
|||
|
||||
.nav {
|
||||
height:100%;
|
||||
margin-left: 300px;
|
||||
margin-right: 340px;
|
||||
margin-left: 280px;
|
||||
margin-right: 360px;
|
||||
line-height: 93px;
|
||||
|
||||
@media only screen and (max-width: $mobile-max-width) {
|
||||
|
|
@ -184,8 +184,11 @@
|
|||
transform: translateY(-50%);
|
||||
right: 0;
|
||||
|
||||
& > ul {
|
||||
@media only screen and (max-width: $mobile-max-width) {
|
||||
height: 21px;
|
||||
}
|
||||
|
||||
& > ul {
|
||||
@media only screen and (max-width: $mobile-max-width) {
|
||||
display: flex;
|
||||
flex-wrap: wrap ;
|
||||
|
|
@ -300,6 +303,58 @@
|
|||
|
||||
}
|
||||
|
||||
.github-li {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
.github-star {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 10px;
|
||||
background: linear-gradient(180deg, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.1) 96.81%), #FFFFFF;
|
||||
border: 1px solid #CCD3DB;
|
||||
box-shadow: 0px 8px 16px rgba(76, 169, 134, 0.1), 0px 10px 50px rgba(76, 169, 134, 0.05);
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
@media only screen and (max-width: $mobile-max-width) {
|
||||
display: none;
|
||||
}
|
||||
a {
|
||||
color: #3E464C;
|
||||
font-size: 16px;
|
||||
line-height: 16px;
|
||||
&:hover {
|
||||
color: #4CA986;
|
||||
}
|
||||
}
|
||||
|
||||
.star-btn {
|
||||
padding: 7px 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.star-img {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-image: url('/images/header/github-star.svg');
|
||||
}
|
||||
&:hover {
|
||||
.star-img {
|
||||
background-image: url('/images/header/github-star-hover.svg');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.social-count {
|
||||
padding: 7px 14px;
|
||||
border-left: 1px solid rgba(204, 211, 219, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
display: none;
|
||||
margin-left: 12px;
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@ mailchimpSubscribeUrl = "https://kubesphere.us10.list-manage.com/subscribe/post?
|
|||
gcs_engine_id = "018068616810858123755%3Apb1pt8sx6ve"
|
||||
|
||||
githubLink = "https://github.com/kubesphere/kubesphere"
|
||||
githubApiLink = "https://api.github.com/repos/kubesphere/kubesphere"
|
||||
githubStarLink = "https://github.com/kubesphere/kubesphere/stargazers"
|
||||
slackLink = "https://join.slack.com/t/kubesphere/shared_invite/enQtNTE3MDIxNzUxNzQ0LTZkNTdkYWNiYTVkMTM5ZThhODY1MjAyZmVlYWEwZmQ3ODQ1NmM1MGVkNWEzZTRhNzk0MzM5MmY4NDc3ZWVhMjE"
|
||||
facebookLink = "https://www.facebook.com/kubesphere"
|
||||
twitterLink = "https://twitter.com/KubeSphere"
|
||||
|
|
|
|||
|
|
@ -86,10 +86,18 @@
|
|||
<li>{{ i18n "demo content 3" }}</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li class='link-li'>
|
||||
<!-- <li class='link-li'>
|
||||
<a class='link-slack' href="{{ .Site.Params.slackLink }}" target="_blank" rel="noopener noreferrer"></a>
|
||||
<a class='link-twitter' href="{{ .Site.Params.twitterLink }}" target="_blank" rel="noopener noreferrer"></a>
|
||||
<a class='link-github' href="{{ .Site.Params.githubLink }}" target="_blank" rel="noopener noreferrer"></a>
|
||||
</li> -->
|
||||
<li class="github-li">
|
||||
<div class="github-star">
|
||||
<a class="star-btn" href="{{ .Site.Params.githubLink }}" rel="noopener noreferrer" target="_blank">
|
||||
<span class="star-img"></span> <span>Star</span>
|
||||
</a>
|
||||
<a class="social-count" href="{{ .Site.Params.githubStarLink }}" rel="noopener noreferrer" target="_blank"></a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-icon">
|
||||
<img src="/images/header/menu.svg" alt="">
|
||||
|
|
@ -148,6 +156,17 @@
|
|||
</div>
|
||||
</header>
|
||||
<script>
|
||||
var githubApiLink = "{{ .Site.Params.githubApiLink }}"
|
||||
|
||||
var getStar = function() {
|
||||
$('.social-count').hide()
|
||||
$.getJSON(githubApiLink, function(data) {
|
||||
$('.social-count').show().html(data.stargazers_count)
|
||||
})
|
||||
}
|
||||
|
||||
getStar()
|
||||
|
||||
var bindNavMouseEvent = function(selector, element) {
|
||||
if (!element) {
|
||||
element = $(selector)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.1695 9.61248L15.6342 6.26654C15.7996 6.10271 15.8824 5.95148 15.8824 5.81285C15.8824 5.57971 15.7042 5.43478 15.3479 5.37807L10.5564 4.68809L8.40887 0.387524C8.28797 0.129175 8.13207 0 7.94118 0C7.75028 0 7.59439 0.129175 7.47349 0.387524L5.32593 4.68809L0.534502 5.37807C0.178167 5.43478 0 5.57971 0 5.81285C0 5.94518 0.079539 6.09641 0.238617 6.26654L3.71288 9.61248L2.89204 14.3384C2.87931 14.4266 2.87295 14.4896 2.87295 14.5274C2.87295 14.6597 2.90636 14.7716 2.97317 14.8629C3.03998 14.9543 3.1402 15 3.27383 15C3.38836 15 3.51562 14.9622 3.65561 14.8866L7.94118 12.656L11.4997 14.5082L12.2267 14.8866C12.3604 14.9622 12.4876 15 12.6085 15C12.7358 15 12.8328 14.9543 12.8996 14.8629C12.9665 14.7716 12.9999 14.6597 12.9999 14.5274C12.9999 14.4455 12.9967 14.3825 12.9903 14.3384L12.1695 9.61248ZM11.1742 12.6477L10.5555 9.08581L13.1529 6.57747L9.5653 6.06084L7.94118 2.80847L6.31706 6.06084L2.72458 6.57817L5.32704 9.08451L4.70815 12.6477L7.94118 10.9649L11.1742 12.6477Z" fill="#4CA986"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.1695 9.61248L15.6342 6.26654C15.7996 6.10271 15.8824 5.95148 15.8824 5.81285C15.8824 5.57971 15.7042 5.43478 15.3479 5.37807L10.5564 4.68809L8.40887 0.387524C8.28797 0.129175 8.13207 0 7.94118 0C7.75028 0 7.59439 0.129175 7.47349 0.387524L5.32593 4.68809L0.534502 5.37807C0.178167 5.43478 0 5.57971 0 5.81285C0 5.94518 0.079539 6.09641 0.238617 6.26654L3.71288 9.61248L2.89204 14.3384C2.87931 14.4266 2.87295 14.4896 2.87295 14.5274C2.87295 14.6597 2.90636 14.7716 2.97317 14.8629C3.03998 14.9543 3.1402 15 3.27383 15C3.38836 15 3.51562 14.9622 3.65561 14.8866L7.94118 12.656L11.4997 14.5082L12.2267 14.8866C12.3604 14.9622 12.4876 15 12.6085 15C12.7358 15 12.8328 14.9543 12.8996 14.8629C12.9665 14.7716 12.9999 14.6597 12.9999 14.5274C12.9999 14.4455 12.9967 14.3825 12.9903 14.3384L12.1695 9.61248ZM11.1742 12.6477L10.5555 9.08581L13.1529 6.57747L9.5653 6.06084L7.94118 2.80847L6.31706 6.06084L2.72458 6.57817L5.32704 9.08451L4.70815 12.6477L7.94118 10.9649L11.1742 12.6477Z" fill="#3E464C"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
Loading…
Reference in New Issue