mirror of
https://github.com/Stone-Red-Code/Stone-Red-Code.github.io.git
synced 2026-09-04 09:06:28 +02:00
Added some nice animations
This commit is contained in:
@@ -3,7 +3,8 @@
|
|||||||
<a class="navbar-brand" href="http://github.com/Stone-Red-Code" aria-label="GitHub Link"><img class="rounded"
|
<a class="navbar-brand" href="http://github.com/Stone-Red-Code" aria-label="GitHub Link"><img class="rounded"
|
||||||
src="https://github.com/Stone-Red-Code.png" height="45" alt="Profile picture"></a>
|
src="https://github.com/Stone-Red-Code.png" height="45" alt="Profile picture"></a>
|
||||||
|
|
||||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar" aria-label="Menu Button">
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"
|
||||||
|
aria-label="Menu Button">
|
||||||
<span class="navbar-toggler-icon"></span>
|
<span class="navbar-toggler-icon"></span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|||||||
@@ -47,7 +47,17 @@ footer {
|
|||||||
top: 1.5rem;
|
top: 1.5rem;
|
||||||
transform: translate(-50%, 0%);
|
transform: translate(-50%, 0%);
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.jumbotron {
|
||||||
|
animation-name: fadeGray;
|
||||||
|
background: #dadde0;
|
||||||
|
transition: background-color 0.5s ease-out 100ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jumbotron:hover {
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
#quotes {
|
#quotes {
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
@@ -62,9 +72,8 @@ footer {
|
|||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fade-in
|
.fade-in {
|
||||||
{
|
visibility: visible !important;
|
||||||
visibility:visible !important;
|
|
||||||
animation: fadeIn;
|
animation: fadeIn;
|
||||||
animation-duration: 1s;
|
animation-duration: 1s;
|
||||||
}
|
}
|
||||||
@@ -98,7 +107,6 @@ h3 {
|
|||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
a:link {
|
a:link {
|
||||||
color: gray;
|
color: gray;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
@@ -113,7 +121,7 @@ a:visited {
|
|||||||
/* mouse over link */
|
/* mouse over link */
|
||||||
|
|
||||||
a:hover {
|
a:hover {
|
||||||
color: rgb(0, 0, 0);
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* selected link */
|
/* selected link */
|
||||||
@@ -125,14 +133,22 @@ a:active {
|
|||||||
.nav-link {
|
.nav-link {
|
||||||
text-decoration: var(--fg-theme);
|
text-decoration: var(--fg-theme);
|
||||||
text-decoration: none!important;
|
text-decoration: none!important;
|
||||||
|
transition: background-color 0.5s ease-out 100ms
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link:hover {
|
||||||
|
background-color: rgb(155, 155, 155);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
background-color: var(--fg-theme);
|
||||||
}
|
}
|
||||||
|
|
||||||
.toolIcon img {
|
.toolIcon img {
|
||||||
width: 100;
|
width: 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dropdown-item:active
|
.dropdown-item:active {
|
||||||
{
|
|
||||||
background-color: lightgray;
|
background-color: lightgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -149,15 +165,13 @@ a:active {
|
|||||||
.header-text {
|
.header-text {
|
||||||
margin-top: 1.1rem;
|
margin-top: 1.1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
#quotes {
|
#quotes {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 580px)
|
@media screen and (max-width: 580px) {
|
||||||
{
|
.dropdown-menu {
|
||||||
.dropdown-menu{
|
|
||||||
background-color: var(--fg-theme)!important;
|
background-color: var(--fg-theme)!important;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
@@ -172,8 +186,11 @@ a:active {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeIn
|
@keyframes fadeIn {
|
||||||
{
|
from {
|
||||||
from{opacity: 0%;}
|
opacity: 0%;
|
||||||
to{opacity: 100%;}
|
}
|
||||||
|
to {
|
||||||
|
opacity: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user