mirror of
https://github.com/kiwix/kiwix-desktop.git
synced 2025-09-22 11:37:56 -04:00
Better style for contentManager.
This commit is contained in:
parent
5a6bafc8e1
commit
d72dc72a21
@ -177,3 +177,29 @@ QTabBar::close-button {
|
|||||||
border-top-right-radius: 5px;
|
border-top-right-radius: 5px;
|
||||||
border-bottom-right-radius: 5px;
|
border-bottom-right-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ----------------------------------------
|
||||||
|
Find Search page
|
||||||
|
*/
|
||||||
|
|
||||||
|
#sideBar {
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contentmanagerside QWidget{
|
||||||
|
background-color: white;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contentmanagerside QRadioButton:checked {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#contentmanagerside QRadioButton::indicator {
|
||||||
|
image: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contentmanagerside QCheckBox::indicator {
|
||||||
|
image: none;
|
||||||
|
}
|
||||||
|
@ -91,14 +91,34 @@ body {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
*:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
#searchInput {
|
||||||
|
background-image: url('qrc:///icons/search.svg');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: left top;
|
||||||
|
background-size: 40px 40px;
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
padding-left: 45px;
|
||||||
|
height: 40px;
|
||||||
|
width: 90%;
|
||||||
|
border: 1px solid #EEE;
|
||||||
|
}
|
||||||
#bookList {
|
#bookList {
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
.tablerow {
|
.tablerow,
|
||||||
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
.header {
|
||||||
|
color: #555;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
.tablecell{
|
.tablecell{
|
||||||
flex-basis:20%;
|
flex-basis:20%;
|
||||||
}
|
}
|
||||||
@ -107,11 +127,18 @@ padding: 0;
|
|||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
.tablerow > .cell1 {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
.cell0 > img {
|
.cell0 > img {
|
||||||
width: 24px;
|
width: 24px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
}
|
}
|
||||||
.cell1 {
|
.cell1,
|
||||||
|
.cell2,
|
||||||
|
.cell3,
|
||||||
|
.cell4,
|
||||||
|
.cell5 {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
summary::-webkit-details-marker {
|
summary::-webkit-details-marker {
|
||||||
@ -121,14 +148,25 @@ summary {
|
|||||||
height: 64px;
|
height: 64px;
|
||||||
}
|
}
|
||||||
.book {
|
.book {
|
||||||
border-top: 1px solid #99F;
|
border-top: 1px solid #EEE;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|
||||||
}
|
}
|
||||||
button {
|
button {
|
||||||
|
background: transparent;
|
||||||
|
border: 0px;
|
||||||
|
}
|
||||||
|
.tablerow button {
|
||||||
color: blue;
|
color: blue;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
border: 0px;
|
border: 0px;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
.tablerow button:hover {
|
||||||
|
color: white;
|
||||||
|
background: blue;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
@ -136,17 +174,17 @@ button {
|
|||||||
<div id="app">
|
<div id="app">
|
||||||
<div id="searchBar">
|
<div id="searchBar">
|
||||||
<form>
|
<form>
|
||||||
<input />
|
<input id="searchInput" type="text" placeholder="Search files" readonly/>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div id="bookList">
|
<div id="bookList">
|
||||||
<div class="header tablerow">
|
<div class="header">
|
||||||
<span class="tablecell cell0"></span>
|
<span class="tablecell cell0"></span>
|
||||||
<span class="tablecell cell1">File name</span>
|
<span class="tablecell cell1">File name</span>
|
||||||
<span class="tablecell cell1">Size</span>
|
<span class="tablecell cell2">Size</span>
|
||||||
<span class="tablecell cell1">Date</span>
|
<span class="tablecell cell3">Date</span>
|
||||||
<span class="tablecell cell1">Content type</span>
|
<span class="tablecell cell4">Content type</span>
|
||||||
<span class="tablecell cell1"></span>
|
<span class="tablecell cell5"></span>
|
||||||
</div>
|
</div>
|
||||||
<details v-for="book in books" class="book">
|
<details v-for="book in books" class="book">
|
||||||
<summary class="tablerow">
|
<summary class="tablerow">
|
||||||
@ -156,16 +194,16 @@ button {
|
|||||||
<span class="tablecell cell1">
|
<span class="tablecell cell1">
|
||||||
{{ book.title }}
|
{{ book.title }}
|
||||||
</span>
|
</span>
|
||||||
<span class="tablecell cell1">
|
<span class="tablecell cell2">
|
||||||
{{ niceBytes(book.size) }}
|
{{ niceBytes(book.size) }}
|
||||||
</span>
|
</span>
|
||||||
<span class="tablecell cell1">
|
<span class="tablecell cell3">
|
||||||
{{ book.date }}
|
{{ book.date }}
|
||||||
</span>
|
</span>
|
||||||
<span class="tablecell cell1">
|
<span class="tablecell cell4">
|
||||||
{{ book.tags }}
|
{{ book.tags }}
|
||||||
</span>
|
</span>
|
||||||
<span class="tablecell cell1">
|
<span class="tablecell cell5">
|
||||||
<template v-if="book.downloadId">
|
<template v-if="book.downloadId">
|
||||||
<span v-if="downloads[book.id]">
|
<span v-if="downloads[book.id]">
|
||||||
{{ niceBytes(downloads[book.id].completedLength) }} / {{ niceBytes(downloads[book.id].totalLength) }}
|
{{ niceBytes(downloads[book.id].completedLength) }} / {{ niceBytes(downloads[book.id].totalLength) }}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user