kiwix/kiwix-desktop
1
0
Fork 0
mirror of https://github.com/kiwix/kiwix-desktop.git synced 2025-09-23 03:58:56 -04:00
Code Issues Packages Projects Releases Wiki Activity

Better style for contentManager.

Browse Source
This commit is contained in:
Matthieu Gautier 2018-10-26 13:43:40 +02:00
parent 5a6bafc8e1
commit d72dc72a21
2 changed files with 77 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
resources/css/style.css
View File

@ -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;
}

64
resources/texts/_contentManager.html
View File

@ -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) }}