mirror of
https://github.com/ivabus/www
synced 2024-11-10 18:05:15 +03:00
Added floating 'join' btn
This commit is contained in:
parent
e77685608a
commit
1d328c8e04
36
src/layouts/partials/floating-join-btn.html
Normal file
36
src/layouts/partials/floating-join-btn.html
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
<style>
|
||||||
|
.gf-container {
|
||||||
|
width: 8vw;
|
||||||
|
height: 8vw;
|
||||||
|
border-radius: 100px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: fixed;
|
||||||
|
text-align:center;
|
||||||
|
padding-top: 3vw;
|
||||||
|
font-size: 1.562vw;
|
||||||
|
background-color: #1a1a1a !important;
|
||||||
|
border: 2px solid #949494;
|
||||||
|
color: #ffffff;
|
||||||
|
text-decoration: none;
|
||||||
|
font-family: "pp-neue-machina", sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
right: 15px;
|
||||||
|
top: 5.3vw;
|
||||||
|
cursor: pointer;
|
||||||
|
z-index: 3;
|
||||||
|
transition: 0.2s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gf-container:hover {
|
||||||
|
color:#1a1a1a;
|
||||||
|
box-shadow: inset 0vw 0vw 0vw 0.358vw #1a1a1a !important;
|
||||||
|
background-color: #00ffd0 !important;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container" style="background-color:#8EC7BF;">
|
||||||
|
JOIN
|
||||||
|
</a>
|
|
@ -78,5 +78,8 @@
|
||||||
window.location.replace(`${window.location.origin}${window.location.pathname}`)
|
window.location.replace(`${window.location.origin}${window.location.pathname}`)
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
{{- partial "floating-join-btn.html" . -}}
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
</head>
|
</head>
|
||||||
|
|
|
@ -1,63 +0,0 @@
|
||||||
<style>
|
|
||||||
.gf-container {
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
border-radius: 60px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
position: fixed;
|
|
||||||
right: 15px;
|
|
||||||
bottom: 15px;
|
|
||||||
cursor: pointer;
|
|
||||||
box-shadow: 0 0 0 rgba(204, 169, 44, 0.4);
|
|
||||||
animation: pulse 2s infinite;
|
|
||||||
z-index: 200;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gf-container:hover {
|
|
||||||
animation: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@-webkit-keyframes pulse {
|
|
||||||
0% {
|
|
||||||
-webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
70% {
|
|
||||||
-webkit-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
-webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes pulse {
|
|
||||||
0% {
|
|
||||||
-moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
|
|
||||||
box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
70% {
|
|
||||||
-moz-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
|
|
||||||
box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
-moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
|
|
||||||
box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.github-icon {
|
|
||||||
width: 60%;
|
|
||||||
margin-top: auto;
|
|
||||||
margin-bottom: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container" style="background-color:#8EC7BF;">
|
|
||||||
<img src="/Images/github.svg" alt="" class="github-icon mx-auto">
|
|
||||||
|
|
||||||
</a>
|
|
Loading…
Reference in a new issue