general style update:
- update homepage style - update navbar style - update footer style - update feed animation - add website logo
This commit is contained in:
parent
25b37da7ce
commit
121708786d
@ -29,9 +29,6 @@ h1 {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-gap: 30px;
|
||||
|
||||
/* This padding is used so that the last posts' shadows doesn't overlap the footer */
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.post-card_main {
|
||||
@ -66,7 +63,7 @@ h1 {
|
||||
|
||||
ATM: scale up
|
||||
*/
|
||||
transform: scale(1.04);
|
||||
transform:translate3d(0,-5px,0);
|
||||
}
|
||||
|
||||
a.post-card_main {
|
||||
@ -79,7 +76,9 @@ a.post-card_main:hover {
|
||||
|
||||
footer.post-card_footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-end;
|
||||
height: 100%;
|
||||
margin-top: 20px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
|
@ -34,8 +34,7 @@ h2 {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 800;
|
||||
color: white;
|
||||
margin: 0;
|
||||
padding: 38px 0 0;
|
||||
margin: 38px 0 38px;
|
||||
font-size: 60px;
|
||||
}
|
||||
|
||||
@ -58,18 +57,19 @@ h4 {
|
||||
}
|
||||
|
||||
.nav {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
position: absolute; /* only used if JS is disabled */
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
justify-content: flex-start;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
@ -91,23 +91,42 @@ is applied by the script on scroll.
|
||||
background: rgba(0, 0, 0, 1);
|
||||
}
|
||||
|
||||
.navbar-colored img {
|
||||
transform:translate(50px, 0);
|
||||
}
|
||||
|
||||
.navbar-transparent {
|
||||
background: rgba(0, 0, 0, 0.0);
|
||||
}
|
||||
|
||||
.navbar-transparent img {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.navbar img {
|
||||
margin-left: -30px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
transition: 1s;
|
||||
}
|
||||
|
||||
.navbar li {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
font-family: 'Oswald', sans-serif;
|
||||
font-weight: 300;
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.navbar a {
|
||||
color: white;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 30px;
|
||||
font-family: 'Oswald', sans-serif;
|
||||
font-weight: 300;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
padding: 0;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.navbar li.nav-services {
|
||||
@ -130,20 +149,27 @@ main {
|
||||
text-align: justify;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
padding-top: 30px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
/* End Main Content */
|
||||
|
||||
/* Begin footer */
|
||||
/* .mind-fullscreen-title is only used by pages (no homepage), however other pages have the footer too. */
|
||||
.mind-fullscreen-title, footer.mind-site-footer {
|
||||
.mind-fullscreen-title, footer.mind-site-footer_main {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
background: linear-gradient(45deg, #067062, #063d70, #2d0670, #4e0670, #700667);
|
||||
background-size: 1000%, 100%;
|
||||
animation: gradient 7s linear infinite;
|
||||
animation-direction: alternate-reverse;
|
||||
color: white;
|
||||
}
|
||||
|
||||
nav.mind-site-footer_nav {
|
||||
text-align: right;
|
||||
margin: 20px;
|
||||
}
|
||||
/* End footer */
|
||||
|
||||
/* Begin policy popup */
|
||||
|
18
default.hbs
18
default.hbs
@ -24,14 +24,14 @@
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="{{asset "css/page-style.css"}}" />
|
||||
|
||||
<title>{{@site.title}} - {{meta_title}}</title>
|
||||
<title>{{meta_title}} – {{@site.title}}</title>
|
||||
|
||||
{{/is}}
|
||||
<!-- End Posts & Pages only code -->
|
||||
|
||||
<!-- Begin Index only code -->
|
||||
{{#is "index"}}
|
||||
<title>{{meta_title}}</title>
|
||||
<title>{{@site.title}}</title>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="{{asset "css/home-style.css"}}" />
|
||||
{{/is}}
|
||||
@ -43,9 +43,12 @@
|
||||
</head>
|
||||
<body class="{{body_class}}" onload="openPolicyPopup()">
|
||||
|
||||
<div id="navbar" class="navbar unselectable">
|
||||
<nav id="navbar" class="navbar unselectable">
|
||||
<a href="/">
|
||||
<img src="{{@site.icon}}" />
|
||||
</a>
|
||||
{{navigation}}
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="mind-policy-popup" id="mind-policy-popup">
|
||||
<h4>This website uses cookies.</h4>
|
||||
@ -60,8 +63,13 @@
|
||||
{{!-- All content gets inserted here, index.hbs, post.hbs, etc --}}
|
||||
|
||||
|
||||
<footer class="mind-site-footer unselectable">
|
||||
<footer class="mind-site-footer_main unselectable">
|
||||
<div>
|
||||
<h4>Copyright © 2019-20 ― Lorenzo Dellacà</h4>
|
||||
</div>
|
||||
<nav class="mind-site-footer_nav">
|
||||
<a href="/">Privacy Policy</a>
|
||||
</nav>
|
||||
</footer>
|
||||
|
||||
{{!-- <foot> --}}
|
||||
|
@ -7,7 +7,7 @@
|
||||
|
||||
|
||||
<main>
|
||||
<h2>Last posts</h2>
|
||||
<h2>Most recent posts</h2>
|
||||
<div class="mind-feed_main">
|
||||
|
||||
<!-- Looping through every post -->
|
||||
|
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "mindtheme",
|
||||
"description": "Mind Overflow's official website style",
|
||||
"version": "0.0.2",
|
||||
"version": "0.0.3",
|
||||
"engines": {
|
||||
"ghost-api": "v3"
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user