Tweak behavior for mobile devices
This commit is contained in:
db-2001
parent
2a76b7ee5d
commit
b3b7b31f7d
@ -6,6 +6,7 @@
|
||||
<link id='basestyle' rel="stylesheet" href="styles/base.css">
|
||||
<link id='librarystyle' rel="stylesheet" href="styles/style_default.css">
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<wrapper>
|
||||
|
||||
@ -487,7 +487,7 @@ function CreateSearchResult(manga, connector) {
|
||||
|
||||
folderRow = document.createElement('row');
|
||||
folderLabel = document.createElement('label');
|
||||
folderLabel.innerText = 'Download Folder:';
|
||||
folderLabel.innerText = 'Download Folder';
|
||||
folderRow.appendChild(folderLabel);
|
||||
folderInput = document.createElement('input');
|
||||
downloadFolder = manga.folderName;
|
||||
@ -499,7 +499,7 @@ function CreateSearchResult(manga, connector) {
|
||||
|
||||
intervalRow = document.createElement('row');
|
||||
intervalLabel = document.createElement('label');
|
||||
intervalLabel.innerText = 'Job Interval:';
|
||||
intervalLabel.innerText = 'Job Interval';
|
||||
intervalRow.appendChild(intervalLabel);
|
||||
intervalInput = document.createElement('input');
|
||||
intervalInput.placeholder = '03:00:00 (HH:MM:SS)';
|
||||
@ -510,7 +510,7 @@ function CreateSearchResult(manga, connector) {
|
||||
|
||||
chapterRow = document.createElement('row');
|
||||
chapterLabel = document.createElement('label');
|
||||
chapterLabel.innerText = 'Download from Chapter:';
|
||||
chapterLabel.innerText = 'Download from Chapter';
|
||||
chapterRow.appendChild(chapterLabel);
|
||||
chapterInput = document.createElement('input');
|
||||
chapterInput.placeholder = (manga.ignoreChaptersBelow + 1).toString();
|
||||
|
||||
@ -913,16 +913,13 @@ popup-content #loaderdiv {
|
||||
|
||||
#newMangaResult > .section-item {
|
||||
flex-direction: row;
|
||||
min-height: 300px;
|
||||
flex-grow: 0;
|
||||
width: auto;
|
||||
height: auto;
|
||||
padding: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
img-container {
|
||||
height: 100%;
|
||||
height: 300px;
|
||||
width: 200px;
|
||||
position: relative;
|
||||
left: 0;
|
||||
@ -971,28 +968,26 @@ span.latest-chapter-no {
|
||||
}
|
||||
|
||||
div.new-manga-download-settings {
|
||||
position: absolute;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
width: calc(100%-20px);
|
||||
height: auto;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.new-manga-download-settings > row {
|
||||
width: 50%;
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
margin-left: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.new-manga-download-settings > row > label {
|
||||
margin-left: 15px;
|
||||
text-wrap: nowrap;
|
||||
font-size: 11pt;
|
||||
font-size: 10pt;
|
||||
font-weight: bold;
|
||||
color: #474646;
|
||||
}
|
||||
|
||||
.new-manga-download-settings > row > input {
|
||||
@ -1004,14 +999,42 @@ div.new-manga-download-settings {
|
||||
border-style: solid;
|
||||
border-color: lightgray;
|
||||
outline: none;
|
||||
text-align: end;
|
||||
float: right;
|
||||
width: 300px;
|
||||
width: 100%;
|
||||
}
|
||||
.new-manga-download-settings > row > input:focus {
|
||||
border-color: var(--secondary-color);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
/* For mobile phones: */
|
||||
.section-item > img-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
tag-cloud {
|
||||
display: none !important;
|
||||
}
|
||||
.new-manga-download-settings > row, .downloadManga, border-bar-button.in-library {
|
||||
width: calc(100% - 25px) !important;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
popup popup-window {
|
||||
width: 100%;
|
||||
height: calc(100% - var(--topbar-height));
|
||||
top: var(--topbar-height);
|
||||
left: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.section-item {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.section-item > .jobImage {
|
||||
height: 100%;
|
||||
width: auto;
|
||||
@ -1130,17 +1153,16 @@ author-tag > img {
|
||||
|
||||
.mangaDescription {
|
||||
font-size: 10pt;
|
||||
max-height: 120px;
|
||||
overflow-y: auto;
|
||||
padding: 4px;
|
||||
height: auto;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.downloadManga {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
position: relative;
|
||||
float: right;
|
||||
width: fit-content;
|
||||
margin: 5px 5px 0 auto;
|
||||
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
@ -1148,9 +1170,10 @@ author-tag > img {
|
||||
}
|
||||
|
||||
border-bar-button.in-library {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
position: relative;
|
||||
float: right;
|
||||
margin: 5px 5px 0 auto;
|
||||
width: fit-content;
|
||||
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
@ -1159,6 +1182,7 @@ border-bar-button.in-library {
|
||||
background-color: #08962e;
|
||||
color: #fff;
|
||||
border: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
border-bar-button.in-library:hover {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user