mirror of
https://github.com/jessebot/tiny_personal_website.git
synced 2025-10-01 01:48:43 +00:00
Overhauled the entire base site, and then added a likes and dislikes section
This commit is contained in:
parent
94f52d9802
commit
f4daa48cb9
7 changed files with 89 additions and 252 deletions
|
|
@ -44,35 +44,33 @@ h3, h4, h5 {
|
|||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.card-header, .card-footer {
|
||||
font-family: 'Cutive Mono';
|
||||
border: 1px solid #383737;
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #4f4f4f;
|
||||
border-bottom-color: #3d3d3d;
|
||||
font-size: 1.5rem;
|
||||
font-size: 1.7rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
padding: .5rem 1.25rem;
|
||||
}
|
||||
.circle :hover {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
-moz-border-radius: 50px;
|
||||
-webkit-border-radius: 50px;
|
||||
border-radius: 50px;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.card-block {
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
position: relative;
|
||||
height: 300px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.card-text {
|
||||
font-weight: lighter;
|
||||
font-size: .85rem;
|
||||
color: silver;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link.active {
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #3d3d3d;
|
||||
|
|
@ -80,6 +78,7 @@ h3, h4, h5 {
|
|||
border: 1px solid #383737;
|
||||
border-bottom-color: #3d3d3d;
|
||||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
padding-top: 9px;
|
||||
background-image: url(../images/sep-half.png);
|
||||
|
|
@ -88,6 +87,7 @@ h3, h4, h5 {
|
|||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: lighter;
|
||||
}
|
||||
|
||||
.nav-tabs .dropdown-menu {
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #4f4f4f;
|
||||
|
|
@ -102,11 +102,13 @@ h3, h4, h5 {
|
|||
border-color: #383737;
|
||||
border-top-style: dashed;
|
||||
}
|
||||
|
||||
.docs-img {
|
||||
height: 40px;
|
||||
margin-bottom: -16px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.menu-drop-item {
|
||||
padding: 1rem 1.6rem;
|
||||
}
|
||||
|
|
@ -158,91 +160,19 @@ h3, h4, h5 {
|
|||
|
||||
.scrollbar-morpheus-den::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 10px; }
|
||||
|
||||
.scrollbar-morpheus-den::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5; }
|
||||
background-color: #3d3d3d; }
|
||||
|
||||
.scrollbar-morpheus-den::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-image: -webkit-gradient(linear, left bottom, left top, from(#30cfd0), to(#330867));
|
||||
background-image: -webkit-linear-gradient(bottom, #30cfd0 0%, #330867 100%);
|
||||
background-image: linear-gradient(to top, #30cfd0 0%, #330867 100%); }
|
||||
|
||||
.scrollbar-deep-purple::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px; }
|
||||
|
||||
.scrollbar-deep-purple::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5; }
|
||||
|
||||
.scrollbar-deep-purple::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #512da8; }
|
||||
|
||||
.scrollbar-cyan::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px; }
|
||||
|
||||
.scrollbar-cyan::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5; }
|
||||
|
||||
.scrollbar-cyan::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #00bcd4; }
|
||||
|
||||
.scrollbar-dusty-grass::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px; }
|
||||
|
||||
.scrollbar-dusty-grass::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5; }
|
||||
|
||||
.scrollbar-dusty-grass::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-image: -webkit-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
|
||||
background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%); }
|
||||
|
||||
.scrollbar-ripe-malinka::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-color: #F5F5F5;
|
||||
border-radius: 10px; }
|
||||
|
||||
.scrollbar-ripe-malinka::-webkit-scrollbar {
|
||||
width: 12px;
|
||||
background-color: #F5F5F5; }
|
||||
|
||||
.scrollbar-ripe-malinka::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
||||
background-image: -webkit-linear-gradient(330deg, #f093fb 0%, #f5576c 100%);
|
||||
background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%); }
|
||||
|
||||
.bordered-deep-purple::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: none;
|
||||
border: 1px solid #512da8; }
|
||||
|
||||
.bordered-deep-purple::-webkit-scrollbar-thumb {
|
||||
-webkit-box-shadow: none; }
|
||||
|
||||
.bordered-cyan::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: none;
|
||||
border: 1px solid #00bcd4; }
|
||||
|
||||
.bordered-cyan::-webkit-scrollbar-thumb {
|
||||
-webkit-box-shadow: none; }
|
||||
background-image: -webkit-gradient(linear, left bottom, left top, from(#4f4f4f), to(#1F1F1F));
|
||||
background-image: -webkit-linear-gradient(bottom, #4f4f4f 0%, #1F1F1F 100%);
|
||||
background-image: linear-gradient(to top, #4f4f4f 0%, #1F1F1F 100%); }
|
||||
|
||||
.square::-webkit-scrollbar-track {
|
||||
border-radius: 0 !important; }
|
||||
|
|
@ -252,8 +182,3 @@ h3, h4, h5 {
|
|||
|
||||
.thin::-webkit-scrollbar {
|
||||
width: 6px; }
|
||||
|
||||
.card-block {
|
||||
position: relative;
|
||||
overflow-y: scroll;
|
||||
height: 300px; }
|
||||
|
|
|
|||
146
css/main.css
146
css/main.css
|
|
@ -1,146 +0,0 @@
|
|||
/**********BASE CONFIGURATIONS**********/
|
||||
@import url("https://fonts.googleapis.com/css?family=Cutive+Mono|Source+Sans+Pro");
|
||||
|
||||
body {
|
||||
background-color: #1f1f1f;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 46px;
|
||||
}
|
||||
|
||||
h3, h5, a {
|
||||
color: #29abe2;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: lighter;
|
||||
}
|
||||
|
||||
h3, h4, h5 {
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: lighter;
|
||||
}
|
||||
|
||||
/**********card and nav**********/
|
||||
.card, .main-img {
|
||||
border: 1px solid #383737;
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #3d3d3d;
|
||||
color: white;
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
}
|
||||
.card-header, .card-footer {
|
||||
font-family: 'Cutive Mono';
|
||||
border: 1px solid #383737;
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #4f4f4f;
|
||||
border-bottom-color: #3d3d3d;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.card-footer {
|
||||
padding: .5rem 1.25rem;
|
||||
}
|
||||
.circle :hover {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
-moz-border-radius: 50px;
|
||||
-webkit-border-radius: 50px;
|
||||
border-radius: 50px;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
z-index: 3;
|
||||
}
|
||||
.card-block {
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
}
|
||||
.card-text {
|
||||
font-weight: lighter;
|
||||
font-size: .85rem;
|
||||
}
|
||||
.nav-tabs .nav-link.active {
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #3d3d3d;
|
||||
color: #29abe2;
|
||||
border: 1px solid #383737;
|
||||
border-bottom-color: #3d3d3d;
|
||||
}
|
||||
.dropdown-toggle {
|
||||
padding-top: 9px;
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #4f4f4f;
|
||||
color: #29abe2;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.nav-tabs .dropdown-menu {
|
||||
background-image: url(../images/sep-half.png);
|
||||
background-color: #4f4f4f;
|
||||
color: #29abe2;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: lighter;
|
||||
font-size: 1.4rem;
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
width: 190px;
|
||||
margin-top: 6px;
|
||||
margin-left: -1px;
|
||||
border-color: #383737;
|
||||
border-top-style: dashed;
|
||||
}
|
||||
.docs-img {
|
||||
height: 40px;
|
||||
margin-bottom: -16px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
.menu-drop-item {
|
||||
padding: 1rem 1.6rem;
|
||||
}
|
||||
|
||||
.col-6 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-top: 5%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
max-width: 100%
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.container {
|
||||
padding-top: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
padding-top: 10%;
|
||||
min-width: 760px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
padding-top: 12%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
padding-top: 12%;
|
||||
min-width: 1000px;
|
||||
}
|
||||
.img-fluid {
|
||||
max-width: 75%;
|
||||
}
|
||||
}
|
||||
|
|
@ -58,10 +58,8 @@ h5 {
|
|||
background-image: url(../images/sep-half.png);
|
||||
background-color: #3d3d3d;
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,.175);
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
margin-top: 17px;
|
||||
margin-bottom: 17px;
|
||||
}
|
||||
|
||||
/*--- Dash Unit / Used in Dashboard page ---*/
|
||||
|
|
@ -848,6 +846,7 @@ a:hover {
|
|||
.fc-header {margin-top:15px;}
|
||||
.fc-header-title h2{font-size:10px; }
|
||||
.fc-header-right {display:none}
|
||||
}
|
||||
|
||||
/* portrait tablet */
|
||||
@media (min-width: 767px) and (max-width: 768px) {
|
||||
|
|
|
|||
|
|
@ -20,14 +20,56 @@ def get_global_variables():
|
|||
txt = doc["Globals"]
|
||||
return txt
|
||||
|
||||
def get_ld_variables(ld_var):
|
||||
"""
|
||||
Gets global variables from YAML file. Returns dict.
|
||||
"""
|
||||
with open('./config/config_likes_dislikes.yaml', 'r') as f:
|
||||
doc = yaml.load(f)
|
||||
txt = doc[ld_var]
|
||||
return txt
|
||||
|
||||
def sorted_vars(some_dict):
|
||||
"""
|
||||
Iterates through a dict and fixes list values to be alphabitized
|
||||
takes a dict.
|
||||
"""
|
||||
for key, value in some_dict.items():
|
||||
value.sort()
|
||||
some_dict[key] = value
|
||||
return some_dict
|
||||
|
||||
# full path to HTML templates
|
||||
WEB_ROOT = get_global_variables()['web_root']
|
||||
bottle.TEMPLATE_PATH.insert(0, '{0}/views/'.format(WEB_ROOT))
|
||||
|
||||
@route('/next-band')
|
||||
def dev():
|
||||
def nextband():
|
||||
# Grab site specific information - YAML
|
||||
log.info("oh hi, you must be here to see the name of my next band")
|
||||
globals = get_global_variables()
|
||||
return template('next_band', globals=globals)
|
||||
|
||||
|
||||
@route('/love')
|
||||
def love():
|
||||
# Grab site specific information - YAML
|
||||
globals = get_global_variables()
|
||||
likes = get_ld_variables("likes")
|
||||
sorted_likes = sorted_vars(likes)
|
||||
return template('love', globals=globals, likes=sorted_likes)
|
||||
|
||||
|
||||
@route('/hate')
|
||||
def hate():
|
||||
# Grab site specific information - YAML
|
||||
globals = get_global_variables()
|
||||
dislikes = get_ld_variables("dislikes")
|
||||
sorted_dislikes = sorted_vars(dislikes)
|
||||
return template('hate', globals=globals, dislikes=sorted_dislikes)
|
||||
|
||||
@route('/dev')
|
||||
def dev():
|
||||
# Grab site specific information - YAML
|
||||
globals = get_global_variables()
|
||||
return template('dev', globals=globals)
|
||||
|
|
|
|||
|
|
@ -6,6 +6,23 @@
|
|||
$(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>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<!-- Bootstrap core JavaScript -->
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
|
||||
|
||||
|
|
|
|||
|
|
@ -18,18 +18,18 @@
|
|||
<div class="col-lg-8 col-md-4 col-sm-6 col-xl-8">
|
||||
<div class="dash-unit bhoechie-tab-container">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li role="presentation" class="active col-lg-4 col-md-4 col-sm-4 col-xs-4 col-xl-4">
|
||||
<a href="#resume" aria-control="resume" role="tab" data-toggle="tab">
|
||||
<li role="presentation" class="col-lg-4 col-md-4 col-sm-4 col-xs-4 col-xl-4 active">
|
||||
<a href="#resume" aria-control="resume" role="tab" data-toggle="tab" aria-expanded="true">
|
||||
<img src="/images/googledocs.svg" style="width: 64px;">
|
||||
</a>
|
||||
</li>
|
||||
<li role="presentation" class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
|
||||
<a href="#linkedin" aria-control="linkedin" role="tab" data-toggle="tab">
|
||||
<a href="#linkedin" aria-control="linkedin" role="tab" data-toggle="tab" aria-expanded="false">
|
||||
<img src="/images/linkedin.svg" style="width: 64px;">
|
||||
</a>
|
||||
</li>
|
||||
<li role="presentation" class="col-lg-4 col-md-4 col-sm-4 col-xs-4 col-xl-6">
|
||||
<a href="#github" aria-control="github" role="tab" data-toggle="tab">
|
||||
<a href="#github" aria-control="github" role="tab" data-toggle="tab" aria-expanded="false">
|
||||
<img src="/images/github-cat.svg" style="width: 64px;">
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue