Site plus beau (Pas du tout responsive pour l'instant !)
This commit is contained in:
Guams
parent
88747c2b45
commit
70ffed4dc5
34
about.html
34
about.html
@ -1,24 +1,26 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html class="no-js" lang="">
|
||||||
<head>
|
<head>
|
||||||
<title>About</title>
|
<title>Guams</title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8"/>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||||
<link rel="stylesheet" href="css/style.css">
|
<meta content="Guams" property="og:title"/>
|
||||||
|
<meta content="Hi, I'm Guams, a french developer. Here you can see my open source projects, my blog and more."
|
||||||
|
property="og:description"/>
|
||||||
|
<meta content="https://guams.fr" property="og:url"/>
|
||||||
|
<meta content="guams.fr/img/guams.gif" property="og:image"/>
|
||||||
|
<meta content="#d67d72" data-react-helmet="true" name="theme-color"/>
|
||||||
|
<link rel="stylesheet" href="css/style.css"/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div>
|
<main>
|
||||||
<h1>About</h1>
|
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<h1><a class="nav-item" href="/">Home</a></h1>
|
||||||
<li><a href="index.html">Home</a></li>
|
<h1><a class="nav-item" href="/about.html">About</a></h1>
|
||||||
<li><a target="_blank" href="https://gitea.guams.fr">My Gitea</a></li>
|
|
||||||
<li><a target="_blank" href="https://abonentendeur.guams.fr">My blog</a></li>
|
|
||||||
<li><a href="about.html">About</a></li>
|
|
||||||
</ul>
|
|
||||||
<a target="_blank" href="https://fish.golf"><img src="img/fishgolf.gif" alt="fishgolf"></a>
|
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
<a href="https://fish.golf"><img class="badge" title="frien :3" src="img/fishgolf.gif" alt="fishgolf"></a>
|
||||||
<h2>W.I.P</h2>
|
<div class="card" style="width: 62%"></div>
|
||||||
|
<h2>Work in progress...</h2>
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
110
css/style.css
110
css/style.css
@ -1,40 +1,94 @@
|
|||||||
|
* {
|
||||||
|
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
color: white;
|
background-color: #f6f0e6;
|
||||||
background-color: #020a14;
|
margin: auto;
|
||||||
}
|
width: 50%;
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
nav {
|
|
||||||
gap: 10px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
background-color: #020a14;
|
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul {
|
nav {
|
||||||
list-style-type: none;
|
display: flex;
|
||||||
margin: 0;
|
gap: inherit;
|
||||||
padding: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li {
|
.nav-item {
|
||||||
float: left;
|
color: #d67d72;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li a {
|
.nav-item:hover {
|
||||||
display: block;
|
color: #c65d53;
|
||||||
color: white;
|
transition: 1.5s;
|
||||||
text-align: center;
|
}
|
||||||
padding: 14px 16px;
|
|
||||||
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li a:hover {
|
h2 {
|
||||||
background-color: #424242
|
text-align: center;
|
||||||
|
color: #d67d72;
|
||||||
|
}
|
||||||
|
|
||||||
|
.git_button_a, .website_link_a {
|
||||||
|
height: 100%;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.git_button, .website_link {
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #d67d72;
|
||||||
|
transition: 0.3s;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.git_button:hover, .website_link:hover {
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: #c65d53;
|
||||||
|
border: 1px solid #9b7432;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
width: 88px;
|
||||||
|
height: 31px;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
gap: 50px;
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 1%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.illustration {
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: 0 5px 5px black;
|
||||||
|
object-fit: cover;
|
||||||
|
width: 100%;
|
||||||
|
height: 300px;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button_div {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
display: flex;
|
||||||
|
border-top: 1px solid rgba(159, 162, 177, 0.4);
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 20px;
|
||||||
}
|
}
|
||||||
BIN
img/abonentendeur.png
Normal file
BIN
img/abonentendeur.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
BIN
img/gitea.png
Normal file
BIN
img/gitea.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 139 KiB |
91
index.html
91
index.html
@ -1,30 +1,87 @@
|
|||||||
<!doctype html>
|
<!DOCTYPE html>
|
||||||
<html class="no-js" lang="">
|
<html class="no-js" lang="">
|
||||||
<head>
|
<head>
|
||||||
<title>Guams</title>
|
<title>Guams</title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8"/>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||||
<meta content="Guams" property="og:title"/>
|
<meta content="Guams" property="og:title"/>
|
||||||
<meta
|
<meta content="Hi, I'm Guams, a french developer. Here you can see my open source projects, my blog and more."
|
||||||
content="Hi, I'm Guams, a french developer. Here you can see my open source projects, my blog and more."
|
|
||||||
property="og:description"/>
|
property="og:description"/>
|
||||||
<meta content="https://guams.fr" property="og:url"/>
|
<meta content="https://guams.fr" property="og:url"/>
|
||||||
<meta content="img/guams.gif" property="og:image" />
|
<meta content="guams.fr/img/guams.gif" property="og:image"/>
|
||||||
<meta content="#609926" data-react-helmet="true" name="theme-color" />
|
<meta content="#d67d72" data-react-helmet="true" name="theme-color"/>
|
||||||
<link rel="stylesheet" href="css/style.css">
|
<link rel="stylesheet" href="css/style.css"/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div>
|
<main>
|
||||||
<h1>Welcome to guams.fr</h1>
|
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<h1><a class="nav-item" href="/">Home</a></h1>
|
||||||
<li><a href="index.html">Home</a></li>
|
<h1><a class="nav-item" href="/about.html">About</a></h1>
|
||||||
<li><a target="_blank" href="https://gitea.guams.fr">My Gitea</a></li>
|
|
||||||
<li><a target="_blank" href="https://abonentendeur.guams.fr">My blog</a></li>
|
|
||||||
<li><a href="about.html">About</a></li>
|
|
||||||
</ul>
|
|
||||||
<a target="_blank" href="https://fish.golf"><img src="img/fishgolf.gif" alt="fishgolf"></a>
|
|
||||||
</nav>
|
</nav>
|
||||||
|
<a href="https://fish.golf"><img class="badge" title="frien :3" src="img/fishgolf.gif" alt="fishgolf"></a>
|
||||||
|
<div class="card">
|
||||||
|
<h2>À bon entendeur</h2>
|
||||||
|
<img class="illustration" src="img/abonentendeur.png" alt="gitea"/>
|
||||||
|
<div class="button_div">
|
||||||
|
<a class="git_button_a" href="https://gitea.guams.fr/Guams/review-front">
|
||||||
|
<div class="git_button">
|
||||||
|
<span>Source code</span>
|
||||||
|
<svg fill="#ffffff"
|
||||||
|
viewBox="0 0 32 32"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="30">
|
||||||
|
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
|
||||||
|
<g id="SVGRepo_tracerCarrier"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"></g>
|
||||||
|
<g id="SVGRepo_iconCarrier">
|
||||||
|
<path
|
||||||
|
d="M5.583 7.229c-2.464-0.005-5.755 1.557-5.573 5.479 0.281 6.125 6.557 6.693 9.068 6.745 0.271 1.146 3.224 5.109 5.411 5.318h9.573c5.74-0.38 10.036-17.365 6.854-17.427-5.271 0.25-8.396 0.375-11.073 0.396v5.297l-0.839-0.365-0.005-4.932c-3.073 0-5.781-0.141-10.917-0.396-0.646-0.005-1.542-0.115-2.5-0.115zM5.927 9.396h0.297c0.349 3.141 0.917 4.974 2.068 7.781-2.938-0.349-5.432-1.198-5.891-4.38-0.24-1.646 0.563-3.365 3.526-3.401zM17.339 12.479c0.198 0.005 0.406 0.042 0.594 0.13l1 0.432-0.714 1.302c-0.109 0-0.219 0.016-0.323 0.052-0.464 0.151-0.708 0.604-0.542 1.021 0.036 0.083 0.089 0.161 0.151 0.229l-1.234 2.25c-0.099 0-0.203 0.016-0.297 0.052-0.464 0.146-0.708 0.604-0.542 1.016 0.172 0.417 0.682 0.63 1.151 0.479 0.464-0.146 0.703-0.604 0.536-1.021-0.047-0.109-0.115-0.208-0.208-0.292l1.203-2.188c0.13 0.010 0.26 0 0.391-0.042 0.104-0.031 0.198-0.083 0.281-0.151 0.464 0.198 0.844 0.354 1.12 0.49 0.406 0.203 0.552 0.339 0.599 0.49 0.042 0.146-0.005 0.427-0.24 0.922-0.172 0.37-0.458 0.896-0.797 1.51-0.115 0-0.229 0.016-0.333 0.052-0.469 0.151-0.708 0.604-0.542 1.021 0.167 0.411 0.682 0.625 1.146 0.479 0.469-0.151 0.708-0.604 0.542-1.021-0.042-0.099-0.104-0.193-0.182-0.271 0.333-0.609 0.62-1.135 0.807-1.526 0.25-0.536 0.38-0.938 0.266-1.323s-0.469-0.635-0.932-0.865c-0.307-0.151-0.693-0.313-1.146-0.505 0.005-0.109-0.010-0.214-0.052-0.318s-0.109-0.198-0.193-0.281l0.703-1.281 3.901 1.682c0.703 0.307 0.995 1.057 0.651 1.682l-2.682 4.906c-0.339 0.625-1.182 0.885-1.885 0.578l-5.516-2.38c-0.703-0.307-0.995-1.057-0.656-1.682l2.682-4.906c0.234-0.432 0.708-0.688 1.208-0.708h0.083z">
|
||||||
|
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
|
</a>
|
||||||
|
<a class="website_link_a" href="https://abonentendeur.guams.fr">
|
||||||
|
<div class="website_link">
|
||||||
|
<span>Visit website</span>
|
||||||
|
<svg width="30"
|
||||||
|
fill="#ffffff"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 576 512">
|
||||||
|
<path
|
||||||
|
d="M288 32c-80.8 0-145.5 36.8-192.6 80.6C48.6 156 17.3 208 2.5 243.7c-3.3 7.9-3.3 16.7 0 24.6C17.3 304 48.6 356 95.4 399.4C142.5 443.2 207.2 480 288 480s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C433.5 68.8 368.8 32 288 32zM144 256a144 144 0 1 1 288 0 144 144 0 1 1 -288 0zm144-64c0 35.3-28.7 64-64 64c-7.1 0-13.9-1.2-20.3-3.3c-5.5-1.8-11.9 1.6-11.7 7.4c.3 6.9 1.3 13.8 3.2 20.7c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3z"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<h2>My Gitea instance</h2>
|
||||||
|
<img class="illustration" src="img/gitea.png" alt="gitea"/>
|
||||||
|
<div class="button_div">
|
||||||
|
<a class="git_button_a" href="https://gitea.guams.fr/Guams">
|
||||||
|
<div class="git_button">
|
||||||
|
<span>Visit website</span>
|
||||||
|
<svg fill="#ffffff"
|
||||||
|
viewBox="0 0 32 32"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="30">
|
||||||
|
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
|
||||||
|
<g id="SVGRepo_tracerCarrier"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"></g>
|
||||||
|
<g id="SVGRepo_iconCarrier">
|
||||||
|
<path
|
||||||
|
d="M5.583 7.229c-2.464-0.005-5.755 1.557-5.573 5.479 0.281 6.125 6.557 6.693 9.068 6.745 0.271 1.146 3.224 5.109 5.411 5.318h9.573c5.74-0.38 10.036-17.365 6.854-17.427-5.271 0.25-8.396 0.375-11.073 0.396v5.297l-0.839-0.365-0.005-4.932c-3.073 0-5.781-0.141-10.917-0.396-0.646-0.005-1.542-0.115-2.5-0.115zM5.927 9.396h0.297c0.349 3.141 0.917 4.974 2.068 7.781-2.938-0.349-5.432-1.198-5.891-4.38-0.24-1.646 0.563-3.365 3.526-3.401zM17.339 12.479c0.198 0.005 0.406 0.042 0.594 0.13l1 0.432-0.714 1.302c-0.109 0-0.219 0.016-0.323 0.052-0.464 0.151-0.708 0.604-0.542 1.021 0.036 0.083 0.089 0.161 0.151 0.229l-1.234 2.25c-0.099 0-0.203 0.016-0.297 0.052-0.464 0.146-0.708 0.604-0.542 1.016 0.172 0.417 0.682 0.63 1.151 0.479 0.464-0.146 0.703-0.604 0.536-1.021-0.047-0.109-0.115-0.208-0.208-0.292l1.203-2.188c0.13 0.010 0.26 0 0.391-0.042 0.104-0.031 0.198-0.083 0.281-0.151 0.464 0.198 0.844 0.354 1.12 0.49 0.406 0.203 0.552 0.339 0.599 0.49 0.042 0.146-0.005 0.427-0.24 0.922-0.172 0.37-0.458 0.896-0.797 1.51-0.115 0-0.229 0.016-0.333 0.052-0.469 0.151-0.708 0.604-0.542 1.021 0.167 0.411 0.682 0.625 1.146 0.479 0.469-0.151 0.708-0.604 0.542-1.021-0.042-0.099-0.104-0.193-0.182-0.271 0.333-0.609 0.62-1.135 0.807-1.526 0.25-0.536 0.38-0.938 0.266-1.323s-0.469-0.635-0.932-0.865c-0.307-0.151-0.693-0.313-1.146-0.505 0.005-0.109-0.010-0.214-0.052-0.318s-0.109-0.198-0.193-0.281l0.703-1.281 3.901 1.682c0.703 0.307 0.995 1.057 0.651 1.682l-2.682 4.906c-0.339 0.625-1.182 0.885-1.885 0.578l-5.516-2.38c-0.703-0.307-0.995-1.057-0.656-1.682l2.682-4.906c0.234-0.432 0.708-0.688 1.208-0.708h0.083z">
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user