nathanwoodburn/Nathanwoodburn.github.io
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Update print layout to make resume display nicer
All checks were successful
Build Docker / BuildImage (push) Successful in 32s
Details

Browse Source
This commit is contained in:
Nathan Woodburn 2024-12-03 14:00:39 +11:00
parent 1551799b88
commit 70655a4d39
Signed by: nathanwoodburn
GPG Key ID: 203B000478AD0EF1
2 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/assets/css/resume.min.css vendored
View File

@ -1 +1 @@
.profile-container{height:170px;width:170px;z-index:2;left:10%}.title{position:absolute;margin-left:calc(100px);width:calc(100% - 100px);padding:1em;margin-top:-225px;z-index:0}.title>*{width:100%;margin-bottom:0}img.profile{left:10px;width:150px;position:absolute;aspect-ratio:1;transform:scale(1);transition:.5s;z-index:2}img.background2{left:0;width:170px!important;margin-top:-10px;pointer-events:none;z-index:1}img.foreground{border-radius:50%;pointer-events:none;z-index:3}img.background:hover,img.backgroundsml:hover{filter:blur(5px)}.spacer{height:100px}img.profilesml{width:150px;position:absolute;left:50%;margin-left:-75px;aspect-ratio:1;padding-top:calc(var(--s)/5);transform:scale(1);transition:.5s}img.foregroundsml{border-radius:50%;pointer-events:none}img.background2sml{width:170px!important;left:calc(50% - 10px);margin-top:-10px;pointer-events:none;z-index:0}@media print{.noprintbreak{page-break-inside:avoid}*{color:#000}} .profile-container{height:170px;width:170px;z-index:2;left:10%}.title{position:absolute;margin-left:calc(100px);width:calc(100% - 100px);padding:1em;margin-top:-225px;z-index:0}.title>*{width:100%;margin-bottom:0}img.profile{left:10px;width:150px;position:absolute;aspect-ratio:1;transform:scale(1);transition:.5s;z-index:2}img.background2{left:0;width:170px!important;margin-top:-10px;pointer-events:none;z-index:1}img.foreground{border-radius:50%;pointer-events:none;z-index:3}img.background:hover,img.backgroundsml:hover{filter:blur(5px)}.spacer{height:100px}img.profilesml{width:150px;position:absolute;left:50%;margin-left:-75px;aspect-ratio:1;padding-top:calc(var(--s)/5);transform:scale(1);transition:.5s}img.foregroundsml{border-radius:50%;pointer-events:none}img.background2sml{width:170px!important;left:calc(50% - 10px);margin-top:-10px;pointer-events:none;z-index:0}@media print{.noprintbreak{page-break-inside:avoid}*{color:#000;background-color:#fff}body{background-color:#fff}.hideprint{display:none}}

4
templates/resume.html
View File

@ -38,14 +38,14 @@
<body style="width: 90%;margin-left: 5%;margin-right: 5%;"> <body style="width: 90%;margin-left: 5%;margin-right: 5%;">
<div class="d-none d-lg-inline d-xl-inline d-xxl-inline"> <div class="d-none d-lg-inline d-xl-inline d-xxl-inline">
<div class="profile-container" style="margin-top: 5em;margin-bottom: 5em;"><img class="profile background2" src="/assets/img/orange.webp" style="border-radius: 50%;" alt=""><img class="profile background" src="/assets/img/profile.jpg" style="border-radius: 50%;" alt="Profile Photo"><img class="profile foreground" src="/assets/img/pfront.webp" alt=""></div> <div class="profile-container" style="margin-top: 5em;margin-bottom: 5em;"><img class="profile background2" src="/assets/img/orange.webp" style="border-radius: 50%;" alt=""><img class="profile background" src="/assets/img/profile.jpg" style="border-radius: 50%;" alt="Profile Photo"><img class="profile foreground hideprint" src="/assets/img/pfront.webp" alt=""></div>
<div class="title" style="text-align: right;background: #b54c00;"> <div class="title" style="text-align: right;background: #b54c00;">
<h1>Nathan Woodburn</h1> <h1>Nathan Woodburn</h1>
<p>IT Enthusiast &amp; Student | <a href="https://nathan.woodburn.au"><span style="color: rgb(195, 247, 227);">https://nathan.woodburn.au</span></a>&nbsp;| <a href="mailto:contact@nathan.woodburn.au"><span style="color: rgb(195, 247, 227);">contact@nathan.woodburn.au</span></a></p> <p>IT Enthusiast &amp; Student | <a href="https://nathan.woodburn.au"><span style="color: rgb(195, 247, 227);">https://nathan.woodburn.au</span></a>&nbsp;| <a href="mailto:contact@nathan.woodburn.au"><span style="color: rgb(195, 247, 227);">contact@nathan.woodburn.au</span></a></p>
</div> </div>
</div> </div>
<div class="d-lg-none d-xl-none d-xxl-none"> <div class="d-lg-none d-xl-none d-xxl-none">
<div class="profile-container" style="margin-top: 5em;"><img class="profilesml background2sml" src="/assets/img/orange.webp" style="border-radius: 50%;width: 150px;" alt=""><img class="profilesml backgroundsml" src="/assets/img/profile.jpg" style="border-radius: 50%;width: 150px;" alt="Profile Photo"><img class="profilesml foregroundsml" src="/assets/img/pfront.webp" style="width: 150px;" alt=""></div> <div class="profile-container" style="margin-top: 5em;"><img class="profilesml background2sml" src="/assets/img/orange.webp" style="border-radius: 50%;width: 150px;" alt=""><img class="profilesml backgroundsml" src="/assets/img/profile.jpg" style="border-radius: 50%;width: 150px;" alt="Profile Photo"><img class="profilesml foregroundsml hideprint" src="/assets/img/pfront.webp" style="width: 150px;" alt=""></div>
<div style="text-align: center;"> <div style="text-align: center;">
<h1 style="margin-bottom: 0px;">Nathan Woodburn</h1> <h1 style="margin-bottom: 0px;">Nathan Woodburn</h1>
<p>IT Enthusiast &amp; Student<br><a href="https://nathan.woodburn.au" target="_blank">https://nathan.woodburn.au</a></p> <p>IT Enthusiast &amp; Student<br><a href="https://nathan.woodburn.au" target="_blank">https://nathan.woodburn.au</a></p>