Site upgrade, modified icons
Andrea Foletto
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 63 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 38 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 38 KiB |
@ -10,7 +10,7 @@
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="hello-world">
|
||||
<span>$ </span><span id="command">echo "Hello world!"</span><span id="pipe">|</span>
|
||||
<div id="command">$ echo "Hello world!"<span id="pipe">|</span></div>
|
||||
</div>
|
||||
<div>
|
||||
<nav id="links-nav" id="social-icons">
|
||||
|
||||
@ -1,31 +1,46 @@
|
||||
|
||||
* {}
|
||||
* {
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #1b263b;
|
||||
|
||||
background-color: #202020;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
justify-items: center;
|
||||
margin: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#container {
|
||||
display: block;
|
||||
width: auto;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
#hello-world {
|
||||
color: #e0e1dd;
|
||||
font-size: 7vh;
|
||||
color: #d6d6d6;
|
||||
font-family: 'Fira Mono', monospace;
|
||||
letter-spacing: -7px;
|
||||
-moz-text-size-adjust: auto;
|
||||
min-height: 4vh;
|
||||
width: 100%;
|
||||
max-height: 100px;
|
||||
text-align: center;
|
||||
max-width: 100%;
|
||||
min-width: 620px;
|
||||
}
|
||||
|
||||
#command {
|
||||
width: 100%;
|
||||
max-height: 100px;
|
||||
font-size: 5vw;
|
||||
animation: linear;
|
||||
}
|
||||
|
||||
#pipe {
|
||||
animation: animate 1.5s linear infinite;
|
||||
animation: animate 1.5s linear infinite alternate;
|
||||
max-height: 1vh;
|
||||
}
|
||||
|
||||
@keyframes animate{
|
||||
@ -44,6 +59,8 @@ body {
|
||||
}
|
||||
|
||||
.social-icon {
|
||||
max-height: 32px;
|
||||
max-width: 32px;
|
||||
max-height: 5vh;
|
||||
max-width: 5vw;
|
||||
min-height: 24px;
|
||||
min-width: 24px;
|
||||
}
|
||||