summaryrefslogtreecommitdiffstats
path: root/css
diff options
context:
space:
mode:
Diffstat (limited to 'css')
-rw-r--r--css/admin.scss (renamed from css/admin.css)0
-rw-r--r--css/app.scss (renamed from css/app.css)0
-rw-r--r--css/content.css722
-rw-r--r--css/explore.css19
-rw-r--r--css/explore.scss73
-rw-r--r--css/merged.scss9
-rw-r--r--css/mobile.css (renamed from css/mobile.scss)2
-rw-r--r--css/navigation.scss (renamed from css/navigation.css)93
-rw-r--r--css/settings.css2
-rw-r--r--css/shortcuts.css4
10 files changed, 90 insertions, 834 deletions
diff --git a/css/admin.css b/css/admin.scss
index fe8f2e9dd..fe8f2e9dd 100644
--- a/css/admin.css
+++ b/css/admin.scss
diff --git a/css/app.css b/css/app.scss
index 6e0124139..6e0124139 100644
--- a/css/app.css
+++ b/css/app.scss
diff --git a/css/content.css b/css/content.css
deleted file mode 100644
index d8fca2e9a..000000000
--- a/css/content.css
+++ /dev/null
@@ -1,722 +0,0 @@
-/**
- * Nextcloud - News
- *
- * This file is licensed under the Affero General Public License version 3 or
- * later. See the COPYING file.
- *
- * @author Bernhard Posselt <dev@bernhard-posselt.com>
- * @copyright Bernhard Posselt 2014
- */
-
-#app-content {
- width: 100%;
- flex-basis: auto;
-}
-
-#app-navigation:not(.hidden) + #app-content {
- width: calc(100% - 300px);
-}
-
-#app-content #searchresults {
- display: none;
-}
-
-#app-content #text-content {
- padding: 20px;
-}
-
-#app-content #text-content h1 {
- font-size: 18pt;
- margin-bottom: 15px;
-}
-
-#app-content #text-content p {
- font-size: 11pt;
-}
-
-#app-content .no-feeds-available {
- text-align: center;
- color: var(--color-text-lighter);
- font-size: 16pt;
- min-height: 100%;
- height: 100%;
- width: 100%;
- display: table;
-}
-
-#app-content .no-feeds-available p {
- vertical-align: middle;
- display: table-cell;
-}
-
-#articles {
- width: 100%;
-}
-
-/**
- * Podcast settings
- */
-#app-content .podcast {
- height: 50px;
- z-index: 10000;
- background-color: #111;
- display: flex;
- position: sticky;
- top: 50px;
- align-items: center;
-}
-
-#app-content .podcast audio {
- display: block;
- width: calc(100% - 60px);
- border-radius: 0;
- height: inherit;
-}
-
-#app-content .podcast button,
-#app-content .podcast a {
- display: block;
- float: left;
- height: 30px;
- width: 30px;
- border: 0;
- border-radius: 0;
- margin: 0;
- background-color: transparent;
- background-repeat: no-repeat;
- background-position: center;
-}
-
-#app-content .podcast-close {
- background-size: 25px;
- background-image: url('../img/close.svg');
-}
-
-#app-content .podcast-download {
- transform: rotate(270deg);
- background-size: 20px;
- background-image: url('../img/arrow-white.svg');
-}
-
-#app-content .podcast audio::-webkit-media-controls-enclosure {
- max-width: inherit;
-}
-
-#app-content .podcast.fixed {
- position: absolute;
- right: 0;
- left: 0;
-}
-
-#notification a {
- text-decoration: underline;
- color: blue;
-}
-
-#notification li {
- display: block;
-}
-
-/**
- * Content styles
- */
-#app-content.loading-content {
- background: url('../img/loading.gif') no-repeat;
- background-color: var(--color-main-background);
- background-position: calc(50% - 16px) calc(50% - 16px);
- /* Overrides the snap.js animation making the loading icon to fly in app-content. */
- transition: none !important;
- -webkit-transition: none !important;
- -moz-webkit-transition: none !important;
-}
-
-#app-content.loading-content #app-content-wrapper {
- display: none;
-}
-
-#app-content:not(.explore) #articles:after {
- content: '';
- display: block;
- height: 100%;
- background-repeat: no-repeat;
-}
-
-#app-content .autopaging: #articles:after {
- content: '';
- background-image: url('../img/loading.gif');
- background-position: calc(50% - 16px) calc(50% - 16px);
- /* Overrides the snap.js animation making the loading icon to fly in app-content. */
- transition: none !important;
- -webkit-transition: none !important;
- -moz-webkit-transition: none !important;
-}
-
-#app-content .finished-auto-paging #articles:after {
- background: var(--color-main-background);
-}
-
-/**
- *
- */
-.pull-to-refresh {
- height: 0;
- overflow: hidden;
- text-align: center;
- background-image: -moz-linear-gradient(top, #eee 0%, #fefefe 100%);
- background-image: -webkit-linear-gradient(top, #eee 0%, #fefefe 100%);
- background-image: -ms-linear-gradient(top, #eee 0%, #fefefe 100%);
- background-image: linear-gradient(top, #eee 0%, #fefefe 100%);
-}
-
-.pull-to-refresh.show-pull-to-refresh {
- transition: all 0.5s ease;
- padding-top: 10px;
- height: 44px;
-}
-
-
-/**
- * Rules for a single feed item
- */
-#app-content .only-in-expanded {
- display: block;
-}
-
-#app-content .compact .only-in-expanded {
- display: none;
-}
-
-#app-content .only-in-compact {
- display: none;
-}
-
-#app-content .compact .only-in-compact {
- display: block;
-}
-
-#app-content .item {
- cursor: default;
- border-bottom: 1px solid var(--color-border);
-}
-
-#app-content .item.active {
- background-image: linear-gradient(to right, orange 0, orange 2px, transparent 2px);
-}
-
-#app-content .compact li.item div.utils:hover {
- background-color: var(--color-background-hover);
-}
-
-#app-content :not(.compact) .item {
-}
-
-#app-content .item:last-child {
- border-bottom: 0;
-}
-
-/**
- * Utils panel
- */
-#app-content .utils {
- width: 100%;
- line-height: 52px;
- box-sizing: border-box;
- padding: 15px 50px 0 15px;
- position: relative;
-}
-
-#app-content .compact .utils {
- cursor: pointer;
- padding: 0 15px 0 0;
- -webkit-position: sticky;
- position: sticky;
- top: 50px;
- background-color: var(--color-main-background);
- min-height: 43px;
-}
-
-/* Only apply opacity to the util bar, not the dropdown */
-#app-content .compact .utils ul {
- opacity: 0.9;
-}
-
-#app-content .utils ul {
- height: 43px;
- list-style-type: none;
- display: flex;
- margin: 0;
- padding: 0;
-}
-
-#app-content .open .utils ul {
- height: auto;
-}
-
-#app-content .utils ul > li {
- min-width: 0;
-}
-
-#app-content .util-spacer {
- width: 20px;
-}
-
-#app-content .compact .util-spacer {
- width: 19px;
-}
-
-#app-content .utils li {
- line-height: 43px;
- vertical-align: middle;
-}
-
-#app-content .utils > ul > li:last-child {
- padding-right: 0;
-}
-
-#app-content .utils > ul > li:first-child {
- padding-left: 0;
-}
-
-#app-content .utils .util {
- padding: 0 6px;
-}
-
-#app-content .utils .article-action-plugins {
-
-}
-
-#app-content .utils button,
-#app-content .utils .external {
- padding: 0;
- margin: 0;
- height: 43px;
- width: 40px;
- border: 0;
- float: left;
- background-color: transparent;
- background-size: 100%;
- background-repeat: no-repeat;
- background-size: 25px;
- background-position: center;
-}
-
-#app-content .utils .external,
-#app-content .utils .menu button,
-#app-content .utils .icon-toggle {
- display: inline-block;
- opacity: 0.3;
-}
-
-#app-content .utils .external:hover,
-#app-content .utils .menu button:hover,
-#app-content .utils .icon-toggle:hover,
-#app-content .utils .icon-toggle.keep-unread {
- opacity: 1;
-}
-
-#app-content .utils .star {
- background-image: url('../img/inactive_star.svg');
-}
-
-#app-content .utils .starred {
- background-image: url('../img/active_star.svg');
-}
-
-#app-content .utils .star:hover {
- background-image: url('../img/hover_star.svg');
-}
-
-#app-content .utils .share {
- opacity: .3;
-}
-
-#app-content .utils .share:hover {
- opacity: 1;
-}
-
-#app-content .utils .more button {
- opacity: .3;
-}
-
-#app-content .utils .more button:hover {
- opacity: 1;
-}
-
-#app-content .utils .more {
- position: relative;
-}
-
-#app-content .article-actions {
- display: none;
- filter: drop-shadow(0 0 5px rgba(150, 150, 150, 0.75));
- -webkit-filter: drop-shadow(0 0 5px rgba(150, 150, 150, 0.75));
- -moz-filter: drop-shadow(0 0 5px rgba(150, 150, 150, 0.75));
- position: absolute;
- top: 40px;
- border-radius: 3px;
- z-index: 1000;
- border: 1px solid transparent;
- margin: 0;
- padding: 0;
-}
-
-#app-content .article-actions ul {
- display: flex;
- float: left;
-}
-
-#app-content .article-actions li {
- float: left;
- width: 40px !important;
-}
-
-#app-content #articles:not(.compact) .article-actions {
- left: 6px;
-}
-
-#app-content #articles:not(.compact) .article-actions:after,
-#app-content #articles:not(.compact) .article-actions:before {
- left: 20px;
-}
-
-#app-content #articles.compact .article-actions {
- right: -10px;
-}
-
-#app-content #articles.compact .article-actions:after,
-#app-content #articles.compact .article-actions:before {
- right: 9px;
-}
-
-#app-content .article-actions:after,
-#app-content .article-actions:before {
- bottom: 100%;
- border: solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
-}
-
-#app-content .article-actions:after {
- border-color: rgba(255, 255, 255, 0);
- border-bottom-color: var(--color-border);
- border-width: 5px;
- margin-left: -5px;
-}
-
-#app-content .article-actions:before {
- border-color: rgba(255, 255, 255, 0);
- border-bottom-color: var(--color-border);
- border-width: 9px;
- margin-left: -9px;
-}
-
-/**
- * Article title
- */
-#app-content .utils .title {
- width: 100%;
- padding-left: 45px;
- background-position: 10px 12px;
- background-size: 20px 20px;
- background-repeat: no-repeat;
-}
-
-#app-content .compact .utils .title h1 {
- line-height: 1;
-}
-
-#app-content .feed-view .utils .title {
- background: none !important;
- padding-left: 10px;
-}
-
-#app-content .utils .title h1 a {
- /*text-overflow: ellipsis;*/
- white-space: nowrap;
- overflow: hidden;
- width: 100%;
- display: inline-block;
- color: var(--color-main-text);
- font-weight: bold;
- font-size: 16px;
- line-height: 1.5;
- padding-top: 8px;
- min-height: 40px;
-}
-
-#app-content .open .title .intro {
- display: none;
-}
-
-#app-content .title .intro {
- color: var(--color-text-lighter);
- font-size: 10pt;
- font-weight: normal;
- margin-left: 20px;
-}
-
-#app-content .open .utils .title h1 a {
- overflow: auto;
- white-space: normal;
-}
-
-#app-content .read .utils .title h1 a {
- font-weight: normal;
- color: var(--color-text-lighter);
-}
-
-#app-content .utils .date {
- padding: 0 15px;
- margin-right: 25px;
-}
-
-
-/**
- * Expanded content
- */
-#app-content .heading {
- padding: 25px 0 10px 0;
-}
-
-#app-content .heading h1 {
- font-size: 19px;
- max-width: 770px;
- word-wrap: break-word;
-}
-
-#app-content .heading a {
- font-weight: bold;
- color: var(--color-main-text);
- text-decoration: none;
-}
-
-#app-content .heading a:hover {
- text-decoration: underline;
-}
-
-#app-content .heading .date {
- float: right;
- display: inline-block;
- font-size: 15px;
- padding: 0 10px;
-}
-
-#app-content .read .heading a {
- font-weight: normal !important;
- color: var(--color-text-lighter);
-}
-
-#app-content .feed-view .source {
- display: none;
-}
-
-#app-content .source img {
- height: 16px;
- display: inline-block;
- margin: 0 0 -2px 2px;
-}
-
-/**
- * Actual content
- */
-#app-content .article {
- min-height: 69px;
- padding: 0 50px 50px 50px;
-}
-
-#app-content .compact .article {
- display: none;
-}
-
-#app-content .open .article {
- display: block;
-}
-
-/**
- * Timestamp
- */
-#app-content .subtitle {
- color: var(--color-text-lighter);
- font-size: 15px;
- max-width: 770px;
- padding: 25px 0;
-}
-
-#app-content .subtitle a {
- color: var(--color-text-lighter);
-}
-
-#app-content .subtitle a:hover {
- text-decoration: underline;
-}
-
-#app-content .date {
- color: var(--color-text-lighter);
- white-space: nowrap;
-}
-
-/**
- * Author
- */
-#app-content .author {
- color: var(--color-text-lighter);
- font-size: 15px;
-}
-
-#app-content .author a {
- color: inherit;
-}
-
-#app-content .author a:hover {
- text-decoration: underline;
-}
-
-/**
- * Enclosure
- */
-#app-content .enclosure {
- padding: 20px 0;
- max-width: 770px;
- margin-bottom: 15px;
-}
-
-#app-content .enclosure audio,
-#app-content .enclosure video {
- width: 100%;
-}
-
-#app-content .enclosure video {
- background-color: #000;
- margin-bottom: 20px;
-}
-
-#app-content .enclosure-error {
- line-height: 1.5;
- height: 40px;
-}
-
-/**
- * Article body
- */
-#app-content .body {
- max-width: 770px;
- font-size: 14px;
- clear: both;
- overflow-x: auto;
-}
-
-#app-content .body p {
- line-height: 1.5;
- margin: 7px 0 14px 0;
-}
-
-#app-content .body img,
-#app-content .body table {
- max-width: 100%;
- height: auto;
- overflow: auto;
- word-wrap: break-word;
- white-space: normal;
-}
-
-#app-content .body iframe {
- max-width: 100%;
-}
-
-#app-content .body > div > img:first-child,
-#app-content .body > div > :first-child > img:first-child {
- padding: 0 14px 0 0;
- float: left;
-}
-
-#app-content .body h1,
-#app-content .body h2 {
- font-size: 17px;
- font-weight: bold;
- color: var(--color-main-text);
- margin: 21px 0 5px 0;
-}
-
-#app-content .body h3 {
- font-size: 15px;
- font-weight: bold;
- color: var(--color-main-text);
- margin: 21px 0 0 0;
- text-decoration: underline;
-}
-
-#app-content .body h4,
-#app-content .body h5,
-#app-content .body h6 {
- font-weight: bold;
-}
-
-#app-content .body > div {
- margin: 7px 0;
-}
-
-#app-content .body a {
- color: #0c76ff;
- text-decoration: underline;
-}
-
-#app-content .body ul {
- margin: 7px 0;
- padding-left: 14px;
- list-style-type: disc;
-}
-
-#app-content .body ol {
- margin: 7px 0;
- padding-left: 21px;
-}
-
-#app-content .body ul li {
- cursor: default;
- line-height: 21px;
-}
-
-#app-content .body pre {
- padding: 7px 7px 7px 14px;
- background-color: var(--color-background-darker);
- border: 1px solid var(--color-border-dark);
- margin: 7px 0 14px 0;
- overflow-y: auto;
-}
-
-#app-content .body pre::-webkit-scrollbar {
- height: 10px;
-}
-
-#app-content .body pre::-webkit-scrollbar-thumb {
- background: #333;
-}
-
-#app-content .body pre::-webkit-scrollbar-track-piece {
- background: #ddd;
-}
-
-#app-content .body code,
-#app-content .body pre {
- font-family: monospace;
- font-size: 16px;
-}
-
-#app-content .body blockquote {
- border-left: 1px solid rgb(210, 210, 210);
- margin: 25px 0;
- padding: 0 0 0 15px;
- font-style: italic;
-}
-
-#app-content .body em {
- font-style: italic;
- opacity: 1;
-}
-
-#app-content *[dir=rtl] {
- text-align: right;
-}
diff --git a/css/explore.css b/css/explore.css
new file mode 100644
index 000000000..155ff450e
--- /dev/null
+++ b/css/explore.css
@@ -0,0 +1,19 @@
+/**
+ * Nextcloud - News
+ *
+ * This file is licensed under the Affero General Public License version 3 or
+ * later. See the COPYING file.
+ *
+ * @author Bernhard Posselt <dev@bernhard-posselt.com>
+ * @copyright 2020, Jan C. Borchardt, https://jancborchardt.net
+ * @copyright Bernhard Posselt 2014
+ */
+
+/**
+ * Explore styles
+ */
+.explore #app-content-wrapper {
+ height: 100%;
+}
+
+/*# sourceMappingURL=explore.css.map */
diff --git a/css/explore.scss b/css/explore.scss
index d459ae825..0c1ca67e3 100644
--- a/css/explore.scss
+++ b/css/explore.scss
@@ -21,44 +21,37 @@
width: 100%;
padding: 45px 0 45px 45px;
- .grid-item {
- width: 300px;
- border: 2px solid var(--color-border);
- border-radius: var(--border-radius-large);
- margin: 0 24px 24px 0;
- padding: 24px;
-
- .explore-title {
- background-repeat: no-repeat;
- background-position: 0 center;
- background-size: 24px;
- padding-left: 32px;
-
- a {
- word-wrap: break-word;
-
- &:hover,
- &:focus {
- text-decoration: underline;
- }
- }
- }
-
- .explore-logo {
- text-align: center;
- margin-top: 25px;
-
- img {
- width: 100%;
- }
- }
-
- .explore-subscribe {
- margin-top: 16px;
- max-width: 100%;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- }
+ .grid-item {
+ width: 300px;
+ border: 2px solid var(--color-border);
+ border-radius: var(--border-radius-large);
+ margin: 0 24px 24px 0;
+ padding: 24px;
+
+ .explore-title {
+ background-repeat: no-repeat;
+ background-position: 0 center;
+ background-size: 24px;
+ padding-left: 32px;
+
+ a {
+ word-wrap: break-word;
+
+ &:hover,
+ &:focus {
+ text-decoration: underline;
+ }
+ }
+ }
+
+ .explore-logo {
+ text-align: center;
+ margin-top: 25px;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ }
}
diff --git a/css/merged.scss b/css/merged.scss
new file mode 100644
index 000000000..0720831e3
--- /dev/null
+++ b/css/merged.scss
@@ -0,0 +1,9 @@
+@import 'explore';
+@import 'admin';
+@import 'app';
+@import 'content';
+@import 'custom';
+@import 'mobile';
+@import 'navigation';
+@import 'settings';
+@import 'shortcuts';
diff --git a/css/mobile.scss b/css/mobile.css
index 02271a263..3f2dc6343 100644
--- a/css/mobile.scss
+++ b/css/mobile.css
@@ -1,4 +1,4 @@
-@media only screen and (max-width: $breakpoint_mobile) {
+@media only screen and (max-width: 1024px) {
#app-content .utils .date {
display: none;
}
diff --git a/css/navigation.css b/css/navigation.scss
index 80538715f..444d8d171 100644
--- a/css/navigation.css
+++ b/css/navigation.scss
@@ -7,6 +7,9 @@
* @author Bernhard Posselt <dev@bernhard-posselt.com>
* @copyright Bernhard Posselt 2014
*/
+#app-navigation {
+ overflow-y: hidden !important;
+}
/* add new feed or folder */
/* button */
@@ -31,64 +34,12 @@
background-position: 14px center;
}
-#app-navigation .add-new .heading button {
-}
-
-
-/* actual form content */
-#app-navigation .add-new-popup {
- display: none;
- padding: 10px;
- width: 100%;
- border-top: 1px solid var(--color-border-dark);
- border-bottom: 1px solid var(--color-border-dark);
-}
-
-
-#app-navigation input.ng-invalid {
- border: 1px solid var(--color-error);
-}
-
-#app-navigation .add-new-popup input,
-#app-navigation .add-new-popup select {
- width: 100%;
- height: 36px;
- padding: 5px;
- margin-right: 0;
-}
-
-#app-navigation .add-new-popup select,
-#app-navigation #new-feed [name="folderName"] {
- width: calc(100% - 36px);
- border-right: 0;
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- float: left;
-}
-
-#app-navigation .add-new-popup .add-new-folder-primary {
- border-bottom-left-radius: 0;
- border-top-left-radius: 0;
- width: 36px;
- height: 36px;
- margin-left: 0;
- margin-right: 0;
-}
-
-#app-navigation .add-new-popup .add-new-basicauth-toggle {
- padding: 5px 0;
-}
-
-#app-navigation .add-new-popup .add-feed-basicauth {
- width: 100%;
- padding: 0 0 10px;
-}
-
-#app-navigation .add-new-popup .error {
- padding: 0 0 10px 0;
+/* navigation */
+#app-navigation ul.with-icon > li > a,
+#app-navigation ul.with-icon > li > ul > li > a {
+ padding-left: 44px;
}
-/* navigation */
#app-navigation .icon-starred {
background-image: url('../img/starred.png');
}
@@ -97,6 +48,14 @@
background-image: url('../img/rss.svg') !important;
}
+.icon-rss-unread {
+ background-image: url('../img/rss_unread.svg') !important;
+}
+
+.icon-add-folder {
+ background-image: url('../img/add_folder.svg') !important;
+}
+
.icon-facebook {
background-image: url('../img/facebook.svg') !important;
}
@@ -105,7 +64,6 @@
background-image: url('../img/twitter.svg') !important;
}
-
.col-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
@@ -121,7 +79,7 @@
flex-wrap: wrap;
}
-.icon-dropdown{
+.icon-dropdown {
background-position: center !important;
background-size: 24px;
padding: 2em !important;
@@ -132,14 +90,13 @@
.icon-full-text-enabled {
background-image: url('../img/fulltext.svg');
background-size: 50%;
- opacity: .5;
+ opacity: 0.5;
}
-
.icon-full-text-disabled {
background-image: url('../img/nonfulltext.svg');
background-size: 50%;
- opacity: .5;
+ opacity: 0.5;
}
#app-navigation .unread > a {
@@ -177,10 +134,10 @@
white-space: nowrap;
}
-#app-navigation .error-message:hover .title
-#app-navigation .error-message:hover .message {
+// #app-navigation .error-message:hover .title
+// #app-navigation .error-message:hover .message {
-}
+// }
#app-navigation .error-message button {
top: 0;
@@ -196,7 +153,7 @@
background-image: url('../img/close.svg');
background-repeat: no-repeat;
background-position: right 5px top 5px;
- opacity: .9;
+ opacity: 0.9;
}
#app-navigation .error-message button:hover {
@@ -212,7 +169,7 @@
#app-navigation .animate-show.ng-hide-add-active,
#app-navigation .animate-show.ng-hide-remove-active {
- transition: .2s linear opacity;
+ transition: 0.2s linear opacity;
}
#app-navigation .animate-show {
@@ -231,8 +188,8 @@
transform: rotate(180deg);
}
-#app-navigation .feed-normal-ordering {
-}
+// #app-navigation .feed-normal-ordering {
+// }
#app-navigation .icon-pinned {
background-image: url('../img/pinned.svg');
diff --git a/css/settings.css b/css/settings.css
index f88c3bc41..24069bf01 100644
--- a/css/settings.css
+++ b/css/settings.css
@@ -36,7 +36,7 @@
padding-left: 18px;
}
-#app-settings-content label input[type="checkbox"] {
+#app-settings-content label input[type='checkbox'] {
margin-left: -18px;
max-width: 16px;
}
diff --git a/css/shortcuts.css b/css/shortcuts.css
index 64e18a7cf..5678b74b0 100644
--- a/css/shortcuts.css
+++ b/css/shortcuts.css
@@ -1,5 +1,5 @@
-#app-shortcuts {
-}
+// #app-shortcuts {
+// }
#app-shortcuts table {
border-collapse: collapse;
generated by cgit v1.2.3 (git 2.25.1) at 2024-05-22 18:06:17 +0000