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