mirror of
https://github.com/discourse/discourse.git
synced 2026-08-15 17:24:47 +08:00
This commit introduces a toggle which is enabled by default to share the Discourse Rewind report publicly. **IMPORTANT NOTES**: * Users with "Hide my public profile" enabled **will not** have their Rewind shared publicly by default, and will not be able to unless they disable "Hide my public profile" first. * This commit also excludes personal messages from best posts and best topics reports so sensitive message data will never be shown, but other report data like reaction counts may still be based off of PM data Other users who cannot see the rewind will see an error. We always show a message saying which user you are looking at when viewing another user's Rewind. Users can also unshare their rewind from Rewind preferences.
92 lines
2.1 KiB
SCSS
Vendored
92 lines
2.1 KiB
SCSS
Vendored
.quick-access-panel {
|
|
> ul,
|
|
.empty-state__container {
|
|
height: 100%; // flex alignment fix
|
|
}
|
|
}
|
|
|
|
.rewind-callout__container {
|
|
height: 47px;
|
|
border-bottom: 1px solid var(--primary-low);
|
|
|
|
@media screen and (width <= 639px) {
|
|
height: 40px;
|
|
}
|
|
}
|
|
|
|
#rewind-vhs {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.btn.rewind-callout {
|
|
padding: 0;
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
transition: transform 0.3s ease;
|
|
transform-origin: left top;
|
|
z-index: 2;
|
|
|
|
svg {
|
|
transition: box-shadow 0.3s ease;
|
|
}
|
|
|
|
&:hover {
|
|
transform: translateX(10px) translateY(10px) scale(1.05);
|
|
|
|
svg {
|
|
box-shadow: -10px 10px 15px rgb(0 0 0 / 0.15);
|
|
}
|
|
}
|
|
}
|
|
|
|
.rewind-callout {
|
|
position: relative;
|
|
display: flex;
|
|
transition: transform 200ms ease;
|
|
|
|
.btn.no-text.--special-kbd {
|
|
top: 0.5em;
|
|
right: 1em;
|
|
position: absolute;
|
|
font-size: var(--font-down-3);
|
|
|
|
@media screen and (width <= 639px) {
|
|
top: 0.45em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rewind-callout::before {
|
|
content: "";
|
|
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 287.46 22.28"><path d="m0 0 64.78 22.28h44.53L44.54 0z" style="fill:%23d0232b"/><path d="m44.54 0 64.77 22.28h44.54L89.08 0z" style="fill:%23f15e24"/><path d="m89.08 0 64.77 22.28h44.54L133.61 0z" style="fill:%23fdf6b0"/><path d="m133.61 0 64.78 22.28h44.54L178.15 0z" style="fill:%230ea94e"/><path d="m178.15 0 64.78 22.28h44.53L222.69 0z" style="fill:%232bace2"/></svg>');
|
|
background-repeat: no-repeat;
|
|
background-position: 47% 100%;
|
|
background-size: 139px;
|
|
background-blend-mode: multiply;
|
|
position: absolute;
|
|
left: -48px;
|
|
top: -15px;
|
|
z-index: -1;
|
|
width: 100%;
|
|
height: 16px;
|
|
background-color: #d4d1bc;
|
|
transform: skew(72deg, 0deg);
|
|
transform-origin: 50% 0% 0;
|
|
transition:
|
|
transform 200ms ease,
|
|
width 200ms ease;
|
|
}
|
|
|
|
.rewind-callout::after {
|
|
content: "";
|
|
position: absolute;
|
|
left: -10px;
|
|
top: -5px;
|
|
z-index: -1;
|
|
width: 10px;
|
|
height: calc(100% - 3px);
|
|
background-color: #e8e5d0;
|
|
transform: skew(0deg, 41deg) scale3d(1, 1, 1);
|
|
}
|