shiori/internal/view/css/bookmark-item.css
2019-08-13 10:58:42 +07:00

1 line
3.7 KiB
CSS

.bookmark{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-flow:column nowrap;min-width:0;border:1px solid var(--border);background-color:var(--contentBg);height:100%;position:relative}.bookmark:hover .bookmark-menu>a,.bookmark:focus .bookmark-menu>a{display:block}.bookmark.selected{background-color:var(--selectedBg)}.bookmark .bookmark-selector{position:absolute;top:0;left:0;width:100%;height:100%;z-index:9}.bookmark .bookmark-link{display:block;cursor:default}.bookmark .bookmark-link[href]{cursor:pointer}.bookmark .bookmark-link[href]:hover .title,.bookmark .bookmark-link[href]:focus .title{color:var(--main)}.bookmark .bookmark-link span.thumbnail{width:100%;height:200px;display:block;background-size:cover;background-repeat:no-repeat;background-position:center center;margin-bottom:8px;border-bottom:1px solid var(--border)}.bookmark .bookmark-link .id{color:var(--color);border:1px solid var(--border);background-color:var(--contentBg);font-size:.7em;font-weight:bold;left:-1px;top:-1px;position:absolute;padding:0 .3em;opacity:.7}.bookmark .bookmark-link .title{text-overflow:ellipsis;word-wrap:break-word;overflow:hidden;font-size:1.2em;line-height:1.3em;max-height:5.2em;font-weight:600;padding:0 16px;color:var(--color)}.bookmark .bookmark-link .title:first-child{margin-top:16px}.bookmark .bookmark-link .title i{color:var(--colorLink);margin-left:4px;font-size:14px}.bookmark .bookmark-link .excerpt{color:var(--color);margin-top:8px;padding:0 16px;text-overflow:ellipsis;word-wrap:break-word;overflow:hidden;font-size:.9em;line-height:1.5em;max-height:10.5em}.bookmark .bookmark-tags{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-flow:row wrap;margin:8px 0 -4px;padding:0 8px}.bookmark .bookmark-tags a{margin:4px;padding:4px 8px;font-size:.8em;font-weight:600;border:1px solid var(--border);border-radius:4px;color:var(--colorLink);background-color:var(--contentBg)}.bookmark .bookmark-tags a:hover,.bookmark .bookmark-tags a:focus{color:var(--main)}.bookmark .bookmark-menu{padding:8px 16px 16px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-flow:row nowrap;min-width:0;min-height:0;-webkit-box-align:center;align-items:center}.bookmark .bookmark-menu a{color:var(--colorLink);flex-shrink:0;opacity:.8;display:none;font-size:.9em}.bookmark .bookmark-menu a:not(:last-child){margin-right:12px}.bookmark .bookmark-menu a:hover,.bookmark .bookmark-menu a:focus{color:var(--main);opacity:1}.bookmark .bookmark-menu .url{-webkit-box-flex:1;flex:1 0;opacity:1;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:21px}.bookmark .bookmark-menu .url:not([href]){cursor:default;color:var(--colorLink)}@media (max-width:600px){.bookmark .bookmark-menu a{display:block}}.bookmark.list{border-top-width:0;border-bottom-width:1px;padding:16px 24px 16px 100px}.bookmark.list:first-child{border-top-width:1px}.bookmark.list .bookmark-link span.thumbnail{position:absolute;top:0;left:0;width:100px;height:100%;margin-bottom:0;border-bottom:0;border-right:1px solid var(--border)}.bookmark.list .bookmark-link .title{margin:0;padding-left:24px}.bookmark.list .excerpt,.bookmark.list>.spacer{display:none}.bookmark.list .bookmark-tags{padding-left:16px;padding-right:0}.bookmark.list .bookmark-menu{padding:8px 0 0 24px;-webkit-box-align:end;align-items:flex-end}@media (max-width:600px){.bookmark.list{padding:8px 16px 8px 70px;border-width:0 !important;border-bottom-width:1px !important}.bookmark.list .bookmark-link span.thumbnail{width:70px}.bookmark.list .bookmark-link .title{font-size:1.1em;font-weight:500;padding-left:16px}.bookmark.list .bookmark-tags{padding-left:8px}.bookmark.list .bookmark-menu{padding-left:16px}}