Begin reformatting
This commit is contained in:
Rumps
parent
df05493b43
commit
ef054b321c
|
|
@ -23,22 +23,26 @@
|
|||
<h2 id="page-subtitle">
|
||||
~ <a href="mailto:bgoldsworthy96@gmail.com"><i class="fa fa-envelope"></i></a> ~
|
||||
<a href="bitcoin:1HApEg2robrRCx4rTKKeFj25unoaX65QUc"><i class="fa fa-btc"></i></a> ~
|
||||
<a href="https://www.facebook.com/Rumperuu"><i class="fa fa-facebook-official"></i></a> ~
|
||||
<a href="https://twitter.com/rumperuu"><i class="fa fa-twitter"></i></a> ~
|
||||
<a href="https://uk.linkedin.com/in/rumperuu"><i class="fa fa-linkedin"></i></a> ~
|
||||
<a href="https://github.com/Rumperuu"><i class="fa fa-github"></i></a> ~
|
||||
<i class="fa fa-key"></i> 7FDCE988 ~
|
||||
</h2>
|
||||
</div>
|
||||
</header>
|
||||
<div class="row" id="blog-row">
|
||||
<ul class="col-2">
|
||||
<li><a id="blog" class="hyperlink-button" href="blog">Blog</a></li>
|
||||
|
||||
<div class="row" id="personal-row">
|
||||
<div class="col-12">
|
||||
<h3 class="frontpage-section-title col-12">Personal</h3>
|
||||
<ul>
|
||||
<li class="col-m-6 col-1"><a id="blog" class="hyperlink-button" href="blog">Blog</a></li>
|
||||
<li class="col-m-6 col-1"><a id="wishlist" class="hyperlink-button" href="wishlist">Wishlist</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" id="portfolios-row">
|
||||
<div class="col-12">
|
||||
<h5>Portfolios</h5>
|
||||
<h3 class="frontpage-section-title col-12">Portfolios</h3>
|
||||
<ul>
|
||||
<?php
|
||||
$portfolios = array("website", "program", "writing", "video", "other");
|
||||
|
|
@ -50,21 +54,20 @@
|
|||
foreach (get_post_types($args, 'objects', 'and') as $post_type) {
|
||||
if (in_array($post_type->name, $portfolios)) {
|
||||
$num = array_search($post_type->name, $portfolios);
|
||||
$buttons[$post_type->name] = "<li><a id=\"".($post_type->name)."\" class=\"hyperlink-button\" href=\"".($post_type->name)."\">".($post_type->labels->name)."</a></li>";
|
||||
$buttons[$post_type->name] = "<li class=\"col-m-6 col-2\"><a id=\"".($post_type->name)."\" class=\"hyperlink-button\" href=\"".($post_type->name)."\">".($post_type->labels->name)."</a></li>";
|
||||
}
|
||||
}
|
||||
foreach ($portfolios as $portfolio) {
|
||||
echo "<div class=\"col-m-6 col-2 col-w-1\">";
|
||||
echo $buttons[$portfolio];
|
||||
echo "</div>";
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" id="experience-row">
|
||||
<div class="col-12">
|
||||
<h5>Experience</h5>
|
||||
<h3 class="frontpage-section-title col-12">Experience</h3>
|
||||
<ul>
|
||||
<div class="col-m-6 col-2 col-w-1">
|
||||
<li><a id="all" class="hyperlink-button" href="experience">All (WIP)</a></li>
|
||||
|
|
@ -81,6 +84,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" id="others-row">
|
||||
<div class="col-12">
|
||||
<ul>
|
||||
|
|
@ -93,7 +97,8 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" id="icons-row">
|
||||
<!--
|
||||
<div class="row" id="social-cataloguing-row">
|
||||
<div class="icons-wrapper col-12 col-m-12">
|
||||
<ul>
|
||||
<li><a href="https://www.goodreads.com/Rumperuu"><div class="icon" style="background-image: url('http://www.bengoldsworthy.uk/wp-content/uploads/2016/09/gr.png');"></div></a></li>
|
||||
|
|
@ -104,6 +109,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</main><!-- .site-main -->
|
||||
</div><!-- .content-area -->
|
||||
|
||||
|
|
|
|||
263
style.css
263
style.css
|
|
@ -142,6 +142,14 @@ figcaption {
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
/******************
|
||||
* 2.1.3 Special Containers
|
||||
*/
|
||||
|
||||
#header-row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/***************************************
|
||||
* 2.2 Text
|
||||
*/
|
||||
|
|
@ -150,7 +158,7 @@ figcaption {
|
|||
* 2.2.1 Headings
|
||||
*/
|
||||
|
||||
h1, h2, h3, h3 a, h4, h5 {
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
color: var(--dark);
|
||||
|
|
@ -159,7 +167,7 @@ h1, h2, h3, h3 a, h4, h5 {
|
|||
#website-title {
|
||||
margin-left: 25px;
|
||||
text-align: center;
|
||||
font-size: 8em;
|
||||
font-size: 3.5em;
|
||||
font-weight: bold;
|
||||
text-shadow: -1px -1px 0 white,
|
||||
1px -1px 0 white,
|
||||
|
|
@ -350,15 +358,100 @@ a:hover {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
li a.hyperlink-button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.index-item {
|
||||
border-bottom: 2px solid var(--dark);
|
||||
overflow: hidden;
|
||||
background-color: var(--light);
|
||||
height: 250px;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 7.5px;
|
||||
margin-bottom: 7.5px;
|
||||
}
|
||||
|
||||
.index-item header {
|
||||
background-color: var(--light);
|
||||
opacity: 0.75;
|
||||
margin-top: auto;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
max-height: 40%;
|
||||
}
|
||||
|
||||
.index:hover .index-item {
|
||||
filter: sepia(1);
|
||||
}
|
||||
.index:hover .index-item:hover {
|
||||
opacity: 1;
|
||||
filter: none;
|
||||
}
|
||||
|
||||
/***************************************
|
||||
* 2.4 Images
|
||||
*/
|
||||
|
||||
#frontpage-img-wrapper {
|
||||
border-radius: 50%;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
border: 2px solid #003D52;
|
||||
}
|
||||
|
||||
#frontpage-img {
|
||||
max-width: 150%;
|
||||
height: 150%;
|
||||
}
|
||||
|
||||
.entry-content img:not(.latex) {
|
||||
border: 2px solid #444;
|
||||
}
|
||||
|
||||
.latex {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.aligncenter {
|
||||
text-align: center;
|
||||
margin: 1em auto 1em auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.entry-content img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.post-header-image {
|
||||
height:100vh;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.sampler {
|
||||
width: 100%;
|
||||
height: 60vh;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
* UNFINISHED
|
||||
*/
|
||||
* AUTHOR STUFF - CURRENTLY UNNECESSARY
|
||||
*
|
||||
|
||||
.author a {
|
||||
border-radius: 0 35px 35px 0;
|
||||
|
|
@ -386,96 +479,6 @@ a:hover {
|
|||
color: #999;
|
||||
}
|
||||
|
||||
.index article {
|
||||
border-bottom: 2px solid var(--dark);
|
||||
overflow: hidden;
|
||||
background-color: var(--light);
|
||||
height: 250px;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 7.5px;
|
||||
margin-bottom: 7.5px;
|
||||
}
|
||||
|
||||
.index article header {
|
||||
background-color: var(--light);
|
||||
opacity: 0.75;
|
||||
margin-top: auto;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
max-height: 40%;
|
||||
}
|
||||
|
||||
|
||||
.index:hover article {
|
||||
filter: sepia(1);
|
||||
}
|
||||
.index:hover article:hover {
|
||||
opacity: 1;
|
||||
filter: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* 4. Images
|
||||
*/
|
||||
|
||||
#frontpage-img-wrapper {
|
||||
border-radius: 50%;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
border: 2px solid #003D52;
|
||||
}
|
||||
|
||||
#frontpage-img {
|
||||
max-width: 150%;
|
||||
height: 150%;
|
||||
}
|
||||
|
||||
.post-thumbnail {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 15em;
|
||||
cursor: pointer;
|
||||
background-color: #fff;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.post-thumbnail .post-thumbnail-label {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
opacity: 0;
|
||||
font-size: 2em;
|
||||
color: #003D52;
|
||||
height: 100%;
|
||||
line-height: 240px;
|
||||
}
|
||||
.post-thumbnail:hover .post-thumbnail-label {
|
||||
animation: both fadeinanddarken 0.3s;
|
||||
}
|
||||
|
||||
.single-img .title {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
left: 30%;
|
||||
}
|
||||
|
||||
.entry-content img:not(.latex) {
|
||||
border: 2px solid #444;
|
||||
}
|
||||
|
||||
.latex {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.author img {
|
||||
padding: 5px;
|
||||
border-radius: 50%;
|
||||
|
|
@ -483,71 +486,10 @@ a:hover {
|
|||
background-color: #95b2bf;
|
||||
}
|
||||
|
||||
.post-header-image {
|
||||
height:100vh;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.aligncenter {
|
||||
text-align: center;
|
||||
margin: 1em auto 1em auto;
|
||||
display: block;
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
|
||||
.blog-post .entry-content img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.sampler {
|
||||
width: 100%;
|
||||
height: 60vh;
|
||||
}
|
||||
|
||||
/*
|
||||
* 5. Article List View
|
||||
*/
|
||||
|
||||
article.entry-header {
|
||||
margin-bottom: -100px;
|
||||
}
|
||||
|
||||
.post-details {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: auto;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
text-align: justify;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.post-details header, .post-details footer, .post-details .entry-content {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
line-height: 2.3em;
|
||||
}
|
||||
|
||||
.post-details footer {
|
||||
height: 4.5em;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.author {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.author:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.post-header-image .post-header-title {
|
||||
position: absolute;
|
||||
|
|
@ -983,8 +925,8 @@ float: right;
|
|||
*/
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
h1 {
|
||||
text-align: left;
|
||||
#website-title {
|
||||
font-size: 4.5em;
|
||||
}
|
||||
.blog-post .entry-content {
|
||||
width: 80%;
|
||||
|
|
@ -993,7 +935,10 @@ float: right;
|
|||
}
|
||||
|
||||
@media only screen and (min-width: 1024px) {
|
||||
h5 {
|
||||
#website-title {
|
||||
font-size: 8em;
|
||||
}
|
||||
.frontpage-section-title {
|
||||
text-align: left;
|
||||
}
|
||||
#frontpage-img-wrapper {
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -10,7 +10,7 @@
|
|||
|
||||
<div class="col-m-6 col-4 col-w-3">
|
||||
<a href="<?php the_permalink(); ?>">
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?> style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
|
||||
<article id="post-<?php the_ID(); ?>" class="index-item" style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
|
||||
<header class="entry-header">
|
||||
<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
|
||||
<span class="sticky-post"><?php _e( 'Featured', 'bengoldsworthy' ); ?></span>
|
||||
|
|
|
|||
Reference in New Issue