Add some style
This commit is contained in:
parent
63342a02c1
commit
d810fee04d
@ -62,4 +62,73 @@ h1 {
|
|||||||
.left {
|
.left {
|
||||||
width: auto;
|
width: auto;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* CSS */
|
||||||
|
.home {
|
||||||
|
padding: 0.6em 2em;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
color: black;
|
||||||
|
background: white;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
z-index: 0;
|
||||||
|
user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
touch-action: manipulation;
|
||||||
|
font-size: large;
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home:before {
|
||||||
|
content: "";
|
||||||
|
background: linear-gradient(
|
||||||
|
45deg,
|
||||||
|
#ff0000,
|
||||||
|
#ff7300,
|
||||||
|
#fffb00,
|
||||||
|
#48ff00,
|
||||||
|
#00ffd5,
|
||||||
|
#002bff,
|
||||||
|
#7a00ff,
|
||||||
|
#ff00c8,
|
||||||
|
#ff0000
|
||||||
|
);
|
||||||
|
position: absolute;
|
||||||
|
top: -2px;
|
||||||
|
left: -2px;
|
||||||
|
background-size: 400%;
|
||||||
|
z-index: -1;
|
||||||
|
filter: blur(5px);
|
||||||
|
-webkit-filter: blur(5px);
|
||||||
|
width: calc(100% + 4px);
|
||||||
|
height: calc(100% + 4px);
|
||||||
|
animation: glowing-home 120s linear infinite;
|
||||||
|
transition: opacity 0.3s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes glowing-home {
|
||||||
|
0% {
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
background-position: 400% 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.home:after {
|
||||||
|
z-index: -1;
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: white;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
}
|
}
|
@ -9,7 +9,7 @@
|
|||||||
<link rel="stylesheet" href="../../css/styles.css">
|
<link rel="stylesheet" href="../../css/styles.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<a href="../../index.html" class="nav-link"><i class="bi bi-house-fill"></i> Home</a>
|
<a href="../../index.html" class="nav-link home"><i class="bi bi-house-fill"></i> Home</a>
|
||||||
<h1><img src="logo/logo.png" id="img_logo">Energy+ workflow</h1>
|
<h1><img src="logo/logo.png" id="img_logo">Energy+ workflow</h1>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
<link rel="stylesheet" href="../../css/styles.css">
|
<link rel="stylesheet" href="../../css/styles.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<a href="../../index.html" class="nav-link"><i class="bi bi-house-fill"></i> Home</a>
|
<a href="../../index.html" class="nav-link home"><i class="bi bi-house-fill"></i> Home</a>
|
||||||
<h1><img src="logo/logo.png" id="img_logo">INSEL monthly energy balance workflow</h1>
|
<h1><img src="logo/logo.png" id="img_logo">INSEL monthly energy balance workflow</h1>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
<link rel="stylesheet" href="../../css/styles.css">
|
<link rel="stylesheet" href="../../css/styles.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<a href="../../index.html" class="nav-link"><i class="bi bi-house-fill"></i> Home</a>
|
<a href="../../index.html" class="nav-link home"><i class="bi bi-house-fill"></i> Home</a>
|
||||||
<h1><img src="logo/logo.png" id="img_logo"> Retrofit workflow</h1>
|
<h1><img src="logo/logo.png" id="img_logo"> Retrofit workflow</h1>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
Loading…
Reference in New Issue
Block a user