diff --git a/appinfo/info.xml b/appinfo/info.xml index 824794b..bd818e3 100644 --- a/appinfo/info.xml +++ b/appinfo/info.xml @@ -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 - 0.6.0 + 0.6.1 agpl jiaxinhuang NCDownloader diff --git a/img/add.svg b/img/add.svg new file mode 100644 index 0000000..b999b44 --- /dev/null +++ b/img/add.svg @@ -0,0 +1 @@ + diff --git a/img/delete.svg b/img/delete.svg new file mode 100644 index 0000000..72c15db --- /dev/null +++ b/img/delete.svg @@ -0,0 +1 @@ + diff --git a/img/download.svg b/img/download.svg new file mode 100644 index 0000000..e551a6c --- /dev/null +++ b/img/download.svg @@ -0,0 +1 @@ + diff --git a/img/play.svg b/img/play.svg index e8bf27c..60ed2ea 100644 --- a/img/play.svg +++ b/img/play.svg @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/img/power.svg b/img/power.svg index 6fb9756..1b69016 100644 --- a/img/power.svg +++ b/img/power.svg @@ -1,4 +1,4 @@ - + \ No newline at end of file diff --git a/img/refresh.svg b/img/refresh.svg index 74244ca..56c43a8 100644 --- a/img/refresh.svg +++ b/img/refresh.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/img/trash.svg b/img/trash.svg index 152e15c..2e990cc 100644 --- a/img/trash.svg +++ b/img/trash.svg @@ -1,4 +1,4 @@ - + \ No newline at end of file diff --git a/src/css/style.scss b/src/css/style.scss index 7a99d38..f64282e 100644 --- a/src/css/style.scss +++ b/src/css/style.scss @@ -2,166 +2,181 @@ padding-left: 4%; } -.action-item { - position: relative; -} +#app-ncdownloader-wrapper { + width: 100%; -a { - color : #337ab7; - text-decoration: none; -} + .action-item { + position: relative; + } -#ncdownloader-form-wrapper { - margin-left: 2px; + a { + color : #337ab7; + text-decoration: none; + } - .form-input-wrapper { - display : flex; - flex-flow: row nowrap; + .icon-power { + background-image: url('../../img/power.svg'); + } - select input { - justify-content: left; + .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; + + .form-input-wrapper { + display : flex; + flex-flow: row nowrap; + + select input { + justify-content: left; + } } } -} -a:hover, -a:focus { - color : #23527c; - text-decoration: underline; -} + a:hover, + a:focus { + color : #23527c; + text-decoration: underline; + } -a:focus { - outline : 5px auto -webkit-focus-ring-color; - outline-offset: -2px; -} + a:focus { + outline : 5px auto -webkit-focus-ring-color; + outline-offset: -2px; + } + + div .number { + background : none repeat scroll 0 0 #5f5853; + border-radius: 999px; + color : #FFFFFF; + display : inline-block; + font-size : 15px; + font-style : italic; + height : 20px; + line-height : 20px; + margin-right : 10px; + padding : 0 8px; + } + + #ncdownloader-form-wrapper input[type=text] { + padding: 0px 5px; + flex : auto; + } + + #ncdownloader-table-data .table-cell { + padding-left: 4px; + } + + #ncdownloader-action-links-container { + position: relative; + + .action-link-item a:hover { + background-color: #c2afaf; + } + + ul { + background-color: #ededed; + } + } + + .action-links { + /*visibility: hidden;*/ + display : none; + position : absolute; + background-color: #f1f1f1; + min-width : 60px; + box-shadow : 0px 8px 16px 0px rgba(0, 0, 0, 0.2); + z-index : 9999; + } + + .action-link-item a { + color : black; + padding : 6px 6px; + text-decoration: none; + display : block; + } + + .ncdownloader-body-wrapper, + #ncdownloader-form-wrapper, + #ncdownloader-table-content { + width: 100%; + } + + .ncdownloader-body-wrapper { + padding-top: 0.3em; + } + + #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: rgb(236, 9, 9); + } + + .checkboxes label { + display : inline-block; + padding-right: 10px; + white-space : nowrap; + } + + .checkboxes input { + vertical-align: middle; + } + + .checkboxes label span { + vertical-align: middle; + } + + &>#app-navigation:not(.vue)>ul>li>a { + padding: 0 12px 0 44px; + } + + .button-container [class^='icon-'], + .button-container [class*=' icon-'] { + background-repeat : no-repeat; + background-position: center; + /* min-width : 18px; */ + min-height : 24px; + } -div .number { - background : none repeat scroll 0 0 #5f5853; - border-radius: 999px; - color : #FFFFFF; - display : inline-block; - font-size : 15px; - font-style : italic; - height : 20px; - line-height : 20px; - margin-right : 10px; - padding : 0 8px; } #ncdownloader-settings-form input[type=text] { width: 160px; } -#ncdownloader-form-wrapper input[type=text] { - padding: 0px 5px; - flex : auto; -} - -#ncdownloader-table-data .table-cell { - 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; - - .action-link-item a:hover { - background-color: #c2afaf; - } - - ul { - background-color: #ededed; - } -} - -.action-links { - /*visibility: hidden;*/ - display : none; - position : absolute; - background-color: #f1f1f1; - min-width : 60px; - box-shadow : 0px 8px 16px 0px rgba(0, 0, 0, 0.2); - z-index : 9999; -} - -.action-link-item a { - color : black; - padding : 6px 6px; - text-decoration: none; - display : block; -} - -.app-ncdownloader, -#app-ncdownloader-wrapper, -.ncdownloader-body-wrapper, -#ncdownloader-form-wrapper, -#ncdownloader-table-content { - width: 100%; -} - -.ncdownloader-body-wrapper { - 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-navigation-entry-bullet { - background-color: rgb(80, 80, 173); -} - -.notinstalled { - color: red; -} - -.checkboxes label { - display : inline-block; - padding-right: 10px; - white-space : nowrap; -} - -.checkboxes input { - vertical-align: middle; -} - -.checkboxes label span { - vertical-align: middle; -} - -#app-ncdownloader-wrapper>#app-navigation:not(.vue)>ul>li>a { - padding: 0 12px 0 44px; -} - -.button-container [class^='icon-'], -.button-container [class*=' icon-'] { - background-repeat : no-repeat; - background-position: center; - /* min-width : 18px; */ - min-height : 24px; -} - @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) {