Enhance the cards view in Feedly, and etc.
Feedly - Full width cards view by erimus-koo
Details
Authorerimus-koo
LicenseNo License
Categoryfeedly
Created
Updated
Size4.5 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name Feedly - Full width cards view
@version 20231201.13.54
@namespace userstyles.world/user/erimus-koo
@description Enhance the cards view in Feedly, and etc.
@author erimus-koo
@license No License
==/UserStyle== */
@-moz-document domain("feedly.com") {
/* ==UserStyle==
@name Feedly - Full width cards view
@version 20220904
@namespace userstyles.world/user/erimus-koo
@description Enhance the cards view in Feedly, and etc.
@author erimus-koo
@license No License
==/UserStyle== */
/* ChangeLog
2021-01-26 Use grid layout
2021-01-12 Adapt new class name
2019-12-01 4k screen support New Version
2017-08-06 Full artical width & icons
2017-07-08 New Version update header
2017-05-23 New Version update 'share to team' button
*/
* { box-sizing: border-box; }
:root{--header-h:4rem;}
/* 整体宽度 */
.fx .container { max-width: 9999px; }
/* header bar -------------------- */
/* 解除宽度限制 */
#headerBarFX header, #headerBarFX .row { max-width: 9999px; }
/* ========== Card ========== */
/* frame */
.StreamPage.presentation-cards {display:grid;grid-template-columns:repeat(auto-fill, minmax(190px, 1fr));gap:1rem;}
/* 标题 & 功能栏 */
.StreamPage.presentation-cards>div:first-child{grid-column: 1 / -1;}
.StreamPage.presentation-cards>h2{grid-column: 1 / -1;}
/* Mark All as Read */
.StreamPage.presentation-cards>button{grid-column: 1 / -1;}
.StreamPage.presentation-cards>button+div{grid-column: 1 / -1;}
/* 老版本的页面 不清楚共存规则 */
.list-entries--layout-cards{grid-column: 1 / -1;}
.presentation-cards .EntryList__chunk{display:grid;grid-template-columns:repeat(auto-fill, minmax(190px, 1fr));gap:1rem;}
.entry.cards{margin:0;}
/* Card Size */
.StreamPage.presentation-cards>article {margin: 0!important; border: 1px solid #0000; clear: none!important; position: relative; overflow: hidden; width: 100%;padding:0;}
.CardLayout{margin:0;width:100%;padding:0;}
/* force img frame in card ratio 1:1 */
.EntryVisual {height:auto;}
/* card image */
.EntryVisual__visual {top: 0; aspect-ratio:1/1;height:auto; border-radius:.5em;background-color: #8882;}
/* card hover */
/* dark mask */
.fx .entry.u5 .visual-overlay { background: none; height: 100%; position: absolute; top: 0; }
/* buttons */
.fx .entry.u5 .entry__toolbar{right:1em;top:1em;}
.fx .entry.u5 .entry__toolbar>* { background-color: rgba(0, 0, 0, .5); width: 26px!important; margin: 2px; border-radius:5px}
/* card selected */
.fx .entry--selected.u5 { background: none!important; }
.fx .entry--selected.u5 .visual { border: 2px solid #F69;}
/* text */
.fx .entry.u5 .content { height: 80px; line-height: 20px; margin: 5px 0 0;}
.fx .entry.u5 .entry__title{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
/* ellipsis source */
.fx .entry .metadata * { color: transparent; }
.fx .entry .metadata .source { display: inline-block; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(128,128,128,.5) }
.fx .entry .metadata .authors { width: 0; white-space: nowrap; overflow: hidden; padding-left: 10px; margin-left: -5px }
.fx .entry .metadata .ago { display: none; }
.fx .entry.u5 .summary { display: none }
/* unread title */
.unread, .fx .entry.unread .title, .EntryTitle { color: #F69!important; }
.EntryTitle--read{color:#999c!important}
/* full artical */
.board.presentation-100 { max-width: 720px; margin-left: auto; margin-right: auto; }
.entryholder { padding-bottom: 0; }
.entryholder .fx-button.secondary { display: none; }
#mainArea, #feedlyPart0.area { padding-bottom: 0!important; }
/* movein page view */
/* container */
.headerInfo + .floatingEntryScroller { top: 50px; }
/* title */
.u100Entry { margin-top: 1em; }
.u100Entry .title { margin-top: 0; }
.tagsHolder { margin: 0; }
/* image */
.slideEntryContent img { margin-top: 1em!important; }
/* full article view */
.list-entries .shareBarHolder { margin: 1em 0; }
.list-entries .headerInfo.headerInfo-article { margin-top: 0.5em; height: 40px!important; }
.list-entries .shareBarHolder i, .list-entries .shareBarHolder .fx.tag-button { zoom: 0.8; }
.list-entries img { margin-top: 1em!important; }
/* ===== remove AD. ===== */
.EntryList__chunk>div.entry.u5{display:none!important;}
}
@-moz-document domain("feedly.com") {
/* Block AD */
/* Sponsor Content */
.entry.cards:has(.SponsorPrompt__sponsored) {
display: none;
}
}