Skip to content

Commit

Permalink
Glowup
Browse files Browse the repository at this point in the history 
Goodbye Bootstrap, hello PicoCSS
  • Loading branch information
@acoreynews
acoreynews committed Jan 17, 2025
1 parent dac3c4b commit 0f4a107
Show file tree
Hide file tree
Showing 3 changed files with 107 additions and 154 deletions.
108 changes: 52 additions & 56 deletions bio.html
View file
Original file line number Diff line number Diff line change
@@ -1,60 +1,56 @@

<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<title>Alexander S. Corey</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>

<style>
.vertical-center {
min-height: 75%;
min-height: 75vh;

display: flex;
align-items: center;
}
</style>

<body>


<nav class="navbar navbar-expand-sm bg-info navbar-dark justify-content-center sticky-top">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="bio.html">About me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="static/AlexCoreyResume.pdf" target="_blank" rel="noopener noreferrer">Resume</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/acoreynews" target="_blank" rel="noopener noreferrer">Github</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://linkedin.com/in/alexander-s-corey" target="_blank" rel="noopener noreferrer">Linkedin</a>
</li>
<head>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="dark" />
<link rel="stylesheet" href="css/pico.min.css" />
<style>
/* Reduce the container width */
.container {
max-width: 800px; /* Adjust the value to your desired width */
}
</style>
<title>Alexander S. Corey</title>
</head>
<body>
<main class="container">


<nav>
<ul>
<li><a href="index.html">Alexander S. Corey</a></li>
</ul>
<ul>
<li><a href="#">About Me</a></li>
<li><a href="AlexCoreyResume.pdf" target="_blank" class="contrast">Resume</a></li>
<li><a href="https://github.com/acoreynews" target="_blank" class="contrast">GitHub</a></li>
<li><a href="https://www.linkedin.com/in/alexander-s-corey" target="_blank" class="contrast">LinkedIn</a></li>
</ul>
</nav>

<div class="col-sm-2 mx-auto">
<div class="container vertical-center">
<div class="card" style="width:500px;">
<img class="card-img-top" src="images/redrock.jpg" alt="Photo of Alex" style="width:100%">
<div class="card-body">
<h4 class="card-title">Alexander S. Corey</h4>
<p class="card-text">I'm an engineer interested in python, devops, data and news media. <br>For the past 8 years, I've worked in network operations center engineer roles across three companies. <br>Prior to that, I worked as a journalist in San Diego, Phoenix and Las Vegas before going back to school for computer science and beginning a career in IT.</p>
</div>
</div>
<br>
</div>

</body>
</html>

<figure>
<img
src="images/JamsilStadium.jpg"
alt="Picture of Alex here"
/>
<figcaption>
Alex at Jamsil Baseball Stadium in Seoul, South Korea
</figcaption>
</figure>


<blockquote>
“I'm an engineer interested in python, devops, data and news media. <br>For the past 8 years, I've worked in network operations center engineer roles across three companies. <br>Prior to that, I worked as a journalist in San Diego, Phoenix and Las Vegas before going back to school for computer science and beginning a career in IT.”

</blockquote>

</main>

</body>
</html>
Binary file modified images/JamsilStadium.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
153 changes: 55 additions & 98 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,109 +1,66 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<title>Alexander S. Corey</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<style>
body {
font-family: Helvetica;
background-color: #f8f9fa;
color: #333;
}
.navbar {
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
<head>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="dark" />
<link rel="stylesheet" href="css/pico.min.css" />
<style>
/* Reduce the container width */
.container {
max-width: 800px; /* Adjust the value to your desired width */
}
</style>
<title>Alexander S. Corey</title>
</head>
<body>
<main class="container">


.footer {
text-align: center;
padding: 20px;
background-color: #17a2b8;
color: white;
margin-top: 20px;
}
</style>
<body>

<div class="container">
<body>


<div class="container text-center p-3 my-3 text-white">
<nav>
<ul>
<li><a href="#">Alexander S. Corey</a></li>
</ul>
<ul>
<li><a href="bio.html">About Me</a></li>
<li><a href="AlexCoreyResume.pdf" target="_blank" class="contrast">Resume</a></li>
<li><a href="https://github.com/acoreynews" target="_blank" class="contrast">GitHub</a></li>
<li><a href="https://www.linkedin.com/in/alexander-s-corey" target="_blank" class="contrast">LinkedIn</a></li>
</ul>
</nav>

<h1 class="display-1"><span style="color:#17a2b8;font-weight: bold;">Alexander S. Corey</span></h1>

<h2 class="display-4"><small><span style="color:#17a2b8">Engineer</span></small></h2>
</div>
<article data-theme="dark">
<details open>
<summary><a href="Python.html" target="_blank" class="contrast">Class Scores (Python)</a></summary>
<p>A Python program that reads a specifically formatted csv file
for an instructor's student grades and creates a web page
with the scores.</p>
</details>
</article>

<nav class="navbar navbar-expand-sm bg-info navbar-dark sticky-top">
<div class="container">
<ul class="navbar-nav mx-auto">
<li class="nav-item active">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="bio.html">About me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="static/AlexCoreyResume.pdf" target="_blank" rel="noopener noreferrer">Resume</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/acoreynews" target="_blank" rel="noopener noreferrer">Github</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://linkedin.com/in/alexander-s-corey" target="_blank" rel="noopener noreferrer">Linkedin</a>
</li>
</ul>
</div>
</nav>
<article data-theme="dark">
<details open>
<summary><a href="RubyScrabble.html" target="_blank" class="contrast">Scrabble word score (Ruby)</a></summary>
<p>A Ruby program that calculates a Scrabble word score.</p>
</details>
</article>

<article data-theme="dark">
<details open>
<summary><a href="WeatherCalculatorCPP.html" target="_blank" class="contrast">Weather Calculator (C++)</a></summary>
<p>A C++ program that prompts the user to input three weather-related values and outputs the wind chill factor and heat index.</p>
</details>
</article>

<div class="container text-center my-4">
<img class="img-fluid rounded" src="images/JamsilStadium.jpg" alt="Picture of Alex here">

<p class="mt-2">Alex at Jamsil Baseball Stadium in Seoul, South Korea</p>
</div>


<div class="container p-3 my-3 text-black">
<h1 class="display-3 text-center"><span style="font-weight:bold">Projects</span></h1></br>
<div class="card-columns">
<div class="card bg-primary">
<div class="card-body text-center">
<a href="Python.html" target="_blank" rel="noopener noreferrer"><span style="color:white;font-size:20px">Final grade webpage generator</br>(Python)</span></a>
</div>
</div>
<div class="card bg-danger">
<div class="card-body text-center">
<a href="Ruby.html" target="_blank" rel="noopener noreferrer"><span style="color:white;font-size:20px">Final grade webpage generator</br>(Ruby)</span></a>
</div>
</div>
<div class="card bg-danger">
<div class="card-body text-center">
<a href="RubyScrabble.html" target="_blank" rel="noopener noreferrer"><span style="color:white;font-size:20px">Scrabble score calculator</br>(Ruby)</span></a>
</div>
</div>
<div class="card bg-warning">
<div class="card-body text-center">
<a href="NumberOperations.html" target="_blank" rel="noopener noreferrer"><span style="color:white;font-size:20px">Number operations program</br>(C++)</span></a>
</div>
</div>
<div class="card bg-warning">
<div class="card-body text-center">
<a href="WeatherCalculatorCPP.html" target="_blank" rel="noopener noreferrer"><span style="color:white;font-size:20px">Weather calculator</br>(C++ 14)</span></a>
</div>
</div>
</div>
</div>
</main>

<footer class="footer">
<p>&copy; 2025 Alexander S. Corey </p>
</footer>
</body>
</div>
</html>
</body>
</html>

0 comments on commit 0f4a107

Please sign in to comment.