Update exploration page layout
This commit is contained in:
parent
0005836a95
commit
0a285b0d7f
@ -61,9 +61,13 @@ ul {
|
||||
padding: 0.5em;
|
||||
transition: all 0.25s ease-in-out;
|
||||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.6), 0 6px 20px 0 rgba(0, 0, 0, 0.6);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#toggle-description:hover { cursor: pointer; }
|
||||
#toggle-description:hover {
|
||||
cursor: pointer;
|
||||
box-shadow: 4px 4px 8px 0 rgba(255, 255, 255, 0.3), -4px -4px 8px 0 rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
#toggle-description:hover, #toggle-description.active {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
@ -80,6 +84,17 @@ ul {
|
||||
padding-bottom: 1em;
|
||||
width: 75%;
|
||||
text-shadow: 3px 3px 5px #000;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#header span {
|
||||
float: right;
|
||||
text-align: right;
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
#header span a {
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
#content {
|
||||
@ -92,10 +107,10 @@ ul {
|
||||
}
|
||||
|
||||
.article {
|
||||
height: 10em;
|
||||
height: 14em;
|
||||
|
||||
margin-bottom: 2em;
|
||||
border-radius: 5em;
|
||||
border-radius: 7em;
|
||||
border-style: none;
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
border-width: 5px;
|
||||
@ -123,12 +138,12 @@ ul {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
border-radius: 5em;
|
||||
border-radius: 7em;
|
||||
outline-style: none;
|
||||
}
|
||||
|
||||
.article-content {
|
||||
height: 10em;
|
||||
height: 14em;
|
||||
overflow: hidden;
|
||||
transition: all 0.25s ease-in-out;
|
||||
display: block;
|
||||
@ -143,7 +158,7 @@ ul {
|
||||
|
||||
.article-content h2 {
|
||||
text-transform: capitalize;
|
||||
margin-top: 1.5em;
|
||||
margin-top: 3em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
|
@ -57,7 +57,28 @@
|
||||
<div id="toggle-description" class="nojs"><i class="fas fa-paragraph"></i></div>
|
||||
|
||||
<div id="content">
|
||||
<div id="header"><h1>Explore All Around Here</h1></div>
|
||||
<div id="header">
|
||||
<h1>
|
||||
Explore All Around Here
|
||||
|
||||
<span class="float-right">
|
||||
<a
|
||||
class="button instagram"
|
||||
title="Follow All Around Here on instagram @allaroundhere"
|
||||
href="https://www.instagram.com/allaroundhere/"
|
||||
>
|
||||
<i class="fab fa-instagram"></i>
|
||||
</a>
|
||||
<a
|
||||
class="button twitter"
|
||||
title="Follow me on twitter @enpaul_"
|
||||
href="https://www.twitter.com/enpaul_/"
|
||||
>
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
{% for post in config.posts %}
|
||||
|
Loading…
Reference in New Issue
Block a user