edpibu/Web
edpibu/Web
Archived
1
Fork 0
Code Issues Pull requests Releases 7 Activity

Added icons to nav links

Browse source
This commit is contained in:
Edgar P. Burkhart 2021-12-28 15:30:40 +01:00
parent de1c65e39a
commit 6fcc7bef33
Signed by: edpibu
GPG key ID: 9833D3C5A25BD227
10 changed files with 75 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/cv/index.html
View file

@ -22,10 +22,22 @@
<strong>Burkhart</strong> <strong>Burkhart</strong>
</h1> </h1>
<nav> <nav>
<a href="/">edgarpierre.fr</a> <a href="/">
<a href="mailto:contact@edgarpierre.fr">contact@edgarpierre.fr</a> edgarpierre.fr
<a href="https://git.edgarpierre.fr/edpibu">git.edgarpierre.fr/edpibu</a> <img class="svg" src="/static/svg/home.svg" />
<a href="https://github.com/edpiburkhart">github(edpiburkhart)</a> </a>
<a href="mailto:contact@edgarpierre.fr">
contact@edgarpierre.fr
<img class="svg" src="/static/svg/email.svg" />
</a>
<a href="https://git.edgarpierre.fr/edpibu">
git.edgarpierre.fr/edpibu
<img class="svg" src="/static/svg/code.svg" />
</a>
<a href="https://github.com/edpiburkhart">
github(edpiburkhart)
<img class="svg" src="/static/svg/logo--github.svg" />
</a>
</nav> </nav>
<div class="content"> <div class="content">

30
src/index.html
View file

@ -33,12 +33,30 @@
</a> </a>
</div> </div>
<nav> <nav>
<a href="#">edgarpierre.fr</a> <a href="#">
<a href="mailto:contact@edgarpierre.fr">contact@edgarpierre.fr</a> edgarpierre.fr
<a href="https://git.edgarpierre.fr/edpibu">git.edgarpierre.fr/edpibu</a> <img class="svg" src="/static/svg/home.svg" />
<a href="https://github.com/edpiburkhart">github(edpiburkhart)</a> </a>
<a href="https://www.komoot.fr/user/383887346799">komoot(edpibu)</a> <a href="mailto:contact@edgarpierre.fr">
<a href="https://www.last.fm/user/edpiburkhart">last.fm(edpiburkhart)</a> contact@edgarpierre.fr
<img class="svg" src="/static/svg/email.svg" />
</a>
<a href="https://git.edgarpierre.fr/edpibu">
git.edgarpierre.fr/edpibu
<img class="svg" src="/static/svg/code.svg" />
</a>
<a href="https://github.com/edpiburkhart">
github(edpiburkhart)
<img class="svg" src="/static/svg/logo--github.svg" />
</a>
<a href="https://www.komoot.fr/user/383887346799">
komoot(edpibu)
<img class="svg" src="/static/svg/mountain.svg" />
</a>
<a href="https://www.last.fm/user/edpiburkhart">
last.fm(edpiburkhart)
<img class="svg" src="/static/svg/music.svg" />
</a>
</nav> </nav>
</body> </body>
</html> </html>

2
src/static/css/index.css
View file

@ -7,7 +7,7 @@
} }
.biglinks a>.svg { .biglinks a>.svg {
width: 64px; height: 64px;
margin-top: 12px; margin-top: 12px;
margin-bottom: 32px; margin-bottom: 32px;
display: block; display: block;

8
src/static/css/main.css
View file

@ -76,7 +76,8 @@ nav {
a { a {
display: inline-block; display: inline-block;
line-height: 24px; font-size: 1rem;
line-height: 20px;
padding: 12px 24px; padding: 12px 24px;
margin: 12px; margin: 12px;
@ -95,6 +96,11 @@ a:active {
a:focus { a:focus {
border: 2px solid white; border: 2px solid white;
} }
nav a img {
height: 20px;
vertical-align: middle;
margin-left: 12px;
}
ul { ul {
list-style-type: square; list-style-type: square;

1
src/static/svg/code.svg Normal file
View file

@ -0,0 +1 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>code</title><polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/><polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/><rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32" transform="translate(0 32) rotate(-90)"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 533 B

1
src/static/svg/email.svg Normal file
View file

@ -0,0 +1 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>email</title><path d="M28,6H4A2,2,0,0,0,2,8V24a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V8A2,2,0,0,0,28,6ZM25.8,8,16,14.78,6.2,8ZM4,24V8.91l11.43,7.91a1,1,0,0,0,1.14,0L28,8.91V24Z" transform="translate(0)"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 440 B

11
src/static/svg/home.svg Normal file
View file

@ -0,0 +1,11 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<defs>
<style>
.cls-1 {
fill: none;
}
</style>
</defs>
<rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/>
<path d="M16.6123,2.2138a1.01,1.01,0,0,0-1.2427,0L1,13.4194l1.2427,1.5717L4,13.6209V26a2.0041,2.0041,0,0,0,2,2H26a2.0037,2.0037,0,0,0,2-2V13.63L29.7573,15,31,13.4282ZM18,26H14V18h4Zm2,0V18a2.0023,2.0023,0,0,0-2-2H14a2.002,2.002,0,0,0-2,2v8H6V12.0615l10-7.79,10,7.8005V26Z" transform="translate(0 0)"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 610 B

1
src/static/svg/logo--github.svg Normal file
View file

@ -0,0 +1 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><defs><style>.cls-1{fill-rule:evenodd;}.cls-2{fill:none;}</style></defs><title>logo--github</title><path class="cls-1" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-2" width="32" height="32"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 809 B

12
src/static/svg/mountain.svg Normal file
View file

@ -0,0 +1,12 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<defs>
<style>
.cls-1 {
fill: none;
}
</style>
</defs>
<title>mountain</title>
<path d="M27.6343,26,17.7888,5.1055a2,2,0,0,0-3.5879.021L4.3657,26H2v2H30V26ZM15.99,5.979,20.9473,16.5,19,17.7979l-3-2-3,2-1.9551-1.3033ZM10.1846,18.3247,13,20.2021l3-2,3,2,2.8091-1.873L25.4233,26H6.5752Z"/>
<rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 542 B

1
src/static/svg/music.svg Normal file
View file

@ -0,0 +1 @@
<svg id="icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>music</title><path d="M25,4H10A2.002,2.002,0,0,0,8,6V20.5563A3.9551,3.9551,0,0,0,6,20a4,4,0,1,0,4,4V12H25v8.5562A3.9545,3.9545,0,0,0,23,20a4,4,0,1,0,4,4V6A2.0023,2.0023,0,0,0,25,4ZM6,26a2,2,0,1,1,2-2A2.0023,2.0023,0,0,1,6,26Zm17,0a2,2,0,1,1,2-2A2.0027,2.0027,0,0,1,23,26ZM10,6H25v4H10Z"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 555 B