Proceed implementing responsive theme
The responsive theme is almost ready; most pages and elements now render correctly on the vast majority of screens. There are some known issues which are in the works. Also, a <h4> "Paragraphs" title has been aded on the left navbar.
This commit is contained in:
parent
ae728ffd9e
commit
d8b54a00d9
@ -244,14 +244,14 @@ is applied by the script on scroll.
|
||||
|
||||
.mind-global-navbar_primary li.nav-services {
|
||||
/* TODO: choose if background should be colorful or white */
|
||||
background: linear-gradient(to right, #33ffc5 20%, #fc33ff, #ff3370, #ff3333, #3dff33, #33ffc5);
|
||||
/*background: white;*/
|
||||
/*background: linear-gradient(to right, #33ffc5 20%, #fc33ff, #ff3370, #ff3333, #3dff33, #33ffc5);
|
||||
background-size: 800px, 800px;
|
||||
color: aquamarine;
|
||||
text-fill-color: transparent;
|
||||
animation: gradient 2s linear infinite;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
-webkit-text-fill-color: transparent;*/
|
||||
}
|
||||
|
||||
.mind-global-navbar_secondary {
|
||||
@ -1112,15 +1112,50 @@ div.mind-policy-popup {
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 2000px)
|
||||
{
|
||||
ul {
|
||||
margin: 15px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1300px) {
|
||||
|
||||
h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
.mind-post-header p {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.mind-content_main {
|
||||
min-width: calc(100% - 40px);
|
||||
width: calc(100% - 40px);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.mind-post_central-column {
|
||||
padding: 0 40px;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.kg-gallery-image {
|
||||
margin: 10px 10px;
|
||||
}
|
||||
|
||||
.kg-gallery-row {
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.mind-post-card-big_main {
|
||||
margin: auto;
|
||||
}
|
||||
@ -1128,6 +1163,18 @@ div.mind-policy-popup {
|
||||
|
||||
@media only screen and (max-width: 1000px) {
|
||||
|
||||
h1 {
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 18px;
|
||||
}
|
||||
@ -1136,6 +1183,28 @@ div.mind-policy-popup {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
.mind-post_main {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.mind-post_central-column {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.kg-gallery-image {
|
||||
margin: 10px 5px;
|
||||
}
|
||||
.kg-gallery-row {
|
||||
margin: 0 40px;
|
||||
}
|
||||
|
||||
.mind-post_sidebar {
|
||||
visibility: hidden;
|
||||
height: 0;
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mind-policy-popup {
|
||||
width: 50vw;
|
||||
bottom: 10px;
|
||||
@ -1149,17 +1218,45 @@ div.mind-policy-popup {
|
||||
|
||||
@media only screen and (max-width: 650px) {
|
||||
|
||||
h1 {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 21px;
|
||||
}
|
||||
|
||||
.mind-post-header p {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 10px 0 10px auto;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.mind-global-navbar_primary li {
|
||||
font-size: 20px;
|
||||
.mind-global-navbar_primary li, .mind-global-navbar_secondary li {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.mind-feed-content_main {
|
||||
grid-template-columns: 1fr;
|
||||
min-width: calc(100% - 40px);
|
||||
width: calc(100% - 40px);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.mind-content_main {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mind-post_central-column {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.mind-global-navbar_primary img {
|
||||
@ -1190,4 +1287,16 @@ div.mind-policy-popup {
|
||||
.mind-index-header_main h1 {
|
||||
font-size: 16vw;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 23px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
.mind-post_central-column {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
659
assets/js/jquery-3.5.1.js
vendored
659
assets/js/jquery-3.5.1.js
vendored
File diff suppressed because one or more lines are too long
@ -12,11 +12,11 @@ function agreePolicyPopup() {
|
||||
}
|
||||
|
||||
function getCookie(cname) {
|
||||
var name = cname + "=";
|
||||
var decodedCookie = decodeURIComponent(document.cookie);
|
||||
var ca = decodedCookie.split(';');
|
||||
for(var i = 0; i <ca.length; i++) {
|
||||
var c = ca[i];
|
||||
const name = cname + "=";
|
||||
const decodedCookie = decodeURIComponent(document.cookie);
|
||||
const ca = decodedCookie.split(';');
|
||||
for(let i = 0; i <ca.length; i++) {
|
||||
let c = ca[i];
|
||||
while (c.charAt(0) === ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
@ -28,9 +28,9 @@ function getCookie(cname) {
|
||||
}
|
||||
|
||||
function setCookie(name, value, days) {
|
||||
var expires = "";
|
||||
let expires = "";
|
||||
if (days) {
|
||||
var date = new Date();
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() + (days*24*60*60*1000));
|
||||
expires = "; expires=" + date.toUTCString();
|
||||
}
|
||||
|
@ -43,7 +43,9 @@
|
||||
|
||||
{{> "navbar-primary"}}
|
||||
|
||||
{{> "policy-popup"}}
|
||||
{{> "policy-popup"}} {{!-- Todo: maybe we shouldn't include the whole HTML in every page (hidden)
|
||||
and then show it via JS, but instead only inject it when needed via JS. This is because search
|
||||
engines might scan the policy popup too. --}}
|
||||
|
||||
{{{body}}}
|
||||
{{!-- All content gets inserted here, index.hbs, post.hbs, etc --}}
|
||||
|
@ -1,4 +1,5 @@
|
||||
{{#get "posts" limit="3" filter="tags:[{{post.tags}}]+id:-{{post.id}}" include="tags" as |related|}}
|
||||
{{!-- Gest the 3 most recent related posts --}}
|
||||
{{#get "posts" limit="3" filter="id:-{{post.id}}+tags:[{{post.tags}}]" include="tags" as |related|}}
|
||||
<h4>Similar posts</h4>
|
||||
{{#foreach related}}
|
||||
<article class="{{post_class}}">
|
||||
|
4
post.hbs
4
post.hbs
@ -17,9 +17,9 @@
|
||||
<div class="mind-post_main">
|
||||
<aside class="mind-post_sidebar unselectable">
|
||||
<div class="mind-post_sidebar-content" id="mind-post_sidebar-left">
|
||||
|
||||
<h4>Paragraphs</h4>
|
||||
{{!-- This gets automatically filled by the sidebar script! --}}
|
||||
</div>
|
||||
{{!-- This gets automatically filled by the sidebar script! --}}
|
||||
</aside>
|
||||
{{#post}}
|
||||
<div class="mind-post_central-column">
|
||||
|
Loading…
Reference in New Issue
Block a user