Major content updates adding recent projects and school portfolio

This commit is contained in:
Nathan Chapman 2021-06-16 06:50:56 -06:00
parent c98a4749fc
commit c85a355ccd
23 changed files with 176 additions and 53 deletions

0
.gitignore vendored Normal file → Executable file
View File

0
.well-known/keybase.txt Normal file → Executable file
View File

0
images/website_berthume.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 102 KiB

After

Width:  |  Height:  |  Size: 102 KiB

0
images/website_bltc.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 546 KiB

After

Width:  |  Height:  |  Size: 546 KiB

0
images/website_favati.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 89 KiB

After

Width:  |  Height:  |  Size: 89 KiB

0
images/website_jac.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 241 KiB

After

Width:  |  Height:  |  Size: 241 KiB

0
images/website_jhc.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 163 KiB

After

Width:  |  Height:  |  Size: 163 KiB

0
images/website_owlsprit.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 468 KiB

After

Width:  |  Height:  |  Size: 468 KiB

0
images/website_ptdefense.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 150 KiB

After

Width:  |  Height:  |  Size: 150 KiB

0
images/website_wallyworks.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 274 KiB

After

Width:  |  Height:  |  Size: 274 KiB

0
images/workdesk_01.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 182 KiB

After

Width:  |  Height:  |  Size: 182 KiB

0
images/workdesk_02.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 68 KiB

0
images/workdesk_03.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 146 KiB

After

Width:  |  Height:  |  Size: 146 KiB

0
images/workdesk_04.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 95 KiB

After

Width:  |  Height:  |  Size: 95 KiB

0
images/workroom_01.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 103 KiB

After

Width:  |  Height:  |  Size: 103 KiB

0
images/workroom_02.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 84 KiB

After

Width:  |  Height:  |  Size: 84 KiB

0
images/workroom_03.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 62 KiB

After

Width:  |  Height:  |  Size: 62 KiB

0
images/workroom_04.png Normal file → Executable file
View File

Before

Width:  |  Height:  |  Size: 70 KiB

After

Width:  |  Height:  |  Size: 70 KiB

8
index.html Normal file → Executable file
View File

@ -12,14 +12,16 @@
<meta content="Composer for film, games, and other mediums." name="description"> <meta content="Composer for film, games, and other mediums." name="description">
<meta content="music, composer, audio, mixing, mastering, video games, film, classical, soundtrack, soundtracks, " name="keywords"> <meta content="music, composer, audio, mixing, mastering, video games, film, classical, soundtrack, soundtracks, " name="keywords">
<link href="/styles/index.css" rel="stylesheet"> <link href="/styles/normalize.css" rel="stylesheet">
<link href="/styles/index.css?v=2" rel="stylesheet">
</head> </head>
<body> <body>
<header> <header>
<h4>Nathan Chapman</h4> <h4>Nathan Chapman</h4>
<nav> <nav>
<a href="/">Music</a> / <a href="/">Music</a> /
<a href="/websites">Websites</a> <a href="/websites">Websites</a> /
<a href="/school">School</a>
</nav> </nav>
</header> </header>
@ -44,7 +46,7 @@
</main> </main>
<footer> <footer>
<p><small>Copyright ©2021 Nathan Chapman. All rights reserved.</small></p> <p><small>Copyright &copy;2021 Nathan Chapman. All rights reserved.</small></p>
</footer> </footer>
</body> </body>
</html> </html>

0
scripts/index.js Normal file → Executable file
View File

90
styles/index.css Normal file → Executable file
View File

@ -6,8 +6,8 @@ html {
body { body {
max-width: 1024px; max-width: 1024px;
margin: 1em auto; margin: 1rem auto;
padding: 0 3em; padding: 0 3rem;
background-color: #c1c2c0; background-color: #c1c2c0;
color: #323834; color: #323834;
font-family: 'Heebo', sans-serif; font-family: 'Heebo', sans-serif;
@ -27,28 +27,38 @@ p {
margin-bottom: 1.15rem; margin-bottom: 1.15rem;
} }
h1, h2, h3, h4, h5 { h1, h2, h3, h4, h5 {
/*margin: 2.75rem 0 1.05rem;*/ margin: 3rem 0 1.05rem;
margin: 0 0 1.05rem;
font-weight: 800; font-weight: 800;
line-height: 1.15; line-height: 1.15;
} }
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child {
margin-top: 1rem;
}
h1 { h1 {
font-size: 2.488em; font-size: 2.488rem;
} }
h2 { h2 {
font-size: 2.074em; font-size: 2.074rem;
} }
h3 { h3 {
font-size: 1.728em; font-size: 1.728rem;
} }
h4 { h4 {
font-size: 1.44em; font-size: 1.44rem;
}
h3 + h4 {
margin-top: 0;
} }
h5 { h5 {
font-size: 1.2em; font-size: 1.2rem;
} }
small { small {
font-size: 0.833em; font-size: 0.833rem;
} }
a { a {
@ -57,6 +67,15 @@ a {
white-space: nowrap; white-space: nowrap;
} }
dl dt {
font-style: italic;
font-weight: bold;
}
dd + dt {
margin-top: 1.15rem;
}
img { img {
width: 100%; width: 100%;
} }
@ -68,37 +87,54 @@ nav {
section { section {
padding: 1em; padding: 1em;
background-color: #ebebea; background-color: #ebebea;
border: 1px solid #bdc3c7; border: 0.0625rem solid #bdc3c7;
box-shadow: 0 0 4px #bdc3c7; box-shadow: 0 0 0.25rem #bdc3c7;
margin-bottom: 1.3em; margin-bottom: 1.3rem;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
iframe {
margin-bottom: 1rem;
border: 0;
height: 400px;
width: 400px;
}
figure {
margin: 0 0 1rem;
padding: 0;
width: 100%;
}
figure img {
border: 0.0625rem solid #bdc3c7;
}
figure figcaption {
text-align: center;
font-style: italic;
font-size: 0.833rem;
}
.albums-list, .website-list { .albums-list, .website-list {
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
justify-content: space-evenly; justify-content: space-evenly;
} }
iframe {
margin-bottom: 1em;
border: 0;
height: 400px;
width: 400px;
}
.website-list__item { .website-list__item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-width: 400px; max-width: 400px;
margin-bottom: 1em; margin-bottom: 2rem;
font-weight: bold; font-weight: bold;
} }
.website-list__item img { .website-list__item img {
border: 1px solid #c1c2c0; border: 0.0625rem solid #c1c2c0;
} }
@media all and (max-width: 1000px) { @media all and (max-width: 1000px) {
@ -107,7 +143,7 @@ iframe {
} }
.website-list__item { .website-list__item {
max-width: 100%; max-width: 100%;
margin-bottom: 2em; margin-bottom: 2rem;
} }
} }
@ -118,13 +154,13 @@ footer {
} }
@media all and (max-width: 500px) { @media all and (max-width: 600px) {
body { body {
margin: 0; margin: 0;
padding: 3em 0; padding: 1rem 0;
} }
header { header {
padding: 0 1em; padding: 0 1rem;
flex-flow: column; flex-flow: column;
justify-content: space-around; justify-content: space-around;
} }
@ -133,6 +169,6 @@ footer {
} }
.website-list__item { .website-list__item {
max-width: 100%; max-width: 100%;
margin-bottom: 2em; margin-bottom: 2rem;
} }
} }

0
styles/normalize.css vendored Normal file → Executable file
View File

131
websites/index.html Normal file → Executable file
View File

@ -13,14 +13,15 @@
<meta content="websites, web design, custom, simple, fast, clean, html, css, javascript, designer, writer" name="keywords"> <meta content="websites, web design, custom, simple, fast, clean, html, css, javascript, designer, writer" name="keywords">
<link href="/styles/normalize.css" rel="stylesheet"> <link href="/styles/normalize.css" rel="stylesheet">
<link href="/styles/index.css" rel="stylesheet"> <link href="/styles/index.css?v=2" rel="stylesheet">
</head> </head>
<body> <body>
<header> <header>
<h4>Nathan Chapman</h4> <h4>Nathan Chapman</h4>
<nav> <nav>
<a href="/">Music</a> / <a href="/">Music</a> /
<a href="/websites">Websites</a> <a href="/websites">Websites</a> /
<a href="/school">School</a>
</nav> </nav>
</header> </header>
@ -37,62 +38,146 @@
<section> <section>
<h3>Websites</h3> <h3>Websites</h3>
<div class="website-list"> <div class="website-list">
<a class="website-list__item" href="https://blog.monolithofminds.com/">
<img src="/images/website_mom.png">
Monolith of Minds Blog
</a>
<a class="website-list__item" href="https://aylafavati.com/"> <a class="website-list__item" href="https://aylafavati.com/">
Ayla Favati
<img src="/images/website_favati.png"> <img src="/images/website_favati.png">
Ayla Favati
</a> </a>
<a class="website-list__item" href="https://jhcillustration.com/"> <a class="website-list__item" href="https://jhcillustration.com/">
JHC Illustration
<img src="/images/website_jhc.png"> <img src="/images/website_jhc.png">
JHC Illustration
</a> </a>
<a class="website-list__item" href="https://jjayberthumemusic.com/"> <a class="website-list__item" href="https://jjayberthumemusic.com/">
JJay Berthume Music
<img src="/images/website_berthume.png"> <img src="/images/website_berthume.png">
JJay Berthume Music
</a> </a>
<a class="website-list__item" href="http://wallyworks.net/"> <a class="website-list__item" href="http://wallyworks.net/">
Wallyworks Construction
<img src="/images/website_wallyworks.png"> <img src="/images/website_wallyworks.png">
Wallyworks Construction
</a> </a>
<a class="website-list__item" href="https://owlsprit.nathanjchapman.com/"> <a class="website-list__item" href="https://owlsprit.nathanjchapman.com/">
Owl Sprit Cafe
<img src="/images/website_owlsprit.png"> <img src="/images/website_owlsprit.png">
Owl Sprit Cafe
</a> </a>
<a class="website-list__item" href="https://bltc.nathanjchapman.com/"> <a class="website-list__item" href="https://bltc.nathanjchapman.com/">
Better Living Coffee
<img src="/images/website_bltc.png"> <img src="/images/website_bltc.png">
Better Living Coffee
</a> </a>
<a class="website-list__item" href="http://ptdefense.com/"> <a class="website-list__item" href="http://ptdefense.com/">
PT Defense
<img src="/images/website_ptdefense.png"> <img src="/images/website_ptdefense.png">
PT Defense
</a> </a>
<a class="website-list__item" href="http://jac.nathanjchapman.com/"> <a class="website-list__item" href="http://jac.nathanjchapman.com/">
JAC Defenders
<img src="/images/website_jac.png"> <img src="/images/website_jac.png">
JAC Defenders
</a> </a>
</div> </div>
</section> </section>
<section> <section>
<h3>Web Apps</h3> <h3>Web Apps</h3>
<h4>Workroom</h4> <dl>
<p>Timecards and labor tracking</p> <dd>
<img src="/images/workroom_01.png"> <a href="#btech-time-tracker">BTech Time Tracker</a>
<img src="/images/workroom_02.png"> </dd>
<img src="/images/workroom_03.png"> <dd>
<img src="/images/workroom_04.png"> <a href="#workdesk">Workdesk</a>
<hr> </dd>
<h4>Workdesk</h4> <dd>
<a href="#btech-cna-charting">BTech CNA Charting</a>
</dd>
<dd>
<a href="#workroom">Workroom</a>
</dd>
</dl>
<h4 id="btech-time-tracker">BTech Time Tracker</h4>
<p>Track and manage sessions</p>
<figure>
<img src="/images/time_home.png">
<figcaption>Welcome page</figcaption>
</figure>
<figure>
<img src="/images/time_profile.png">
<figcaption>Student profile and recent activity</figcaption>
</figure>
<figure>
<img src="/images/time_log.png">
<figcaption>Past sessions (pagination)</figcaption>
</figure>
<figure>
<img src="/images/time_scan.png">
<figcaption>Scan a QR code to clock in</figcaption>
</figure>
<figure>
<img src="/images/time_instructor.png">
<figcaption>Instructor home page shows activity for department</figcaption>
</figure>
<h4 id="workdesk">Workdesk</h4>
<p>Shift assignments and preferences</p> <p>Shift assignments and preferences</p>
<img src="/images/workdesk_01.png"> <figure>
<img src="/images/workdesk_02.png"> <img src="/images/wd_home.png">
<img src="/images/workdesk_03.png"> <figcaption>All shifts</figcaption>
<img src="/images/workdesk_04.png"> </figure>
<figure>
<img src="/images/wd_filter.png">
<figcaption>Type to filter shifts</figcaption>
</figure>
<figure>
<img src="/images/wd_detail.png">
<figcaption>See employee details</figcaption>
</figure>
<figure>
<img src="/images/wd_sort.png">
<figcaption>Employee can sort their shift preferences</figcaption>
</figure>
<h4 id="btech-cna-charting">BTech CNA Charting</h4>
<p>Certified Nurse Assistant Charting Application</p>
<figure>
<img src="/images/cna_form.png" alt="">
<figcaption>Easily input the chart info</figcaption>
</figure>
<figure>
<img src="/images/cna_save.png" alt="">
<figcaption>Data is saved automatically</figcaption>
</figure>
<figure>
<img src="/images/cna_detail.png" alt="">
<figcaption>View chart details</figcaption>
</figure>
<figure>
<img src="/images/cna_pdf.png" alt="">
<figcaption>Produce PDF of chart for print</figcaption>
</figure>
<h4 id="workroom">Workroom</h4>
<p>Timecards and labor tracking</p>
<figure>
<img src="/images/workroom_01.png">
<figcaption>Employee timecard</figcaption>
</figure>
<figure>
<img src="/images/workroom_02.png">
<figcaption>Input daily tasks</figcaption>
</figure>
<figure>
<img src="/images/workroom_03.png">
<figcaption>Manage projects for consistent naming</figcaption>
</figure>
<figure>
<img src="/images/workroom_04.png">
<figcaption>See and edit task details</figcaption>
</figure>
</div> </div>
</section> </section>
</article> </article>
</main> </main>
<footer> <footer>
<p><small>Copyright ©2021 Nathan Chapman. All rights reserved.</small></p> <p><small>Copyright &copy;2021 Nathan Chapman. All rights reserved.</small></p>
</footer> </footer>
</body> </body>
</html> </html>