updated media
This commit is contained in:
wt committed
1 parent
79cd08d9cb
commit
06b0d4f801
4 files changed
+132
-70
No files matched your search
+8
-1
@@ -1,4 +1,5 @@
|
||||
.header {
|
||||
position: relative;
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -26,7 +27,7 @@
|
||||
box-shadow: white 0 0 30px;
|
||||
}
|
||||
|
||||
.usericon>img {
|
||||
.usericon > img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
@@ -49,3 +50,9 @@
|
||||
.time:hover {
|
||||
text-shadow: white 0 0 20px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.header {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
+15
-7
@@ -1,15 +1,17 @@
|
||||
.icons {
|
||||
width: 50%;
|
||||
height: 20%;
|
||||
display: grid;
|
||||
grid-template-columns: auto auto auto auto auto auto;
|
||||
align-content: center;
|
||||
justify-items: center;
|
||||
height: max-content;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
backdrop-filter: blur(5px);
|
||||
border-radius: 10px;
|
||||
padding: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
@@ -26,12 +28,18 @@
|
||||
box-shadow: white 0 0 30px;
|
||||
}
|
||||
|
||||
.icon>a {
|
||||
.icon > a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.icon>a>img {
|
||||
.icon > a > img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.icons {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
+18
-1
@@ -1,11 +1,21 @@
|
||||
.searchblock {
|
||||
width: 100%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: max-content;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.searchicon {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#search-in-google {
|
||||
max-width: 500px;
|
||||
padding: 10px 50px;
|
||||
font-size: 20px;
|
||||
margin: 10px;
|
||||
@@ -19,3 +29,10 @@
|
||||
#search-in-google:hover {
|
||||
box-shadow: white 0 0 20px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
#search-in-google {
|
||||
max-width: 200px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
+91
-61
@@ -1,70 +1,100 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="css/index.css">
|
||||
<link rel="stylesheet" href="css/icons.css">
|
||||
<link rel="stylesheet" href="css/header.css">
|
||||
<link rel="stylesheet" href="css/search.css">
|
||||
<link rel="stylesheet" href="css/card.css">
|
||||
<title>Dashboard</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="header">
|
||||
<h1 class="header-text">Dashboard</h1>
|
||||
<h1 class="time"></h1>
|
||||
<div class="user">
|
||||
<h2 class="username">Tola</h2>
|
||||
<div class="card" tabindex="0">
|
||||
<span class="cardicon">
|
||||
<img src="img/user.jpeg" alt="">
|
||||
</span>
|
||||
<div class="text">
|
||||
<h2 class="username">Tola</h2>
|
||||
<a href="mailto: tolamironcenko@icloud.com" class="mail">tolamironcenko@icloud.com</a>
|
||||
<a href="mailto: tolamironcenko@gmail.com" class="mail">tolamironcenko@gmail.com</a>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="css/index.css" />
|
||||
<link rel="stylesheet" href="css/icons.css" />
|
||||
<link rel="stylesheet" href="css/header.css" />
|
||||
<link rel="stylesheet" href="css/search.css" />
|
||||
<link rel="stylesheet" href="css/card.css" />
|
||||
<title>Dashboard</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="header">
|
||||
<h1 class="header-text">Dashboard</h1>
|
||||
<h1 class="time"></h1>
|
||||
<div class="user">
|
||||
<h2 class="username">Tola</h2>
|
||||
<div class="card" tabindex="0">
|
||||
<span class="cardicon">
|
||||
<img src="img/user.jpeg" alt="" />
|
||||
</span>
|
||||
<div class="text">
|
||||
<h2 class="username">Tola</h2>
|
||||
<a
|
||||
href="mailto: tolamironcenko@icloud.com"
|
||||
class="mail"
|
||||
>
|
||||
tolamironcenko@icloud.com
|
||||
</a>
|
||||
<a href="mailto: tolamironcenko@gmail.com" class="mail">
|
||||
tolamironcenko@gmail.com
|
||||
</a>
|
||||
<a href="tel:+79528926401" class="mail">
|
||||
+79528926401
|
||||
</a>
|
||||
<a href="tel:+79131019225" class="mail">
|
||||
+79131019225
|
||||
</a>
|
||||
<a href="tel:+79993228086" class="mail">
|
||||
+79993228086
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="searchblock">
|
||||
<input type="text" name="search-in-google" id="search-in-google" placeholder="Search in Google">
|
||||
</div>
|
||||
<div class="icons">
|
||||
<div class="icon">
|
||||
<a href="https://web.telegram.org/k/">
|
||||
<img src="img/telegram-icon.jpeg" alt="telegram-icon">
|
||||
</a>
|
||||
<div class="searchblock">
|
||||
<input
|
||||
type="text"
|
||||
name="search-in-google"
|
||||
id="search-in-google"
|
||||
placeholder="Search in Google"
|
||||
/>
|
||||
<div class="searchicon">🔍</div>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="http://jellyfin.local.com">
|
||||
<img src="img/jellyfin.png" alt="navidrome-icon">
|
||||
</a>
|
||||
<h2 style="color: white; text-align: center; margin: 10px 0 10px 0">
|
||||
Net
|
||||
</h2>
|
||||
<div class="icons">
|
||||
<div class="icon">
|
||||
<a href="https://web.telegram.org/k/">
|
||||
<img src="img/telegram-icon.jpeg" alt="telegram-icon" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="https://github.com">
|
||||
<img src="img/github-icon.png" alt="github-icon" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="https://gitea.home.com:3000">
|
||||
<img src="img/gitea-icon.png" alt="gitea-icon">
|
||||
</a>
|
||||
<h2 style="color: white; text-align: center; margin: 10px 0 10px 0">
|
||||
Home
|
||||
</h2>
|
||||
<div class="icons">
|
||||
<div class="icon">
|
||||
<a href="http://jellyfin.local.com">
|
||||
<img src="img/jellyfin.png" alt="navidrome-icon" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="https://gitea.home.com:3000">
|
||||
<img src="img/gitea-icon.png" alt="gitea-icon" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="http://notes.local.com">
|
||||
<img src="img/notes-icon.jpeg" alt="gitea-icon" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="http://money.local.com">
|
||||
<img src="img/money-icon.jpg" alt="gitea-icon" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="https://github.com">
|
||||
<img src="img/github-icon.png" alt="github-icon">
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="http://notes.local.com">
|
||||
<img src="img/notes-icon.jpeg" alt="gitea-icon">
|
||||
</a>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<a href="http://money.local.com">
|
||||
<img src="img/money-icon.jpg" alt="gitea-icon">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/time.js"></script>
|
||||
<script src="js/search.js"></script>
|
||||
</body>
|
||||
<script src="js/time.js"></script>
|
||||
<script src="js/search.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user