Fix responsiveness on mobile

This commit is contained in:
alex 3
2023-06-19 15:55:33 -04:00
parent dce7268509
commit a2484a3d15
5 changed files with 19 additions and 13 deletions
+7 -3
View File
@@ -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
View File
@@ -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
View File
@@ -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
View File
@@ -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
View File
@@ -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">