Fix responsiveness on mobile
This commit is contained in:
+7
-3
@@ -33,18 +33,20 @@ a:hover {
|
||||
@media only screen and (max-width:700px) {
|
||||
#container {
|
||||
height:100vh;
|
||||
padding-top:50px;
|
||||
padding-top:0;
|
||||
}
|
||||
}
|
||||
|
||||
#intro {
|
||||
width:40%;
|
||||
/* width:40%; */
|
||||
color:white;
|
||||
text-align:center;
|
||||
padding-top:50px;
|
||||
}
|
||||
|
||||
#navtype {
|
||||
color:white;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card {
|
||||
@@ -95,6 +97,7 @@ a:hover {
|
||||
|
||||
#footer {
|
||||
text-align:center;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
|
||||
#notice {
|
||||
@@ -140,6 +143,7 @@ a:hover {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
/* height: 100vh; */
|
||||
/* width:50vw; */
|
||||
flex-direction: column;
|
||||
}
|
||||
+2
-2
@@ -13,7 +13,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="container" class="center">
|
||||
<div id="intro">
|
||||
<div id="intro" style="white-space: nowrap; text-align:center;">
|
||||
<h1>lets get in touch</h1>
|
||||
<p>reach out to me below or via <a href="mailto:hello@thatalex.dev">hello@thatalex.dev</a></p>
|
||||
</div>
|
||||
@@ -49,7 +49,7 @@
|
||||
<br />
|
||||
<div id="footer">
|
||||
<div id="socials">
|
||||
<a href="https://twitter.com/zstreamss" target="_blank" rel="noreferrer">
|
||||
<a href="https://twitter.com/avvex__" target="_blank" rel="noreferrer">
|
||||
<i class="fa-brands fa-twitter" style="font-size:30px;"></i>
|
||||
</a>
|
||||
<a href="https://linkedin.com/in/thatalex" target="_blank" rel="noreferrer">
|
||||
|
||||
+1
-1
@@ -81,7 +81,7 @@
|
||||
<div id="container">
|
||||
<h1 id="header">something's not quite right..</h1>
|
||||
<p class="error-message">that page doesn't exist. how'd you get here?<br />
|
||||
<a href="#" onclick="history.back()">lets head back now.</a></p>
|
||||
<a href="#" onclick="history.back()" style="text-decoration:underline;">lets head back now.</a></p>
|
||||
<div id="socials" class="error-message">
|
||||
<a href="https://twitter.com/zstreamss" target="_blank" rel="noreferrer">
|
||||
<i class="fa-brands fa-twitter"></i>
|
||||
|
||||
+2
-2
@@ -13,7 +13,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="container" class="center">
|
||||
<div id="intro">
|
||||
<div id="intro" style="width:50vw;">
|
||||
<h1>hi, i'm alex!</h1>
|
||||
<p>i'm part-time QA Manual Testing + Automation at <a href="https://medal.tv">Medal.tv</a> and a full-time Node.js, Go and Kotlin geek</p>
|
||||
</div>
|
||||
@@ -33,7 +33,7 @@
|
||||
<br />
|
||||
<div id="footer">
|
||||
<div id="socials">
|
||||
<a href="https://twitter.com/zstreamss" target="_blank" rel="noreferrer">
|
||||
<a href="https://twitter.com/avvex__" target="_blank" rel="noreferrer">
|
||||
<i class="fa-brands fa-twitter" style="font-size:30px;"></i>
|
||||
</a>
|
||||
<a href="https://linkedin.com/in/thatalex" target="_blank" rel="noreferrer">
|
||||
|
||||
+5
-3
@@ -12,7 +12,7 @@
|
||||
<title>alex! - projects</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container" class="center">
|
||||
<div id="container">
|
||||
<div id="intro">
|
||||
<h1>what do i work on?</h1>
|
||||
<p>a lot of random stuff. i mean, like, a lot.</p>
|
||||
@@ -20,7 +20,7 @@
|
||||
|
||||
<br />
|
||||
|
||||
<div id="cards">
|
||||
<div id="cards" class="center">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h1>pause!</h1>
|
||||
@@ -53,8 +53,10 @@
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<span style="text-align:center;">
|
||||
<h1 style="color:white;">..and more!</h1>
|
||||
<p style="color:white">you can see all of my projects on my <a href="https://github.com/azpha" target="_blank">GitHub page</a></p>
|
||||
</span>
|
||||
|
||||
<!-- br to space, fite me -->
|
||||
<br />
|
||||
@@ -71,7 +73,7 @@
|
||||
<br />
|
||||
<div id="footer">
|
||||
<div id="socials">
|
||||
<a href="https://twitter.com/zstreamss" target="_blank" rel="noreferrer">
|
||||
<a href="https://twitter.com/avvex__" target="_blank" rel="noreferrer">
|
||||
<i class="fa-brands fa-twitter" style="font-size:30px;"></i>
|
||||
</a>
|
||||
<a href="https://linkedin.com/in/thatalex" target="_blank" rel="noreferrer">
|
||||
|
||||
Reference in New Issue
Block a user