mirror of
https://github.com/discourse/discourse.git
synced 2024-11-25 01:32:23 +08:00
005e1ecb9b
* First take on subsetting svg icons * FontAwesome 5 svg subset WIP * Include icons from plugins/badges into svg sprite subset * add svg icon support to themes * Add spec for SvgSprite * Misc. SVG icon fixes * Use FA5 svgs in local-dates plugin * CSS adjustments, fix SVG icons in group flair * Use SVG icons in poll plugin * Add SVG icons to /wizard
70 lines
2.3 KiB
SCSS
70 lines
2.3 KiB
SCSS
.lightbox {
|
|
position: relative;
|
|
display: inline-block;
|
|
|
|
&:hover .meta {
|
|
opacity: 0.9;
|
|
transition: opacity 0.5s;
|
|
}
|
|
}
|
|
|
|
.lightbox-wrapper {
|
|
display: inline-block;
|
|
&,
|
|
* {
|
|
outline: 0;
|
|
}
|
|
}
|
|
|
|
.meta {
|
|
position: absolute;
|
|
bottom: 0;
|
|
width: 100%;
|
|
color: $secondary;
|
|
background: $primary;
|
|
opacity: 0;
|
|
transition: opacity 0.2s;
|
|
|
|
span {
|
|
float: left;
|
|
}
|
|
|
|
.filename {
|
|
margin: 6px 6px 2px 6px;
|
|
max-width: 100%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
&:before {
|
|
// ideally, the SVG used here should be in HTML and reference the SVG sprite
|
|
content: svg-uri(
|
|
'<svg xmlns="http://www.w3.org/2000/svg" width="14px" height="16px" viewBox="0 0 512 512" fill="#{$secondary}"><path d="M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm-6 336H54a6 6 0 0 1-6-6V118a6 6 0 0 1 6-6h404a6 6 0 0 1 6 6v276a6 6 0 0 1-6 6zM128 152c-22.091 0-40 17.909-40 40s17.909 40 40 40 40-17.909 40-40-17.909-40-40-40zM96 352h320v-80l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L192 304l-39.515-39.515c-4.686-4.686-12.284-4.686-16.971 0L96 304v48z"/></svg>'
|
|
);
|
|
margin-right: 5px;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
opacity: 0.8;
|
|
}
|
|
}
|
|
|
|
.informations {
|
|
margin: 6px;
|
|
padding-right: 20px;
|
|
color: $secondary-high;
|
|
font-size: $font-0;
|
|
}
|
|
|
|
.expand {
|
|
position: absolute;
|
|
bottom: 2px;
|
|
right: 7px;
|
|
&:before {
|
|
// ideally, the SVG used here should be in HTML and reference the SVG sprite
|
|
content: svg-uri(
|
|
'<svg xmlns="http://www.w3.org/2000/svg" width="14px" height="16px" viewBox="0 0 512 512" fill="#{$secondary}"> <path d="M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12zM288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12zm148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12zM160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12z"/></svg>'
|
|
);
|
|
opacity: 0.8;
|
|
}
|
|
}
|
|
}
|