eswyft/4in1_ws_web
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improve header; improve cover on mobile

Browse Source
This commit is contained in:
E. S. 2024-02-02 02:22:19 +00:00
parent 69302d0a44
commit 5aabe046d3
5 changed files with 44 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
htdocs/scss/app/common.scss
View File

@ -119,7 +119,7 @@ p, p code {
padding: 0 $side-padding;
}
.page-content-inner {
padding: $base-padding 0;
padding: 0 0 $base-padding 0;
}
@ -284,14 +284,18 @@ table.contacts div.note {
.index-book {
//margin-top: -10px;
//padding-top: 5px;
&-image {
&-image-wrap {
float: left;
width: 300px;
height: 463px;
}
&-image {
background: url(/img/cover.jpg?1) no-repeat 0 0;
background-size: 600px 463px;
display: block;
text-decoration: none;
width: 300px;
height: 463px;
outline: none;
}
&-updates {

13
htdocs/scss/app/head.scss
View File

@ -10,14 +10,14 @@
.head-logo-wrap {
display: table-cell;
padding: 8px 0;
padding: 10px 0;
}
.head-logo {
padding: 10px 14px;
margin-left: -14px;
z-index: 5;
font-weight: bold;
font-size: 16px;
font-size: $fs + 2px;
left: 0;
background-color: transparent;
display: inline-block;
@ -36,13 +36,18 @@
&-author {
font-weight: normal;
color: $grey;
//font-size: $fs;
//position: relative;
//top: -5px;
}
}
&-subtitle {
font-size: 13px;
font-size: 14px;
color: $fg;
font-weight: normal;
padding-top: 2px;
line-height: 18px;
}
}
//body:not(.theme-changing) .head-logo {
@ -57,7 +62,7 @@
}
a.head-item {
color: $fg;
font-size: $fs - 1px;
font-size: $fs;
display: inline-block;
padding: 8px 12px;
vertical-align: middle;

31
htdocs/scss/app/mobile.scss
View File

@ -14,13 +14,26 @@ textarea {
padding-bottom: 4px;
}
.head-logo {
border: 1px $border-color solid;
border-radius: 6px;
display: block;
text-align: center;
font-size: $fs;
box-sizing: border-box;
padding-top: 14px;
padding-bottom: 14px;
&:hover {
border-color: $hover-hl;
}
//&-subtitle {
// font-size: $fs - 2px;
//}
}
.head-items {
text-align: center;
padding: 0 0 8px;
padding: 8px 0 16px;
white-space: nowrap;
overflow-x: auto;
overflow-y: hidden;
@ -50,14 +63,20 @@ a.head-item:last-child > span {
.index-book-image {
float: none;
width: 100%;
padding-bottom: 154%;
//max-width: 300px;
margin: 0 auto 15px;
background-size: 200%;
width: 300px;
height: auto;
max-width: 100%;
padding-bottom: 154%;
background-size: 200%;
background-position: 0 0 !important;
}
.index-book-image-wrap {
float: none;
width: 300px;
height: auto;
margin: 0 auto 15px;
max-width: 100%;
}
.index-book-updates {
float: none;
text-align: center;

2
skin/base.phps
View File

@ -208,7 +208,7 @@ return <<<HTML
<div class="head-logo">
<a href="/">
<div class="head-logo-title">4in1 <span class="head-logo-title-author">by idb</span></div>
<div class="head-logo-subtitle">Mask of Shakespeare, Mysteries of Bacon,<br/>Book by Cartier, Secrets of the NSA</div>
<div class="head-logo-subtitle">Mask of Shakespeare, Mysteries of Bacon,<br>Book by Cartier, Secrets of the NSA</div>
</a>
</div>
</div>

2
skin/main.phps
View File

@ -9,7 +9,9 @@ function index($ctx) {
return <<<HTML
<div class="page"><div class="blog-post-text">
<div class="clearfix index-book">
<div class="index-book-image-wrap">
<a class="index-book-image" id="index-book-image" href="https://files.4in1.ws/Images/4in1-cover-en.png" target="_blank" data-link-template="https://files.4in1.ws/Images/4in1-cover-{lang}.png"></a>
</div>
<a class="index-dl-line" href="https://files.4in1.ws/4in1-en.pdf?4" onmouseenter="IndexPage.setCoverLang('en')">
<b>Download in English</b><br>