nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-27 01:33:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

mobile: better work with percentage #210

Browse source 
as it is unclear yet if vh is what we really need here
This commit is contained in:
Sören Weber 2022-03-15 20:15:44 +01:00
parent a332394c06
commit 5b216ebf82
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
1 changed files with 18 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
static/css/theme.css
View file

@ -44,8 +44,8 @@
} }
html { html {
width: 100vw; width: 100%;
height: 100vh; height: 100%;
} }
body { body {
@ -56,11 +56,11 @@ body {
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
font-size: 16.25px; font-size: 16.25px;
font-weight: 300; font-weight: 300;
height: 100vh; height: 100%;
justify-content: flex-end; justify-content: flex-end;
line-height: 1.574; line-height: 1.574;
overflow: hidden; /* to avoid browser scrollbar to flicker before we create our own */ overflow: hidden; /* to avoid browser scrollbar to flicker before we create our own */
width: 100vw; width: 100%;
} }
body #body-inner.chapter h1 { body #body-inner.chapter h1 {
@ -110,10 +110,10 @@ th {
flex-grow: 0; flex-grow: 0;
flex-shrink: 0; flex-shrink: 0;
font-size: 15.25px; font-size: 15.25px;
height: 100vh; height: 100%;
left: 0; left: 0;
line-height: 1.574; line-height: 1.574;
min-height: 100vh; min-height: 100%;
min-width: 300px; min-width: 300px;
max-width: 300px; max-width: 300px;
position: fixed; position: fixed;
@ -354,14 +354,14 @@ th {
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
flex-shrink: 0; flex-shrink: 0;
height: 100vh; height: 100%;
margin-left: 300px; margin-left: 300px;
min-height: 100vh; min-height: 100%;
min-width: calc( 100vw - 300px); min-width: calc( 100% - 300px);
max-width: calc( 100vw - 300px); max-width: calc( 100% - 300px);
overflow-wrap: break-word; /* avoid x-scrolling of body if it is to large to fit */ overflow-wrap: break-word; /* avoid x-scrolling of body if it is to large to fit */
position: relative; /* PS */ position: relative; /* PS */
width: calc( 100vw - 300px); width: calc( 100% - 300px);
z-index: 300; z-index: 300;
} }
@ -1044,9 +1044,9 @@ span.nav i{
} }
#body { #body {
margin-left: 230px; margin-left: 230px;
min-width: calc( 100vw - 230px); min-width: calc( 100% - 230px);
max-width: calc( 100vw - 230px); max-width: calc( 100% - 230px);
width: calc( 100vw - 230px); width: calc( 100% - 230px);
} }
} }
@media only all and (max-width: 47.938em) { @media only all and (max-width: 47.938em) {
@ -1059,9 +1059,9 @@ span.nav i{
} }
.mobile-support #body { .mobile-support #body {
margin-left: 0; margin-left: 0;
min-width: 100vw; min-width: 100%;
max-width: 100vw; max-width: 100%;
width: 100vw; width: 100%;
} }
.mobile-support.sidebar-flyout { .mobile-support.sidebar-flyout {
overflow: hidden; overflow: hidden;
@ -1084,7 +1084,6 @@ span.nav i{
top: 0; top: 0;
z-index: 500; z-index: 500;
} }
} }
.copy-to-clipboard-button { .copy-to-clipboard-button {
@ -1313,7 +1312,7 @@ option {
#TableOfContents { #TableOfContents {
font-size: 13px !important; font-size: 13px !important;
max-height: 85vh; max-height: 85%;
overflow: auto; overflow: auto;
padding: 15px 5px !important; padding: 15px 5px !important;
} }