Improve mobile responsiveness

This commit is contained in:
Zed 2022-01-06 15:21:42 +01:00
parent ffcac982d0
commit f21e192a8f
7 changed files with 16 additions and 9 deletions

View file

@ -6,7 +6,8 @@
# disable annoying warnings
warning("GcUnsafe2", off)
warning("ObservableStores", off)
hint("XDeclaredButNotUsed", off)
hint("User", off)
const
nimVersion = (major: NimMajor, minor: NimMinor, patch: NimPatch)

View file

@ -51,9 +51,10 @@
margin-bottom: unset;
}
@media(max-width: 600px) {
@media(max-width: 700px) {
.profile-tabs {
width: 100vw;
max-width: 600px;
.timeline-container {
width: 100% !important;
@ -71,3 +72,9 @@
padding: 0;
}
}
@media (min-height: 900px) {
.profile-tab.sticky {
position: sticky;
}
}

View file

@ -103,7 +103,7 @@
color: var(--profile_stat);
}
@media(max-width: 600px) {
@media(max-width: 700px) {
.profile-card-info {
display: flex;
}

View file

@ -59,7 +59,7 @@
padding-bottom: 12px;
}
@media(max-width: 600px) {
@media(max-width: 700px) {
.photo-rail-header {
display: none;
}
@ -74,9 +74,7 @@
overflow: hidden;
transition: max-height 0.4s;
}
}
@media(max-width: 600px) {
.photo-rail-grid {
grid-template-columns: repeat(6, 1fr);
}

View file

@ -75,6 +75,7 @@
&.wide {
flex-grow: 1.2;
flex-basis: 50px;
}
}

View file

@ -45,7 +45,7 @@ proc renderHead*(prefs: Prefs; cfg: Config; titleText=""; desc=""; video="";
let opensearchUrl = getUrlPrefix(cfg) & "/opensearch"
buildHtml(head):
link(rel="stylesheet", type="text/css", href="/css/style.css?v=8")
link(rel="stylesheet", type="text/css", href="/css/style.css?v=9")
link(rel="stylesheet", type="text/css", href="/css/fontello.css?v=2")
if theme.len > 0:

View file

@ -105,8 +105,8 @@ proc renderProfile*(profile: Profile; timeline: var Timeline;
tdiv(class="profile-banner"):
renderBanner(profile)
let sticky = if prefs.stickyProfile: "sticky" else: "unset"
tdiv(class="profile-tab", style={position: sticky}):
let sticky = if prefs.stickyProfile: " sticky" else: ""
tdiv(class=(&"profile-tab{sticky}")):
renderProfileCard(profile, prefs)
if photoRail.len > 0:
renderPhotoRail(profile, photoRail)