jessebot/tiny_personal_website
1
0
Fork 0
mirror of https://github.com/jessebot/tiny_personal_website.git synced 2025-10-01 01:48:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixing centering of icons and the way the corner ear folds over

Browse source
This commit is contained in:
JesseBot 2022-10-06 14:04:53 +02:00
parent 66d9d5f116
commit bef97b0123
4 changed files with 95 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

94
static/css/main.css
View file

@ -67,8 +67,8 @@ h5 {
.main-img {
box-shadow: 0 6px 12px rgba(0,0,0,.175);
margin-top: 17px;
margin-bottom: 17px;
margin-top: 18px;
margin-bottom: 11px;
border-radius: 80px;
-moz-border-radius: 4px;
border: 1px solid #3d3d3d;
@ -86,9 +86,9 @@ h5 {
background-color: #3d3d3d;
color: white;
width: 25rem;
border: 1px solid #3d3d3d;
border-radius: 4px;
-moz-border-radius: 4px;
border: 1px solid #3d3d3d;
-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
box-shadow: 0 6px 12px rgba(0,0,0,.175);
-moz-box-shadow: 0 6px 12px rgba(0,0,0,.175);
@ -104,15 +104,6 @@ h5 {
box-shadow: 3px 3px 2px 0px #151515;
}
.dash-unit dtitle {
font-size: 11px;
text-transform: uppercase;
color: #ffffff;
margin: 8px;
padding: 0px;
height: inherit;
}
.dash-unit hr {
border: 0;
border-top: 1px solid #151515;
@ -120,6 +111,35 @@ h5 {
margin-top: 3px;
}
.dash-unit p {
font-size: 14px;
font-weight: 200;
line-height: 16px;
color: inherit;
margin: 0 0 12px;
padding: 14px;
}
.dash-unit bold {
font-family: 'Open Sans', sans-serif;
font-size: 26px;
font-weight: bold;
color: #fff;
vertical-align: middle;
}
.dash-unit dtitle {
font-size: 11px;
text-transform: uppercase;
color: #ffffff;
margin: 8px;
padding-top: 4px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
height: inherit;
}
.dash-unit h1 {
font-family: 'Raleway', sans-serif;
font-weight: 300;
@ -158,15 +178,6 @@ h5 {
text-align: center;
}
.dash-unit p {
font-size: 14px;
font-weight: 200;
line-height: 16px;
color: inherit;
margin: 0 0 10px;
padding:10px;
}
.dash-unit h4 {
padding-left: 5px;
margin-top: 2px;
@ -177,14 +188,6 @@ h5 {
color: #fff;
}
.dash-unit bold{
font-family: 'Open Sans', sans-serif;
font-size: 26px;
font-weight: bold;
color: #fff;
vertical-align: middle;
}
/**********Half-Unit / Used in index.html**********/
.half-unit {
@ -205,6 +208,21 @@ h5 {
box-shadow: 3px 3px 2px 0px #151515;
}
.half-unit hr {
border: 0;
border-top: 1px solid #151515;
border-top-style: dashed;
margin-top: 3px;
}
.half-unit bold{
font-family: 'Open Sans', sans-serif;
font-size:26px;
font-weight:bold;
color:#fff;
vertical-align:middle;
}
.half-unit dtitle {
font-size: 10px;
text-transform: uppercase;
@ -214,13 +232,6 @@ h5 {
height: inherit;
}
.half-unit hr {
border: 0;
border-top: 1px solid #151515;
border-top-style: dashed;
margin-top: 3px;
}
.half-unit h1 {
font-family: 'Raleway', sans-serif;
font-weight: 300;
@ -244,15 +255,6 @@ h5 {
color: #fff;
}
.half-unit bold{
font-family: 'Open Sans', sans-serif;
font-size:26px;
font-weight:bold;
color:#fff;
vertical-align:middle;
}
/**********Styling Elements**********/
.cont {
text-align: center;
@ -384,6 +386,7 @@ textarea {
background-color: #b2c831;
}
/********** CUSTOMIZED BUTTON **********/
.btnnew {
display: inline-block;
@ -446,6 +449,7 @@ a:hover {
text-decoration: none;
}
/********** FooterWrap Section **********/
#footerwrap {
background: #262626;

26
templates/footer_main.html
View file

@ -1,29 +1,13 @@
<!-- Bootstrap core JavaScript -->
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
<!-- Bootstrap core JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
crossorigin="anonymous"></script>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
});
$(document).ready(function() {
$("div.list-group>a").click(function(e) {
e.preventDefault();
$(this).siblings('a.active').removeClass("active");
$(this).addClass("active");
var HalfUnit = $(this).parent().parent().parent()
var tabChildren = HalfUnit.children("div.bhoechie-tab").children("div.bhoechie-tab-content");
var tabChildrenActive = HalfUnit.children("div.bhoechie-tab").children("div.bhoechie-tab-content.active");
var index = $(this).index()
$(tabChildren).eq(index).addClass("active");
$(tabChildrenActive).removeClass("active");
});
});
$('#mainTabs a').click(function (e) {
e.preventDefault()
$(this).tab('show')
});
</script>
</body>
</html>

5
templates/header_main.html
View file

@ -8,7 +8,7 @@
<meta name="author" content="Jesse Hitch">
<meta name="theme-color" content="#1f1f1f" />
<link rel="icon" type="image/x-icon" href="/static/img/{{config_vars['favicon']}}">
<meta property="og:url" content="https://jessebot.io">
<meta property="og:url" content="https://jessebot.work">
<meta property="og:image" content="/static/img/{{config_vars['image']}}">
<meta property="og:title" content="{{config_vars['website_title']}}">
<meta property="og:description" content="Resume website for {{config_vars['name']}}">
@ -19,9 +19,8 @@
<!-- Custom styles for this template -->
<link href="/static/css/main.css" rel="stylesheet">
<link href="/static/css/fonts.css" rel="stylesheet">
<link href="/static/css/nerdfonts.css" rel="stylesheet">
<body>
{% if config_vars['fork_me'] %}
<a href="https://github.com/jessebot/tiny_personal_website" class="github-corner" aria-label="View source on Github"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#1f1f1f; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)']}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out']}}</style>
<a href="https://github.com/jessebot/tiny_personal_website" class="github-corner" aria-label="View source on Github"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#1f1f1f; position: absolute; top: 0; border: 0; right: 0; z-index: 1;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)']}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out']}}</style>
{% endif %}

20
templates/index.html
View file

@ -6,7 +6,7 @@
<div class="col-4">
<div class="dash-unit">
<dtitle>
<span class="nf-mdi-account" style="font-size: 1.5rem;"></span>
<span class="nf-mdi-account" style="font-size: 1.2rem;"></span>
About {{ config_vars['name'] }}
</dtitle>
<hr style="margin-bottom: 0;">
@ -22,31 +22,20 @@
</div><!-- /.col -->
</div><!-- /.row -->
<!-- links on their own row -->
<div class="row">
<div class="col-4">
<div class="dash-unit">
<br />
<center>
<dtitle>Social Links</dtitle>
<hr>
</center>
<br />
<center>
<p>
&nbsp;
&nbsp;&nbsp;
{% for lnk in social_links %}
<!-- Linkedin -->
<a target="_blank"
href="{{ social_links[lnk]['URL'] }}"
data-toggle="tooltip" data-placement="left"
title="{{ lnk }}">
<span class="{{ social_links[lnk]['icon'] }}">
&nbsp;
&nbsp;&nbsp;
</span>
</a>
{% endfor %}
</p>
<hr>
<dtitle>
<a href="{{ config_vars['resume_pdf_URL'] }}"
@ -56,10 +45,7 @@
Download Resume
</a>
</dtitle>
</center>
</div><!-- /.dash-unit -->
</div><!-- /.col -->
</div><!-- /.row links card-->
</div><!-- /.container MAIN-->
{% include('footer_main.html') %}