diff options
Diffstat (limited to 'css/content.css')
-rw-r--r-- | css/content.css | 722 |
1 files changed, 0 insertions, 722 deletions
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; -} |