mirror of
https://github.com/rudy3333/eversync.git
synced 2025-07-03 01:26:01 +00:00
favicon + finished css migration
This commit is contained in:
parent
85f0eb32f0
commit
25b68105bb
5 changed files with 138 additions and 131 deletions
BIN
eversyncc/static/favicon.ico
Normal file
BIN
eversyncc/static/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
127
eversyncc/static/index-style.css
Normal file
127
eversyncc/static/index-style.css
Normal file
|
|
@ -0,0 +1,127 @@
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
background-color: #f0f2f5;
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
background-color: #3b5998;
|
||||||
|
height: 82px;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
.header-content {
|
||||||
|
max-width: 980px;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
color: white;
|
||||||
|
font-size: 40px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.nav-links {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20px;
|
||||||
|
}
|
||||||
|
.nav-links a {
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 8px 16px;
|
||||||
|
border-radius: 6px;
|
||||||
|
transition: background-color 0.2s;
|
||||||
|
}
|
||||||
|
.nav-links a:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
max-width: 980px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
.welcome-box {
|
||||||
|
background-color: white;
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.welcome-box h1 {
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
color: #1c1e21;
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
.welcome-box p {
|
||||||
|
margin: 0;
|
||||||
|
color: #65676b;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.content-box {
|
||||||
|
background-color: white;
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.content-box h2 {
|
||||||
|
margin: 0 0 20px 0;
|
||||||
|
color: #1c1e21;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.logout-button {
|
||||||
|
background-color: #e4e6eb;
|
||||||
|
color: #1c1e21;
|
||||||
|
border: none;
|
||||||
|
padding: 8px 16px;
|
||||||
|
border-radius: 6px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.2s;
|
||||||
|
}
|
||||||
|
.logout-button:hover {
|
||||||
|
background-color: #d8dadf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 20px;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-button {
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
border-radius: 10px;
|
||||||
|
color: black;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
cursor: pointer;
|
||||||
|
box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.mail {
|
||||||
|
background-color: #f44336;
|
||||||
|
}
|
||||||
|
|
||||||
|
.calendar {
|
||||||
|
background-color: #4caf50;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cloud {
|
||||||
|
background-color: #03a9f4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.service-button i {
|
||||||
|
font-size: 70px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
@ -3,9 +3,10 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Eversync - Log In</title>
|
<title>Eversync</title>
|
||||||
{% load static %}
|
{% load static %}
|
||||||
<link rel="stylesheet" href="{% static 'login-style.css' %}" "></head>
|
<link rel="stylesheet" href="{% static 'login-style.css' %}" "></head>
|
||||||
|
<link rel="icon" href="{% static 'favicon.ico' %}">
|
||||||
<body>
|
<body>
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="header-content">
|
<div class="header-content">
|
||||||
|
|
@ -13,6 +14,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="login-box">
|
<div class="login-box">
|
||||||
<h2>Log In to Eversync</h2>
|
<h2>Log In to Eversync</h2>
|
||||||
|
|
|
||||||
134
index.html
134
index.html
|
|
@ -5,135 +5,11 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Eversync</title>
|
<title>Eversync</title>
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
|
||||||
<style>
|
{% load static %}
|
||||||
body {
|
<link rel="icon" href="{% static 'favicon.ico' %}">
|
||||||
margin: 0;
|
<link rel="stylesheet" href="{% static 'index-style.css' %}" ">
|
||||||
padding: 0;
|
</head>
|
||||||
font-family: Arial, sans-serif;
|
|
||||||
background-color: #f0f2f5;
|
|
||||||
}
|
|
||||||
.header {
|
|
||||||
background-color: #3b5998;
|
|
||||||
height: 82px;
|
|
||||||
padding: 0 20px;
|
|
||||||
}
|
|
||||||
.header-content {
|
|
||||||
max-width: 980px;
|
|
||||||
margin: 0 auto;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.logo {
|
|
||||||
color: white;
|
|
||||||
font-size: 40px;
|
|
||||||
font-weight: bold;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
.nav-links {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 20px;
|
|
||||||
}
|
|
||||||
.nav-links a {
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 16px;
|
|
||||||
padding: 8px 16px;
|
|
||||||
border-radius: 6px;
|
|
||||||
transition: background-color 0.2s;
|
|
||||||
}
|
|
||||||
.nav-links a:hover {
|
|
||||||
background-color: rgba(255, 255, 255, 0.1);
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
max-width: 980px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 20px;
|
|
||||||
}
|
|
||||||
.welcome-box {
|
|
||||||
background-color: white;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.welcome-box h1 {
|
|
||||||
margin: 0 0 10px 0;
|
|
||||||
color: #1c1e21;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
.welcome-box p {
|
|
||||||
margin: 0;
|
|
||||||
color: #65676b;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
.content-box {
|
|
||||||
background-color: white;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
.content-box h2 {
|
|
||||||
margin: 0 0 20px 0;
|
|
||||||
color: #1c1e21;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.logout-button {
|
|
||||||
background-color: #e4e6eb;
|
|
||||||
color: #1c1e21;
|
|
||||||
border: none;
|
|
||||||
padding: 8px 16px;
|
|
||||||
border-radius: 6px;
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: bold;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.2s;
|
|
||||||
}
|
|
||||||
.logout-button:hover {
|
|
||||||
background-color: #d8dadf;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 20px;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-button {
|
|
||||||
width: 200px;
|
|
||||||
height: 200px;
|
|
||||||
border-radius: 10px;
|
|
||||||
color: black;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 32px;
|
|
||||||
cursor: pointer;
|
|
||||||
box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.mail {
|
|
||||||
background-color: #f44336;
|
|
||||||
}
|
|
||||||
|
|
||||||
.calendar {
|
|
||||||
background-color: #4caf50;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cloud {
|
|
||||||
background-color: #03a9f4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-button i {
|
|
||||||
font-size: 70px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="header">
|
<div class="header">
|
||||||
|
|
|
||||||
|
|
@ -3,8 +3,9 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Eversync - Register</title>
|
<title>Eversync</title>
|
||||||
{% load static %}
|
{% load static %}
|
||||||
|
<link rel="icon" href="{% static 'favicon.ico' %}">
|
||||||
<link rel="stylesheet" href="{% static 'register-style.css' %}" "></head>
|
<link rel="stylesheet" href="{% static 'register-style.css' %}" "></head>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue