font size improvements

This commit is contained in:
lukas-heiligenbrunner 2020-03-16 19:47:15 +01:00
parent f8c2114358
commit 59faacff6e
2 changed files with 48 additions and 8 deletions

View File

@ -16,10 +16,50 @@ body, html {
color: white; color: white;
} }
#nameText { .lightOpacity{
opacity: 0.6;
}
.bigText{
transition-delay: 200ms; transition-delay: 200ms;
font-family: 'Helvetica Neue', fantasy; font-family: 'Helvetica Neue', fantasy;
font-size: 40pt;
-webkit-font-smoothing: antialiased -webkit-font-smoothing: antialiased
/* todo here!*/ /* todo here!*/
}
#preTitle{
opacity: 0.8;
}
/* screen larger than 600px -- desktop */
@media screen and (min-width: 601px) {
#preTitle{
font-size: 35px;
}
#titleText {
font-size: 80px;
}
#subTitleText{
font-size: 50px;
}
#meaningFullSentence{
width: 40%;
}
}
/* Screen smaller than 600px -- mobile */
@media screen and (max-width: 600px) {
#preTitle{
font-size: 15px;
}
#titleText {
font-size: 30px;
}
#subTitleText{
font-size: 20px;
}
#meaningFullSentence{
width: 100%;
font-size: 13px;
}
} }

View File

@ -58,13 +58,13 @@
<div id="section1" class="tile"> <div id="section1" class="tile">
<div class="container"> <div class="container">
<div> <div>
<h5>Hey, my name is</h5> <div id="preTitle">Hey, my name is</div>
<a id="nameText">Lukas Heiligenbrunner</a> <div class="bigText" id="titleText">Lukas Heiligenbrunner</div>
<h2 style="opacity: 0.6">A creative Student</h2> <div class="bigText lightOpacity" id="subTitleText">A creative IT Student</div>
<a style="opacity: 0.6"> <p id="meaningFullSentence" class="lightOpacity">
I'm a software engineer based in Austria who loves to <br> I'm a software engineer based in Austria who loves to
develop code and is always open for new projects. develop code and is always open for new projects.
</a> </p>
</div> </div>
</div> </div>
</div> </div>