pisto/ncdownloader
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed the color of all icons to #397ca1 so they work better both against white and dark background;nested all children rules under app-ncdownloader-wrapper

Browse Source
This commit is contained in:
huangjx
2022-02-18 15:34:45 +08:00
parent 73855bc69d
commit d25e0c1ec1
9 changed files with 168 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
appinfo/info.xml
View File

@@ -8,7 +8,7 @@ Search for torrents within the app from mutiple BT sites;
Control Aria2 and manage download tasks from the web;
download videos from 700+ video sites(youtube,youku,vimo,dailymotion,twitter,facebook and the likes
</description>
<version>0.6.0</version>
<version>0.6.1</version>
<licence>agpl</licence>
<author mail="freefallbenson@gmail.com" homepage="https://github.com/shiningw">jiaxinhuang</author>
<namespace>NCDownloader</namespace>

1
img/add.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" version="1.1" viewbox="0 0 16 16" fill="#397ca1" style="fill:#397ca1"><path d="M9.02 13.98h-2v-5h-5v-2h5v-5h2v5l5-.028V8.98h-5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 200 B

1
img/delete.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 16 16" width="16" height="16" fill="#397ca1" style="fill:#397ca1"><path d="M6.5 1L6 2H3c-.554 0-1 .446-1 1v1h12V3c0-.554-.446-1-1-1h-3l-.5-1zM3 5l.875 9c.06.55.573 1 1.125 1h6c.552 0 1.064-.45 1.125-1L13 5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 283 B

1
img/download.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 16 16" width="16" height="16" fill="#397ca1" style="fill:#397ca1"><path d="M6 1h4v7h5l-7 7-7-7h5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 174 B

2
img/play.svg
View File

@@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#fff" style="fill:#fff" class="bi bi-play" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#397ca1" style="fill:#397ca1" class="bi bi-play" viewBox="0 0 16 16">
<path d="M10.804 8 5 4.633v6.734L10.804 8zm.792-.696a.802.802 0 0 1 0 1.392l-6.363 3.692C4.713 12.69 4 12.345 4 11.692V4.308c0-.653.713-.998 1.233-.696l6.363 3.692z"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 309 B

After

Width:  |  Height:  |  Size: 315 B

2
img/power.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-power" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#397ca1" style="fill:#397ca1" class="bi bi-power" viewBox="0 0 16 16">
<path d="M7.5 1v7h1V1h-1z"/>
<path d="M3 8.812a4.999 4.999 0 0 1 2.578-4.375l-.485-.874A6 6 0 1 0 11 3.616l-.501.865A5 5 0 1 1 3 8.812z"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 273 B

After

Width:  |  Height:  |  Size: 289 B

2
img/refresh.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#fff" style="fill:#fff"><path d="M13.5 2c-5.621 0-10.211 4.443-10.475 10h-3.025l5 6.625 5-6.625h-2.975c.257-3.351 3.06-6 6.475-6 3.584 0 6.5 2.916 6.5 6.5s-2.916 6.5-6.5 6.5c-1.863 0-3.542-.793-4.728-2.053l-2.427 3.216c1.877 1.754 4.389 2.837 7.155 2.837 5.79 0 10.5-4.71 10.5-10.5s-4.71-10.5-10.5-10.5z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="#397ca1" style="fill:#397ca1"><path d="M13.5 2c-5.621 0-10.211 4.443-10.475 10h-3.025l5 6.625 5-6.625h-2.975c.257-3.351 3.06-6 6.475-6 3.584 0 6.5 2.916 6.5 6.5s-2.916 6.5-6.5 6.5c-1.863 0-3.542-.793-4.728-2.053l-2.427 3.216c1.877 1.754 4.389 2.837 7.155 2.837 5.79 0 10.5-4.71 10.5-10.5s-4.71-10.5-10.5-10.5z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 401 B

After

Width:  |  Height:  |  Size: 407 B

2
img/trash.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#fff" style="fill:#fff" class="bi bi-trash" viewBox="0 0 16 16">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#397ca1" style="fill:#397ca1" class="bi bi-trash" viewBox="0 0 16 16">
<path d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z"/>
<path fill-rule="evenodd" d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 583 B

After

Width:  |  Height:  |  Size: 589 B

72
src/css/style.scss
View File

@@ -2,6 +2,9 @@
padding-left: 4%;
}
#app-ncdownloader-wrapper {
width: 100%;
.action-item {
position: relative;
}
@@ -11,6 +14,34 @@ a {
text-decoration: none;
}
.icon-power {
background-image: url('../../img/power.svg');
}
.icon-purge {
background-image: url('../../img/trash.svg');
}
.icon-unpause {
background-image: url('../../img/play.svg');
}
.icon-refresh {
background-image: url('../../img/refresh.svg');
}
.icon-delete {
background-image: url('../../img/delete.svg');
}
.icon-download {
background-image: url('../../img/download.svg');
}
.icon-add {
background-image: url('../../img/add.svg');
}
#ncdownloader-form-wrapper {
margin-left: 2px;
@@ -48,10 +79,6 @@ div .number {
padding : 0 8px;
}
#ncdownloader-settings-form input[type=text] {
width: 160px;
}
#ncdownloader-form-wrapper input[type=text] {
padding: 0px 5px;
flex : auto;
@@ -61,22 +88,6 @@ div .number {
padding-left: 4px;
}
.icon-power {
background-image: url('../../img/power.svg');
}
.icon-purge {
background-image: url('../../img/trash.svg');
}
.icon-unpause {
background-image: url('../../img/play.svg');
}
.icon-refresh {
background-image: url('../../img/refresh.svg');
}
#ncdownloader-action-links-container {
position: relative;
@@ -106,8 +117,6 @@ div .number {
display : block;
}
.app-ncdownloader,
#app-ncdownloader-wrapper,
.ncdownloader-body-wrapper,
#ncdownloader-form-wrapper,
#ncdownloader-table-content {
@@ -118,22 +127,22 @@ div .number {
padding-top: 0.3em;
}
.app-ncdownloader #app-content-wrapper {
flex-wrap: wrap;
}
#app-content-wrapper #ncdownloader-table-content .table-cell {
border-bottom: 1px solid #9d9595;
border-left : 1px solid #eee;
}
#app-content-wrapper {
flex-wrap: wrap;
}
.app-navigation-entry-bullet {
background-color: rgb(80, 80, 173);
}
.notinstalled {
color: red;
color: rgb(236, 9, 9);
}
.checkboxes label {
@@ -150,7 +159,7 @@ div .number {
vertical-align: middle;
}
#app-ncdownloader-wrapper>#app-navigation:not(.vue)>ul>li>a {
&>#app-navigation:not(.vue)>ul>li>a {
padding: 0 12px 0 44px;
}
@@ -162,6 +171,12 @@ div .number {
min-height : 24px;
}
}
#ncdownloader-settings-form input[type=text] {
width: 160px;
}
@media only screen and (min-width: 800px) {}
@media only screen and (max-width: 1024px) {
@@ -175,7 +190,6 @@ div .number {
}
}
/* from bootstrap */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {