add brand as link; adjust typography

master
Ayush Mukherjee 4 years ago
parent cf653aad2b
commit 3c39eea48c

@ -1,6 +1,6 @@
<template>
<header>
<div class="brand">
<a href="https://ayushm.com" class="brand">
<div class="logo">
<img src="@/assets/logo.png" alt="Ayush M. Logo" width="60px" height="60px">
</div>
@ -8,9 +8,9 @@
<span>Ayush</span>
<span>Mukherjee.</span>
</div>
</div>
</a>
<nav>
<router-link class="active" to="#work">work</router-link>
<router-link to="#work">work</router-link>
<router-link to="#about">about</router-link>
<router-link to="#skills">skills</router-link>
<router-link to="#contact">contact</router-link>

@ -21,7 +21,7 @@ body {
}
p {
letter-spacing: 0.005em;
letter-spacing: 0.01em;
line-height: 1.6em;
}

@ -1,19 +1,22 @@
header {
padding: 60px 120px;
padding: 40px 90px 40px 120px;
display: flex;
justify-content: space-between;
align-items: center;
.brand {
display: flex;
justify-content: space-between;
align-items: center;
width: 210px;
padding: 20px 30px 20px 30px;
font-size: $font-brand;
color: $fg;
text-decoration: none;
transition: 0.2s ease-in-out;
.logo {
width: 60px;
height: 60px;
margin-right: 10px;
}
.name {
@ -21,6 +24,10 @@ header {
flex-direction: column;
font-weight: $font-bold;
}
&:hover {
background: darken($bg, 4%);
}
}
nav {

Loading…
Cancel
Save