2019-09-27 20:56:15 +02:00
|
|
|
.claim-list {
|
2022-03-30 17:53:05 +02:00
|
|
|
// List view :not(.claim-preview__wrapper--channel)
|
|
|
|
.claim-preview__wrapper:not(.claim-preview__wrapper--small) {
|
2022-02-11 19:50:55 +01:00
|
|
|
padding: var(--spacing-m);
|
|
|
|
background-color: rgba(var(--color-header-background-base), 0.6);
|
|
|
|
|
|
|
|
.claim__menu-button {
|
2022-04-09 16:07:06 +02:00
|
|
|
// margin-right: var(--spacing-m);
|
|
|
|
right: 9px;
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.media__thumb {
|
|
|
|
width: calc(var(--file-list-thumbnail-width) * 1.2);
|
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
background-color: rgba(var(--color-header-background-base), 0.9);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
.media__thumb {
|
|
|
|
width: var(--file-list-thumbnail-width) !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
.claim-list--no-margin {
|
|
|
|
li {
|
|
|
|
@include list-hover-effect;
|
|
|
|
margin: 0px !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-04-09 16:07:06 +02:00
|
|
|
.claim__menu-button {
|
|
|
|
.icon {
|
|
|
|
transition: transform 0.2s;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
[aria-expanded='true'].claim__menu-button {
|
|
|
|
opacity: 1;
|
2022-04-09 16:07:06 +02:00
|
|
|
// background-color: var(--color-header-background);
|
|
|
|
background-color: rgba(var(--color-header-button-base), 0.9);
|
|
|
|
//border-radius: var(--border-radius);
|
|
|
|
border-radius: 50%;
|
|
|
|
outline: 2px solid var(--color-header-background);
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.icon {
|
2022-04-09 16:07:06 +02:00
|
|
|
stroke: var(--color-primary) !important;
|
2022-04-09 17:37:27 +02:00
|
|
|
transform: rotate(-90deg);
|
2019-09-27 20:56:15 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-06-28 09:27:55 +02:00
|
|
|
.claim-list__header {
|
2019-06-11 20:10:58 +02:00
|
|
|
display: flex;
|
2020-01-02 23:30:58 +01:00
|
|
|
flex-wrap: wrap;
|
2020-03-09 15:46:12 +01:00
|
|
|
align-items: center;
|
2020-06-01 19:03:19 +02:00
|
|
|
margin: var(--spacing-m) 0;
|
2020-01-02 21:36:03 +01:00
|
|
|
margin-top: 0;
|
2019-07-21 23:31:22 +02:00
|
|
|
font-size: var(--font-body);
|
2019-06-11 20:10:58 +02:00
|
|
|
|
2020-01-02 23:30:58 +01:00
|
|
|
.spinner {
|
2020-06-01 19:03:19 +02:00
|
|
|
margin-left: var(--spacing-m);
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
margin-top: var(--spacing-s);
|
|
|
|
}
|
2019-06-17 22:32:38 +02:00
|
|
|
}
|
|
|
|
|
2019-06-28 09:27:55 +02:00
|
|
|
.claim-list__dropdown {
|
2020-06-01 19:03:19 +02:00
|
|
|
padding: 0 var(--spacing-m);
|
2021-09-15 21:18:17 +02:00
|
|
|
padding-right: var(--spacing-xl);
|
|
|
|
background-position: right var(--spacing-m) center;
|
2019-12-18 06:27:08 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
2020-01-02 23:30:58 +01:00
|
|
|
margin-left: 0;
|
2019-12-18 06:27:08 +01:00
|
|
|
}
|
2019-11-22 22:13:00 +01:00
|
|
|
}
|
2019-06-29 00:21:21 +02:00
|
|
|
|
2020-01-02 21:36:03 +01:00
|
|
|
.claim-list__header-label {
|
|
|
|
position: absolute;
|
|
|
|
transform: translateY(-130%);
|
2022-02-11 19:50:55 +01:00
|
|
|
font-size: var(--font-body);
|
|
|
|
font-weight: var(--font-weight-bold);
|
|
|
|
margin-top: var(--spacing-m);
|
|
|
|
color: var(--color-text);
|
2021-04-26 21:19:17 +02:00
|
|
|
overflow: visible;
|
2020-01-02 21:36:03 +01:00
|
|
|
|
|
|
|
.icon {
|
2022-02-11 19:50:55 +01:00
|
|
|
width: var(--font-small);
|
|
|
|
height: var(--font-small);
|
2020-06-01 19:03:19 +02:00
|
|
|
margin-right: var(--spacing-xs);
|
2022-02-11 19:50:55 +01:00
|
|
|
stroke: var(--color-text);
|
2020-01-02 21:36:03 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
position: static;
|
|
|
|
transform: none;
|
|
|
|
}
|
2020-01-02 17:30:27 +01:00
|
|
|
}
|
|
|
|
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
.claim-list__header-label--playlist-page {
|
|
|
|
@extend .claim-list__header-label;
|
|
|
|
position: relative;
|
|
|
|
transform: translateY(-100%);
|
|
|
|
margin-bottom: 0px;
|
|
|
|
}
|
|
|
|
|
2019-11-22 22:13:00 +01:00
|
|
|
.claim-list__conjuction {
|
|
|
|
color: var(--color-text-subtitle);
|
|
|
|
font-size: var(--font-small);
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
|
|
|
|
2019-06-28 09:27:55 +02:00
|
|
|
.claim-list__alt-controls {
|
2020-03-09 15:46:12 +01:00
|
|
|
align-self: flex-start;
|
2019-06-11 20:10:58 +02:00
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
margin-left: auto;
|
|
|
|
|
|
|
|
& > * {
|
2020-06-01 19:03:19 +02:00
|
|
|
margin-left: var(--spacing-s);
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
|
2022-04-01 18:40:04 +02:00
|
|
|
.card__actions--inline:first-child {
|
|
|
|
margin-left: unset;
|
|
|
|
}
|
|
|
|
|
2019-12-18 06:27:08 +01:00
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
display: none;
|
|
|
|
}
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
|
|
|
|
2021-03-10 05:11:45 +01:00
|
|
|
.claim-list__alt-controls--wrap {
|
|
|
|
@extend .claim-list__alt-controls;
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
display: flex;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-01-31 17:43:14 +01:00
|
|
|
.claim-preview__wrapper {
|
2021-03-11 18:08:11 +01:00
|
|
|
@include font-sans;
|
2020-06-01 19:03:19 +02:00
|
|
|
padding: var(--spacing-m);
|
2022-02-11 19:50:55 +01:00
|
|
|
border-radius: var(--border-radius);
|
2020-01-31 17:43:14 +01:00
|
|
|
list-style: none;
|
2022-02-11 19:50:55 +01:00
|
|
|
position: relative;
|
|
|
|
|
2022-04-28 10:29:28 +02:00
|
|
|
.claim-tile__info {
|
|
|
|
padding-bottom: unset;
|
|
|
|
}
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim__menu-button {
|
|
|
|
right: calc(var(--spacing-m) - 8px);
|
|
|
|
margin-top: var(--spacing-xxs);
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim__tags {
|
|
|
|
.tag {
|
|
|
|
color: var(--color-text);
|
|
|
|
background-color: var(--color-header-button);
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
background-color: var(--color-primary);
|
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__repost-author {
|
|
|
|
width: 120px;
|
|
|
|
height: 120px;
|
|
|
|
overflow: hidden;
|
|
|
|
position: absolute;
|
|
|
|
top: var(--spacing-m);
|
|
|
|
left: var(--spacing-m);
|
|
|
|
.claim-preview__repost-ribbon {
|
|
|
|
position: absolute;
|
|
|
|
display: block;
|
|
|
|
width: 225px;
|
|
|
|
padding-top: 4px;
|
|
|
|
padding-right: 8px;
|
2022-04-07 20:05:57 +02:00
|
|
|
background-color: rgba(var(--color-primary-dynamic), 0.8);
|
2022-02-11 19:50:55 +01:00
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
text-align: center;
|
|
|
|
z-index: 1;
|
|
|
|
font-size: var(--font-xxsmall);
|
|
|
|
|
|
|
|
left: -80px;
|
|
|
|
top: 10px;
|
|
|
|
transform: rotate(-45deg);
|
|
|
|
|
|
|
|
.button--uri-indicator {
|
|
|
|
top: -3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.button {
|
|
|
|
width: 80px;
|
|
|
|
text-align: center;
|
|
|
|
.button__content {
|
|
|
|
width: 100%;
|
|
|
|
.channel-name {
|
|
|
|
width: 100%;
|
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
font-size: var(--font-xxsmall);
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
2022-03-30 16:40:35 +02:00
|
|
|
display: unset;
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
&:hover {
|
|
|
|
color: var(--color-secondary);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2022-04-07 20:05:57 +02:00
|
|
|
|
|
|
|
.comment__badge {
|
|
|
|
display: none;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
top: var(--spacing-s);
|
|
|
|
left: var(--spacing-s);
|
|
|
|
height: 80px;
|
|
|
|
width: 80px;
|
|
|
|
.claim-preview__repost-ribbon {
|
|
|
|
width: 190px;
|
|
|
|
padding-top: 0;
|
|
|
|
left: -66px;
|
|
|
|
.icon {
|
|
|
|
margin-bottom: -4px;
|
|
|
|
}
|
|
|
|
.button {
|
|
|
|
width: 70px;
|
|
|
|
.button__content {
|
|
|
|
.channel-name {
|
|
|
|
font-size: var(--font-xxxsmall);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview {
|
2022-04-04 17:43:10 +02:00
|
|
|
.claim-preview__text {
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-preview-metadata {
|
2022-04-04 17:43:10 +02:00
|
|
|
.claim-tile__info {
|
|
|
|
.media__subtitle {
|
|
|
|
.button {
|
|
|
|
display: inline;
|
|
|
|
}
|
|
|
|
span:not(.channel-name) {
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2021-03-03 19:50:16 +01:00
|
|
|
|
2022-05-24 13:49:28 +02:00
|
|
|
@media (any-pointer: fine) {
|
|
|
|
&:hover {
|
|
|
|
.claim__menu-button {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
|
|
|
|
.collection-preview-overlay__grid {
|
|
|
|
opacity: 1;
|
|
|
|
transition: 0.3s;
|
|
|
|
}
|
2021-03-03 19:50:16 +01:00
|
|
|
}
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
// padding: var(--spacing-s) !important;
|
|
|
|
|
|
|
|
.claim-preview {
|
|
|
|
.media__thumb {
|
|
|
|
width: calc(var(--file-list-thumbnail-width) * 0.8) !important;
|
|
|
|
}
|
|
|
|
.claim-preview-metadata {
|
|
|
|
.claim-tile__info {
|
|
|
|
margin-top: var(--spacing-xxxs);
|
|
|
|
}
|
|
|
|
.claim-preview__title {
|
|
|
|
margin-right: var(--spacing-m);
|
|
|
|
}
|
|
|
|
.media__subtitle {
|
|
|
|
.button__content {
|
|
|
|
height: auto;
|
|
|
|
}
|
|
|
|
.view_count {
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.claim-preview__actions {
|
|
|
|
margin-top: 0;
|
|
|
|
.claim-preview__primary-actions {
|
|
|
|
.claim-preview__channel-staked {
|
|
|
|
margin-bottom: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.claim__menu-button {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
}
|
2020-01-31 17:43:14 +01:00
|
|
|
}
|
|
|
|
|
2020-02-05 19:01:07 +01:00
|
|
|
.claim-preview__wrapper--notice {
|
|
|
|
background-color: var(--color-notice);
|
|
|
|
}
|
|
|
|
|
2020-01-31 17:43:14 +01:00
|
|
|
.claim-preview__wrapper--inline {
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__wrapper--small {
|
2022-02-11 19:50:55 +01:00
|
|
|
padding-top: var(--spacing-s);
|
|
|
|
padding-bottom: 0px !important;
|
|
|
|
margin-bottom: 0px !important;
|
|
|
|
padding-left: 0px;
|
|
|
|
padding-right: 0px;
|
|
|
|
|
|
|
|
.claim-preview__title {
|
|
|
|
font-size: var(--font-small);
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
margin-bottom: var(--spacing-xxs) !important;
|
|
|
|
padding: 0 !important;
|
|
|
|
}
|
2021-06-29 18:57:22 +02:00
|
|
|
|
|
|
|
.button--uri-indicator {
|
|
|
|
max-width: 12rem;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.claim__menu-button {
|
2022-04-09 16:07:06 +02:00
|
|
|
// right: -8px !important;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: 6px;
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
.icon {
|
|
|
|
stroke: var(--color-link);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__wrapper--channel {
|
|
|
|
position: relative;
|
|
|
|
border-radius: var(--border-radius);
|
|
|
|
background: rgba(var(--color-header-background-base), 0.6);
|
|
|
|
padding: var(--spacing-m) !important;
|
|
|
|
|
|
|
|
.channel-name {
|
|
|
|
&:hover {
|
|
|
|
color: var(--color-secondary);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim__menu-button {
|
|
|
|
right: 0;
|
|
|
|
margin-top: var(--spacing-xxs);
|
|
|
|
|
|
|
|
.icon {
|
|
|
|
stroke: var(--color-text);
|
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
.icon {
|
|
|
|
stroke: var(--color-primary);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__repost-author {
|
|
|
|
left: 0px;
|
|
|
|
top: 0px;
|
|
|
|
font-size: var(--font-small);
|
|
|
|
opacity: 0.8;
|
|
|
|
z-index: 5;
|
|
|
|
|
|
|
|
svg {
|
|
|
|
margin-right: 4px;
|
|
|
|
margin-bottom: -2px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
background: rgba(var(--color-header-background-base), 0.9);
|
|
|
|
}
|
2020-01-31 17:43:14 +01:00
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview {
|
2019-09-27 20:56:15 +02:00
|
|
|
flex: 1;
|
2019-06-11 20:10:58 +02:00
|
|
|
display: flex;
|
|
|
|
position: relative;
|
2019-07-09 03:19:46 +02:00
|
|
|
overflow: visible;
|
2019-06-11 20:10:58 +02:00
|
|
|
|
2019-11-25 18:42:49 +01:00
|
|
|
&:not(.claim-preview--inline):not(.claim-preview--pending):not(.claim-preview--inactive) {
|
2019-07-21 23:31:22 +02:00
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
|
2019-06-11 20:10:58 +02:00
|
|
|
.media__thumb {
|
2020-08-04 19:50:33 +02:00
|
|
|
overflow: hidden;
|
2022-02-11 19:50:55 +01:00
|
|
|
$width: calc(var(--file-list-thumbnail-width) * 1.2);
|
|
|
|
width: var(--file-list-thumbnail-width);
|
2020-05-28 21:09:21 +02:00
|
|
|
@include handleClaimListGifThumbnail($width);
|
2020-05-28 19:07:04 +02:00
|
|
|
|
2019-06-11 20:10:58 +02:00
|
|
|
flex-shrink: 0;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-right: var(--spacing-s);
|
2022-05-18 13:16:35 +02:00
|
|
|
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 0.1) inset;
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
|
2020-12-04 01:10:23 +01:00
|
|
|
.media__thumb-placeholder-text {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
padding: var(--spacing-m);
|
|
|
|
}
|
|
|
|
|
2020-04-13 21:16:07 +02:00
|
|
|
.channel-thumbnail {
|
2020-05-28 19:07:04 +02:00
|
|
|
@include handleChannelGif(6rem);
|
2020-04-13 21:16:07 +02:00
|
|
|
}
|
|
|
|
|
2022-05-24 13:49:28 +02:00
|
|
|
// any-pointer media query prevents double click hover bug on ipad
|
2022-05-24 13:13:45 +02:00
|
|
|
@media (any-pointer: fine) {
|
|
|
|
// show watch later button and duration divs when hovered
|
|
|
|
&:hover {
|
|
|
|
.media__thumb {
|
|
|
|
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
|
|
|
|
}
|
|
|
|
.claim-preview__title {
|
|
|
|
color: var(--color-link);
|
|
|
|
}
|
|
|
|
.claim-preview__hover-actions {
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.claim-preview__file-property-overlay {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
.button--file-action {
|
|
|
|
.icon {
|
|
|
|
stroke: #f3f4f6;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.ff-canvas {
|
|
|
|
opacity: 0 !important;
|
|
|
|
transition: opacity 1s !important;
|
|
|
|
}
|
|
|
|
.ff-image {
|
|
|
|
opacity: 1 !important;
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
}
|
2020-02-05 03:54:19 +01:00
|
|
|
}
|
|
|
|
|
2019-12-18 06:27:08 +01:00
|
|
|
@media (max-width: $breakpoint-small) {
|
2019-12-20 21:46:59 +01:00
|
|
|
font-size: 14px;
|
|
|
|
|
|
|
|
.channel-thumbnail {
|
2020-12-04 01:10:23 +01:00
|
|
|
@include handleChannelGif(4rem);
|
2019-12-18 06:27:08 +01:00
|
|
|
}
|
|
|
|
}
|
2019-07-23 10:05:51 +02:00
|
|
|
}
|
|
|
|
|
2022-05-18 13:16:35 +02:00
|
|
|
.claim-preview--premium-plus {
|
|
|
|
.media__thumb {
|
|
|
|
background-color: #283263;
|
2022-05-20 15:07:32 +02:00
|
|
|
background-image: url('~ui/component/membershipSplash/astronaut_n_friends.png');
|
2022-05-18 13:16:35 +02:00
|
|
|
background-size: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.icon {
|
|
|
|
color: var(--color-text);
|
|
|
|
width: 2.1rem;
|
|
|
|
height: 2.1rem;
|
|
|
|
float: left;
|
|
|
|
margin-right: var(--spacing-s);
|
|
|
|
}
|
|
|
|
|
|
|
|
.channel-name {
|
|
|
|
font-weight: var(--font-weight-bold);
|
|
|
|
&:hover {
|
|
|
|
color: var(--color-text);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-12-04 01:10:23 +01:00
|
|
|
.claim-preview__empty {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview--large {
|
2019-07-21 23:31:22 +02:00
|
|
|
border: none;
|
2020-12-04 01:10:23 +01:00
|
|
|
min-height: 8rem;
|
2019-06-11 20:10:58 +02:00
|
|
|
|
|
|
|
&:hover {
|
|
|
|
background-color: transparent;
|
|
|
|
}
|
|
|
|
|
2020-12-04 01:10:23 +01:00
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
min-height: 4rem;
|
|
|
|
}
|
|
|
|
|
2019-06-11 20:10:58 +02:00
|
|
|
.media__thumb {
|
2019-07-21 23:31:22 +02:00
|
|
|
width: 14rem;
|
2020-05-29 19:26:06 +02:00
|
|
|
@include handleClaimListGifThumbnail(14rem);
|
2020-04-01 22:00:09 +02:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
2020-12-04 01:10:23 +01:00
|
|
|
min-height: 5rem;
|
|
|
|
width: 8rem;
|
2020-04-01 22:00:09 +02:00
|
|
|
}
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
.channel-thumbnail {
|
2020-12-04 01:10:23 +01:00
|
|
|
width: 7.5rem;
|
2020-05-28 19:07:04 +02:00
|
|
|
@include handleChannelGif(7.5rem);
|
2020-12-04 01:10:23 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
width: 5rem;
|
|
|
|
@include handleChannelGif(5rem);
|
|
|
|
}
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
2021-04-26 21:19:17 +02:00
|
|
|
|
|
|
|
.claim-preview__text {
|
|
|
|
height: 7.5rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
.channel-thumbnail {
|
|
|
|
@include handleChannelGif(6rem);
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__text {
|
|
|
|
height: 3.5rem;
|
|
|
|
}
|
|
|
|
}
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview--small {
|
|
|
|
.channel-thumbnail {
|
2020-05-28 19:07:04 +02:00
|
|
|
@include handleChannelGif(4rem);
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
2021-02-16 22:09:20 +01:00
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.media__thumb {
|
|
|
|
background-size: 100%;
|
|
|
|
background-position: center;
|
|
|
|
transition: background-size 0.2s ease-in-out;
|
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
.claim-preview__title {
|
|
|
|
color: var(--color-link);
|
|
|
|
}
|
|
|
|
|
|
|
|
.media__thumb {
|
|
|
|
background-size: 108%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-02-16 22:09:20 +01:00
|
|
|
.media__subtitle {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
}
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
|
|
|
|
2019-07-11 20:06:25 +02:00
|
|
|
.claim-preview--pending {
|
2019-06-28 09:27:55 +02:00
|
|
|
opacity: 0.6;
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-tile__info {
|
|
|
|
flex-wrap: wrap;
|
|
|
|
.claim-preview__channel-staked {
|
|
|
|
flex-basis: 2.1rem;
|
|
|
|
}
|
|
|
|
.confirming-change {
|
|
|
|
flex-basis: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.card__main-actions {
|
|
|
|
border-top: unset;
|
|
|
|
}
|
2019-06-28 09:27:55 +02:00
|
|
|
}
|
|
|
|
|
2020-02-11 17:50:42 +01:00
|
|
|
.claim-preview--padded {
|
2020-06-01 19:03:19 +02:00
|
|
|
padding: var(--spacing-s);
|
2020-02-11 17:50:42 +01:00
|
|
|
}
|
|
|
|
|
2019-07-21 23:31:22 +02:00
|
|
|
.claim-preview--inline {
|
|
|
|
.channel-thumbnail {
|
2022-02-11 19:50:55 +01:00
|
|
|
@include handleChannelGif(2.5rem);
|
2021-04-26 21:19:17 +02:00
|
|
|
|
|
|
|
@media (min-width: $breakpoint-small) {
|
|
|
|
@include handleChannelGif(var(--channel-thumbnail-width--small));
|
|
|
|
}
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
|
|
|
|
.claim-preview__actions {
|
|
|
|
align-self: flex-end;
|
|
|
|
margin-bottom: auto;
|
|
|
|
width: auto;
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.button--alt {
|
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
|
|
|
|
.icon {
|
|
|
|
stroke: var(--color-primary-contrast);
|
|
|
|
}
|
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__text {
|
|
|
|
width: 100%;
|
|
|
|
flex-direction: row;
|
|
|
|
justify-content: space-between;
|
2020-09-30 22:46:20 +02:00
|
|
|
flex-wrap: wrap;
|
2022-02-11 19:50:55 +01:00
|
|
|
align-items: top;
|
2019-12-18 06:27:08 +01:00
|
|
|
}
|
2019-12-19 21:43:49 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-xsmall) {
|
|
|
|
.claim-preview__actions {
|
2021-04-26 21:19:17 +02:00
|
|
|
.claim-preview__primary-actions {
|
|
|
|
.button {
|
|
|
|
margin-top: 0;
|
|
|
|
}
|
|
|
|
}
|
2019-12-19 21:43:49 +01:00
|
|
|
}
|
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
}
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-preview--channel {
|
|
|
|
.claim-preview__actions {
|
|
|
|
margin-top: 0px;
|
|
|
|
}
|
2022-04-09 16:07:06 +02:00
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
a.button--no-style:first-of-type {
|
|
|
|
.button__content {
|
|
|
|
align-items: unset;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
|
2019-12-18 06:27:08 +01:00
|
|
|
.claim-preview__text {
|
|
|
|
width: 100%;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
justify-content: space-between;
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
|
|
|
|
2020-01-30 23:25:15 +01:00
|
|
|
.claim-preview__title {
|
2019-11-07 20:39:22 +01:00
|
|
|
font-weight: var(--font-weight-bold);
|
2019-11-22 22:13:00 +01:00
|
|
|
font-size: var(--font-body);
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-right: var(--spacing-m);
|
2019-08-13 07:35:13 +02:00
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
max-width: 100%;
|
2022-02-11 19:50:55 +01:00
|
|
|
color: rgba(var(--color-text-base), 0.9);
|
|
|
|
.truncated-text {
|
|
|
|
display: -webkit-box;
|
|
|
|
width: 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
|
|
-webkit-line-clamp: 1 !important;
|
|
|
|
@media (max-width: $breakpoint-xsmall) {
|
|
|
|
-webkit-line-clamp: 2 !important;
|
|
|
|
}
|
|
|
|
@media (min-width: $breakpoint-medium) {
|
|
|
|
-webkit-line-clamp: 1 !important;
|
|
|
|
}
|
|
|
|
}
|
2019-07-21 23:31:22 +02:00
|
|
|
}
|
|
|
|
|
2021-08-19 17:25:45 +02:00
|
|
|
.claim-preview__channel-sub-count {
|
|
|
|
color: var(--color-text-subtitle);
|
2022-02-11 19:50:55 +01:00
|
|
|
font-size: var(--font-xsmall);
|
2021-08-19 17:25:45 +02:00
|
|
|
}
|
|
|
|
|
2020-10-12 23:12:46 +02:00
|
|
|
.claim-preview__custom-properties {
|
|
|
|
text-align: right;
|
2020-12-04 01:10:23 +01:00
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
justify-content: flex-end;
|
2020-10-12 23:12:46 +02:00
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview-metadata {
|
2019-06-11 20:10:58 +02:00
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
2019-07-09 03:19:46 +02:00
|
|
|
flex: 1;
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
|
|
|
|
2021-10-16 20:12:09 +02:00
|
|
|
.claim-preview-metadata-sub-upload {
|
|
|
|
position: relative;
|
|
|
|
//margin-left: 4px;
|
|
|
|
display: flex;
|
|
|
|
text-align: left;
|
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview-info {
|
2019-06-11 20:10:58 +02:00
|
|
|
align-items: flex-start;
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
|
|
|
|
a,
|
|
|
|
.claim-preview__title {
|
|
|
|
max-width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview-info {
|
|
|
|
&.playlist-title {
|
|
|
|
flex-direction: column;
|
|
|
|
}
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview-info,
|
|
|
|
.claim-preview-properties {
|
2019-06-11 20:10:58 +02:00
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
|
2019-12-18 06:27:08 +01:00
|
|
|
.claim-preview__actions {
|
|
|
|
align-self: flex-end;
|
2019-08-02 03:34:48 +02:00
|
|
|
display: flex;
|
2020-12-16 19:38:18 +01:00
|
|
|
flex-direction: column;
|
2019-12-18 06:27:08 +01:00
|
|
|
justify-content: space-between;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: var(--spacing-xs);
|
2019-12-18 06:27:08 +01:00
|
|
|
width: 100%;
|
2020-12-16 19:38:18 +01:00
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.button--alt {
|
|
|
|
color: white;
|
|
|
|
background-color: var(--color-primary);
|
|
|
|
}
|
|
|
|
|
2020-12-16 19:38:18 +01:00
|
|
|
@media (min-width: $breakpoint-small) {
|
|
|
|
flex-direction: row;
|
|
|
|
}
|
2019-08-02 03:34:48 +02:00
|
|
|
}
|
2019-12-18 06:27:08 +01:00
|
|
|
|
2020-06-29 19:25:29 +02:00
|
|
|
.claim-preview__primary-actions {
|
|
|
|
@extend .section__actions;
|
2021-04-26 21:19:17 +02:00
|
|
|
margin-right: 0;
|
|
|
|
|
|
|
|
&:first-child {
|
|
|
|
.button {
|
2022-02-11 19:50:55 +01:00
|
|
|
background-color: var(--color-primary);
|
2021-04-26 21:19:17 +02:00
|
|
|
}
|
|
|
|
}
|
2020-06-29 19:25:29 +02:00
|
|
|
}
|
|
|
|
|
2020-02-11 20:04:51 +01:00
|
|
|
.claim-preview__actions--header {
|
|
|
|
@extend .claim-preview__actions;
|
2020-05-11 16:50:32 +02:00
|
|
|
flex-wrap: wrap;
|
2020-02-11 20:04:51 +01:00
|
|
|
}
|
|
|
|
|
2019-08-02 03:34:48 +02:00
|
|
|
.claim-preview__button {
|
|
|
|
margin-left: 2rem;
|
|
|
|
}
|
|
|
|
|
2019-06-27 08:18:45 +02:00
|
|
|
.claim-preview-properties {
|
2019-06-11 20:10:58 +02:00
|
|
|
align-items: flex-end;
|
2019-06-27 22:27:38 +02:00
|
|
|
flex: 1;
|
2019-11-22 22:13:00 +01:00
|
|
|
font-size: var(--font-small);
|
|
|
|
color: var(--color-text-subtitle);
|
2019-06-11 20:10:58 +02:00
|
|
|
}
|
2019-10-11 02:37:18 +02:00
|
|
|
|
|
|
|
.claim-upload {
|
|
|
|
flex: 1;
|
|
|
|
display: flex;
|
|
|
|
position: relative;
|
|
|
|
overflow: visible;
|
2020-06-01 19:03:19 +02:00
|
|
|
padding: var(--spacing-m);
|
2019-10-11 02:37:18 +02:00
|
|
|
|
|
|
|
.media__thumb {
|
|
|
|
width: var(--file-list-thumbnail-width);
|
|
|
|
flex-shrink: 0;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-right: var(--spacing-s);
|
2019-10-11 02:37:18 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
Support resume-able upload via tus (#186)
* Publish button: use spinner instead of "Publishing..."
Looks better, plus the preview could take a while sometimes.
* Refactor `doPublish`. No functional change
This is to allow `doPublish` to accept a custom payload as an input (for resuming uploads), instead of always resolving it from the redux data.
* Add doPublishResume
* Support resume-able upload via tus
## Issue
38 Handle resumable file upload
## Notes
Since we can't serialize a File object, we'll need to the user to re-select the file to resume.
* Exclude "modified date" for Firefox/Android
## Issue
It appears that the modification date of the Android file changes when selected, so that file was deemed "different" when trying to resume upload.
## Change
Exclude modification date for now. Let's assume a smart user.
* Move 'currentUploads' to 'publish' reducer
`publish` is currently rehydrated, so we can ride on that and don't need to store the `currentUploads` in `localStorage` for persistence. This would allow us to store Markdown Post data too, as `localStorage` has a 5MB limit per app.
We could have also made `webReducer` rehydrate, but in this repo, there is no need to split it to another reducer. It also makes more sense to be part of publish anyway (at least to me).
This change is mostly moving items between files, with the exception of
1. An additional REHYDRATE in the publish reducer to clean up the tusUploader.
2. Not clearing `currentUploads` in CLEAR_PUBLISH.
* Restore v1 code for livestream replay, etc.
v2 (tus) does not handle `remote_url`, so the app still needs v1 for that. Since we'll still have v1 code, use v1 for previews as well.
2021-11-10 19:16:16 +01:00
|
|
|
.claim-upload__progress--label {
|
|
|
|
font-size: var(--font-small);
|
|
|
|
color: var(--color-text-subtitle);
|
|
|
|
}
|
|
|
|
|
2019-10-11 02:37:18 +02:00
|
|
|
.claim-upload__progress--outer {
|
|
|
|
width: 100%;
|
2022-02-11 19:50:55 +01:00
|
|
|
border-radius: var(--border-radius);
|
|
|
|
background-color: var(--color-header-background);
|
2019-10-11 02:37:18 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
.claim-upload__progress--inner {
|
2022-02-11 19:50:55 +01:00
|
|
|
border-radius: var(--border-radius);
|
|
|
|
background: var(--color-primary);
|
2020-06-01 19:03:19 +02:00
|
|
|
padding: var(--spacing-xxs);
|
2021-11-22 09:06:28 +01:00
|
|
|
height: 2.4rem;
|
2022-02-11 19:50:55 +01:00
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
2021-11-22 09:06:28 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.claim-upload__progress--inner-text {
|
|
|
|
position: absolute;
|
2022-04-05 16:02:32 +02:00
|
|
|
color: var(--color-text);
|
2021-11-22 09:06:28 +01:00
|
|
|
width: 80%;
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
2019-10-11 02:37:18 +02:00
|
|
|
}
|
2020-01-20 17:47:03 +01:00
|
|
|
|
|
|
|
//
|
|
|
|
// The _other_ way to view claims
|
|
|
|
// A grid of tiles
|
|
|
|
// It should probably go into it's own file once we add more to it
|
|
|
|
//
|
|
|
|
.claim-grid {
|
|
|
|
display: flex;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
list-style: none;
|
|
|
|
align-items: flex-start;
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-grid__wrapper {
|
2020-07-22 22:32:18 +02:00
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: var(--spacing-s);
|
|
|
|
padding-bottom: var(--spacing-l);
|
|
|
|
//border-bottom: 1px solid var(--color-border);
|
2020-01-20 17:47:03 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
&:not(:first-of-type) {
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: var(--spacing-s);
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-09-15 20:28:04 +02:00
|
|
|
.claim-grid__header {
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: var(--spacing-m);
|
2020-09-15 20:28:04 +02:00
|
|
|
margin-bottom: var(--spacing-m);
|
2021-04-23 21:59:48 +02:00
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
2020-09-15 20:28:04 +02:00
|
|
|
|
2020-09-17 19:28:46 +02:00
|
|
|
.button {
|
|
|
|
&:hover {
|
|
|
|
text-decoration: none;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-09-15 20:28:04 +02:00
|
|
|
.icon__wrapper {
|
2020-09-17 19:28:46 +02:00
|
|
|
width: 0.5rem;
|
|
|
|
height: 0.5rem;
|
2022-02-11 19:50:55 +01:00
|
|
|
background-color: var(--color-header-background);
|
2020-09-16 19:02:45 +02:00
|
|
|
margin-right: var(--spacing-m);
|
|
|
|
|
|
|
|
.icon {
|
2022-02-11 19:50:55 +01:00
|
|
|
stroke: var(--color-text);
|
2020-09-16 19:02:45 +02:00
|
|
|
}
|
2020-09-17 19:28:46 +02:00
|
|
|
|
|
|
|
@media (min-width: $breakpoint-small) {
|
|
|
|
height: 1.5rem;
|
|
|
|
width: 1.5rem;
|
|
|
|
}
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.button__content {
|
|
|
|
&:hover {
|
|
|
|
.claim-grid__title {
|
|
|
|
color: var(--color-primary);
|
|
|
|
}
|
|
|
|
.icon {
|
|
|
|
stroke: var(--color-primary);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-09-15 20:28:04 +02:00
|
|
|
}
|
|
|
|
|
2021-06-15 22:06:57 +02:00
|
|
|
.claim-grid__header--between {
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
.claim-grid__title {
|
2020-09-15 20:28:04 +02:00
|
|
|
font-weight: 300;
|
|
|
|
font-size: var(--font-large);
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
margin-right: var(--spacing-m);
|
2021-06-15 22:06:57 +02:00
|
|
|
display: flex;
|
2022-02-11 19:50:55 +01:00
|
|
|
color: var(--color-text);
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
}
|
|
|
|
|
2021-06-09 20:50:33 +02:00
|
|
|
.claim-grid__title-span {
|
|
|
|
display: flex;
|
2022-02-11 19:50:55 +01:00
|
|
|
// margin-top:var(--spacing-m);
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
color: var(--color-primary);
|
|
|
|
}
|
2021-06-09 20:50:33 +02:00
|
|
|
}
|
|
|
|
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
.claim-grid__title--empty {
|
|
|
|
margin-left: var(--spacing-s);
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
|
2021-04-26 21:19:17 +02:00
|
|
|
.claim-grid__title--first {
|
|
|
|
text-align: center;
|
|
|
|
width: 100%;
|
|
|
|
margin-bottom: var(--spacing-l);
|
|
|
|
|
|
|
|
.no-evil {
|
|
|
|
font-size: var(--font-heading);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-07-22 22:32:18 +02:00
|
|
|
.claim-grid__title--secondary {
|
|
|
|
margin-left: auto;
|
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
.claim-grid__help {
|
|
|
|
margin-bottom: 12px;
|
|
|
|
|
|
|
|
svg {
|
|
|
|
stroke: var(--color-text-subtitle);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview--tile {
|
2020-09-17 21:25:58 +02:00
|
|
|
margin-bottom: var(--spacing-m);
|
2020-01-20 17:47:03 +01:00
|
|
|
margin-right: 0;
|
|
|
|
margin-top: 0;
|
2020-06-01 19:03:19 +02:00
|
|
|
margin-left: var(--spacing-m);
|
2020-01-20 17:47:03 +01:00
|
|
|
justify-content: flex-start;
|
2020-08-26 23:16:45 +02:00
|
|
|
list-style: none;
|
2020-01-20 17:47:03 +01:00
|
|
|
|
2020-08-21 17:49:13 +02:00
|
|
|
.media__thumb {
|
2022-02-11 19:50:55 +01:00
|
|
|
overflow: hidden;
|
|
|
|
background-size: 100%;
|
|
|
|
transition: background-size 0.2s ease-in-out;
|
|
|
|
}
|
|
|
|
|
2022-03-31 11:19:32 +02:00
|
|
|
.channel-name {
|
|
|
|
p {
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-tile__title {
|
|
|
|
.claim__menu-button {
|
|
|
|
right: calc(var(--spacing-xs) * -1);
|
|
|
|
}
|
2020-08-14 22:14:37 +02:00
|
|
|
}
|
|
|
|
|
2022-05-18 13:16:35 +02:00
|
|
|
.comment__badge {
|
|
|
|
display: inherit;
|
|
|
|
|
|
|
|
.icon {
|
|
|
|
margin-bottom: -1px;
|
|
|
|
padding-bottom: 4px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-05-24 13:13:45 +02:00
|
|
|
@media (any-pointer: fine) {
|
2022-05-20 16:45:13 +02:00
|
|
|
&:hover {
|
|
|
|
cursor: pointer;
|
2021-03-03 19:50:16 +01:00
|
|
|
|
2022-05-20 16:45:13 +02:00
|
|
|
.media__thumb {
|
|
|
|
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
|
|
|
|
background-size: 108%;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
2022-05-20 16:45:13 +02:00
|
|
|
.claim-tile__title {
|
|
|
|
color: var(--color-link);
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
2022-05-20 16:45:13 +02:00
|
|
|
.claim__menu-button {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
|
|
|
|
.collection-preview-overlay__grid {
|
2022-05-20 16:45:13 +02:00
|
|
|
opacity: 1;
|
|
|
|
transition: 0.3s;
|
|
|
|
}
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
}
|
2020-08-18 18:52:48 +02:00
|
|
|
}
|
2020-08-14 22:14:37 +02:00
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
a {
|
|
|
|
&:focus {
|
|
|
|
.claim-tile__title {
|
|
|
|
color: var(--color-primary);
|
|
|
|
}
|
|
|
|
.media__thumb {
|
2022-05-18 13:16:35 +02:00
|
|
|
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.claim__menu-button {
|
|
|
|
&:focus {
|
|
|
|
border-radius: 50%;
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-08-21 17:49:13 +02:00
|
|
|
@media (min-width: $breakpoint-large) {
|
|
|
|
$width: calc((100% - var(--spacing-m) * 5) / 6);
|
|
|
|
width: $width;
|
|
|
|
@include handleClaimTileGifThumbnail($width);
|
|
|
|
|
|
|
|
&:first-child,
|
|
|
|
&:nth-child(6n + 1) {
|
|
|
|
margin-left: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-large) and (min-width: $breakpoint-medium) {
|
|
|
|
$width: calc((100% - var(--spacing-m) * 3) / 4);
|
|
|
|
width: $width;
|
|
|
|
@include handleClaimTileGifThumbnail($width);
|
|
|
|
|
|
|
|
&:first-child,
|
|
|
|
&:nth-child(4n + 1) {
|
|
|
|
margin-left: 0;
|
|
|
|
}
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
|
2020-01-30 18:41:21 +01:00
|
|
|
@media (max-width: $breakpoint-medium) and (min-width: $breakpoint-small) {
|
2022-06-07 21:16:26 +02:00
|
|
|
$width: calc((100% - var(--spacing-m) * 2) / 3);
|
2020-05-28 19:07:04 +02:00
|
|
|
width: $width;
|
|
|
|
@include handleClaimTileGifThumbnail($width);
|
2020-01-29 16:26:39 +01:00
|
|
|
|
|
|
|
&:first-child,
|
|
|
|
&:nth-child(3n + 1) {
|
|
|
|
margin-left: 0;
|
|
|
|
}
|
2020-01-27 21:46:17 +01:00
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
@media (max-width: $breakpoint-small) {
|
2020-09-17 21:25:58 +02:00
|
|
|
$width: 100%;
|
2020-05-28 19:07:04 +02:00
|
|
|
width: $width;
|
|
|
|
@include handleClaimTileGifThumbnail($width);
|
2020-09-17 21:25:58 +02:00
|
|
|
margin-left: 0;
|
2020-01-20 17:47:03 +01:00
|
|
|
|
2020-09-17 21:25:58 +02:00
|
|
|
&:not(:first-child) {
|
|
|
|
margin-top: var(--spacing-s);
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.claim__menu-button {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2020-01-29 16:26:39 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-01-06 22:13:26 +01:00
|
|
|
.claim-preview--horizontal-tile {
|
|
|
|
&:not(:first-child) {
|
|
|
|
margin-top: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
.claim-tile__title {
|
2021-03-03 19:50:16 +01:00
|
|
|
position: relative;
|
2022-02-11 19:50:55 +01:00
|
|
|
padding: var(--spacing-xs);
|
|
|
|
padding-left: 0px;
|
|
|
|
padding-right: var(--spacing-m);
|
|
|
|
padding-bottom: var(--spacing-xxxs);
|
|
|
|
margin-bottom: 0;
|
2021-03-03 19:50:16 +01:00
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
font-weight: 600;
|
|
|
|
color: var(--color-text);
|
2020-09-17 21:25:58 +02:00
|
|
|
font-size: var(--font-small);
|
2020-01-20 17:47:03 +01:00
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
@media (min-width: $breakpoint-large) {
|
|
|
|
min-height: 3.2rem;
|
|
|
|
padding-bottom: unset;
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
min-height: unset;
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-tile__info {
|
|
|
|
display: flex;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-top: var(--spacing-xxxs);
|
2020-01-20 17:47:03 +01:00
|
|
|
color: var(--color-subtitle);
|
2022-02-11 19:50:55 +01:00
|
|
|
padding: 0px;
|
|
|
|
padding-bottom: var(--spacing-l);
|
2020-01-20 17:47:03 +01:00
|
|
|
|
|
|
|
.channel-thumbnail {
|
2020-05-28 19:07:04 +02:00
|
|
|
@include handleChannelGif(2.1rem);
|
2020-06-01 19:03:19 +02:00
|
|
|
margin-right: var(--spacing-s);
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.claim-preview__overlay-properties {
|
|
|
|
color: rgba(var(--color-text-base) 0.7);
|
|
|
|
}
|
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
padding-bottom: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.media__subtitle {
|
|
|
|
.button__content {
|
|
|
|
margin-top: 3px;
|
|
|
|
margin-bottom: -3px;
|
|
|
|
}
|
|
|
|
}
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
.claim-tile-collection__info {
|
|
|
|
display: flex;
|
|
|
|
color: var(--color-subtitle);
|
|
|
|
|
|
|
|
.channel-thumbnail {
|
|
|
|
@include handleChannelGif(2.1rem);
|
|
|
|
margin-right: var(--spacing-s);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
.claim-tile__about {
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
color: var(--color-text-subtitle);
|
2020-11-06 18:52:17 +01:00
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
|
|
> * {
|
|
|
|
display: block;
|
|
|
|
}
|
2020-01-20 17:47:03 +01:00
|
|
|
}
|
|
|
|
|
2020-01-22 15:33:27 +01:00
|
|
|
.claim-tile__publishes {
|
2020-01-29 16:26:39 +01:00
|
|
|
font-size: var(--font-xsmall);
|
2020-01-22 15:33:27 +01:00
|
|
|
}
|
|
|
|
|
2020-01-20 17:47:03 +01:00
|
|
|
.claim-tile__about--channel {
|
|
|
|
@extend .claim-tile__about;
|
2020-01-20 20:38:15 +01:00
|
|
|
flex: 1;
|
|
|
|
flex-direction: row;
|
|
|
|
justify-content: space-between;
|
|
|
|
align-items: center;
|
2020-01-20 17:47:03 +01:00
|
|
|
font-size: var(--font-body);
|
|
|
|
}
|
2020-01-28 19:36:58 +01:00
|
|
|
|
2021-09-09 09:02:31 +02:00
|
|
|
.claim-tile__about--counts {
|
|
|
|
display: flex;
|
|
|
|
flex-wrap: wrap;
|
2022-02-11 19:50:55 +01:00
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
margin-top: -3px;
|
2021-09-09 09:02:31 +02:00
|
|
|
}
|
|
|
|
|
2020-08-04 19:50:33 +02:00
|
|
|
.claim-preview__file-property-overlay {
|
2020-01-29 17:38:46 +01:00
|
|
|
position: absolute;
|
2020-06-01 19:03:19 +02:00
|
|
|
bottom: var(--spacing-xxs);
|
|
|
|
right: var(--spacing-xxs);
|
2020-01-29 17:38:46 +01:00
|
|
|
background-color: var(--color-black);
|
2020-05-21 17:38:28 +02:00
|
|
|
padding: 0.3rem;
|
2020-01-29 17:38:46 +01:00
|
|
|
border-radius: var(--border-radius);
|
2020-08-04 19:50:33 +02:00
|
|
|
z-index: 2;
|
2021-08-25 17:44:08 +02:00
|
|
|
opacity: 0.7;
|
|
|
|
|
|
|
|
// show full opacity for touch devices
|
|
|
|
@media (pointer: fine), (pointer: coarse) {
|
|
|
|
opacity: 0.85;
|
|
|
|
}
|
2020-01-29 17:38:46 +01:00
|
|
|
|
|
|
|
.file-properties {
|
|
|
|
color: var(--color-white);
|
|
|
|
}
|
2020-03-26 16:18:05 +01:00
|
|
|
|
2020-05-21 17:38:28 +02:00
|
|
|
.file-price {
|
|
|
|
padding: 0.1rem;
|
|
|
|
}
|
2020-01-28 19:36:58 +01:00
|
|
|
}
|
2020-01-29 19:58:43 +01:00
|
|
|
|
2022-04-04 11:27:00 +02:00
|
|
|
$claim-preview-progress-bar-height: 5px;
|
|
|
|
|
|
|
|
.claim-preview__progress-section {
|
2022-04-01 16:56:18 +02:00
|
|
|
position: absolute;
|
|
|
|
bottom: 0;
|
2022-04-04 11:27:00 +02:00
|
|
|
height: $claim-preview-progress-bar-height;
|
2022-04-01 16:56:18 +02:00
|
|
|
width: 100%;
|
2022-04-04 11:27:00 +02:00
|
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__progress-bar {
|
|
|
|
height: $claim-preview-progress-bar-height;
|
2022-04-01 16:56:18 +02:00
|
|
|
background-color: var(--color-primary);
|
|
|
|
}
|
|
|
|
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
.claim-preview__claim-property-overlay {
|
|
|
|
position: absolute;
|
|
|
|
bottom: var(--spacing-xxs);
|
|
|
|
right: var(--spacing-xxs);
|
|
|
|
background-color: var(--color-black);
|
|
|
|
border-radius: var(--border-radius);
|
2022-02-11 19:50:55 +01:00
|
|
|
padding: 0.3rem;
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
opacity: 0.7;
|
|
|
|
z-index: 2;
|
|
|
|
|
|
|
|
.claim-preview__overlay-properties {
|
|
|
|
color: var(--color-white);
|
|
|
|
}
|
|
|
|
|
|
|
|
.file-price {
|
|
|
|
padding: 0.1rem;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__collection-wrapper {
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
bottom: 0;
|
|
|
|
right: 0;
|
|
|
|
left: 0;
|
|
|
|
z-index: 2;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
|
2021-08-25 17:44:08 +02:00
|
|
|
// show duration and watch later button when hovered
|
2020-01-29 19:58:43 +01:00
|
|
|
.claim-preview--tile {
|
|
|
|
&:hover {
|
2020-02-05 17:42:46 +01:00
|
|
|
.claim-preview__hover-actions {
|
2020-01-29 19:58:43 +01:00
|
|
|
display: block;
|
|
|
|
}
|
2020-08-04 19:50:33 +02:00
|
|
|
.claim-preview__file-property-overlay {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
.button--file-action {
|
|
|
|
.icon {
|
|
|
|
stroke: #f3f4f6;
|
|
|
|
}
|
|
|
|
}
|
2020-01-29 19:58:43 +01:00
|
|
|
}
|
|
|
|
}
|
2020-01-31 17:43:14 +01:00
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-preview--tile {
|
|
|
|
.claim-preview__repost-author {
|
|
|
|
width: 120px;
|
|
|
|
height: 120px;
|
|
|
|
overflow: hidden;
|
|
|
|
position: absolute;
|
|
|
|
top: 0px;
|
|
|
|
left: 0px;
|
|
|
|
|
|
|
|
.claim-preview__repost-ribbon {
|
|
|
|
position: absolute;
|
|
|
|
display: block;
|
|
|
|
width: 225px;
|
|
|
|
padding-top: 4px;
|
|
|
|
padding-right: 8px;
|
2022-04-07 20:05:57 +02:00
|
|
|
background-color: rgba(var(--color-primary-dynamic), 0.8);
|
2022-02-11 19:50:55 +01:00
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
text-align: center;
|
|
|
|
z-index: 1;
|
|
|
|
font-size: var(--font-xxsmall);
|
|
|
|
|
|
|
|
right: -25px;
|
|
|
|
top: 10px;
|
|
|
|
transform: rotate(-45deg);
|
|
|
|
|
|
|
|
.button--uri-indicator {
|
|
|
|
top: -3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.button {
|
|
|
|
width: 80px;
|
|
|
|
text-align: center;
|
|
|
|
.button__content {
|
|
|
|
width: 100%;
|
|
|
|
.channel-name {
|
|
|
|
width: 100%;
|
|
|
|
color: var(--color-primary-contrast);
|
|
|
|
font-size: var(--font-xxsmall);
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
2022-03-30 17:53:05 +02:00
|
|
|
display: unset;
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
&:hover {
|
|
|
|
opacity: 0.8;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2022-04-07 20:05:57 +02:00
|
|
|
|
|
|
|
.comment__badge {
|
|
|
|
display: none;
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
}
|
2021-02-16 22:09:20 +01:00
|
|
|
}
|
2020-01-31 17:43:14 +01:00
|
|
|
|
2021-02-16 22:09:20 +01:00
|
|
|
.claim-preview__repost-icon {
|
|
|
|
margin-bottom: -1px; // Offset it slightly because it doesn't look aligned next to all lowercase text + the @ from a channel
|
2020-01-31 17:43:14 +01:00
|
|
|
}
|
|
|
|
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
.claim-preview__list-index {
|
|
|
|
@extend .center-self;
|
|
|
|
width: 15px;
|
|
|
|
position: absolute;
|
|
|
|
transform: translateX(-23px);
|
|
|
|
text-align: end;
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__hover-actions-grid {
|
|
|
|
display: grid;
|
|
|
|
justify-items: end;
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
.claim-preview__hover-actions {
|
|
|
|
margin: 0px var(--spacing-xxs);
|
|
|
|
margin-bottom: var(--spacing-xxs);
|
|
|
|
|
|
|
|
&.second-item {
|
|
|
|
grid-column: 2;
|
|
|
|
grid-row: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
&.third-item {
|
|
|
|
grid-column: 2;
|
|
|
|
grid-row: 2;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-08-25 17:44:08 +02:00
|
|
|
// div that displays watch later button
|
2020-02-05 17:42:46 +01:00
|
|
|
.claim-preview__hover-actions {
|
2021-08-25 17:44:08 +02:00
|
|
|
// if the user is using a mouse
|
2021-09-09 09:02:31 +02:00
|
|
|
@media (pointer: fine) {
|
2021-08-25 17:44:08 +02:00
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
// if the user doesn't have a pointer (mouse etc) hide watch later button
|
2021-09-09 09:02:31 +02:00
|
|
|
@media (pointer: none), (pointer: coarse) {
|
2021-08-25 17:44:08 +02:00
|
|
|
display: none !important;
|
|
|
|
}
|
|
|
|
|
2021-08-02 17:03:55 +02:00
|
|
|
position: relative;
|
|
|
|
float: right;
|
2020-06-01 19:03:19 +02:00
|
|
|
top: var(--spacing-xxs);
|
2021-08-04 15:45:24 +02:00
|
|
|
margin-right: var(--spacing-xxs);
|
2020-02-05 17:42:46 +01:00
|
|
|
|
|
|
|
& > * {
|
2021-08-02 17:03:55 +02:00
|
|
|
color: var(--color-text);
|
2021-06-18 17:22:44 +02:00
|
|
|
background-color: var(--color-black);
|
|
|
|
padding: var(--spacing-xxs);
|
|
|
|
margin-right: 0;
|
|
|
|
&:hover {
|
2022-02-11 19:50:55 +01:00
|
|
|
background-color: var(--color-black);
|
2021-06-18 17:22:44 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-08-13 17:20:04 +02:00
|
|
|
.button--file-action,
|
|
|
|
.download-text {
|
2021-08-02 17:03:55 +02:00
|
|
|
display: block;
|
2021-06-18 17:22:44 +02:00
|
|
|
margin: 0 0;
|
|
|
|
padding: var(--spacing-xxs) var(--spacing-xxs);
|
|
|
|
height: unset;
|
|
|
|
|
2021-08-25 17:44:08 +02:00
|
|
|
// label (with 'Add' text) hidden by default
|
2021-06-18 17:22:44 +02:00
|
|
|
.button__label {
|
2022-02-11 19:50:55 +01:00
|
|
|
color: #f3f4f6;
|
2021-06-18 17:22:44 +02:00
|
|
|
font-size: var(--font-small);
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
2021-08-25 17:44:08 +02:00
|
|
|
// show the additional watch later text (Add) when hovered
|
2021-06-18 17:22:44 +02:00
|
|
|
&:hover {
|
|
|
|
.button__label {
|
|
|
|
display: inline;
|
|
|
|
}
|
|
|
|
}
|
2020-02-05 17:42:46 +01:00
|
|
|
}
|
2022-04-05 16:02:32 +02:00
|
|
|
|
|
|
|
.button--file-action {
|
|
|
|
width: auto;
|
|
|
|
max-width: 25.59px;
|
2022-04-05 16:59:38 +02:00
|
|
|
transition: max-width 0.2s;
|
2022-04-05 16:02:32 +02:00
|
|
|
padding: 0.3rem !important;
|
2022-04-05 16:59:38 +02:00
|
|
|
|
|
|
|
.button__content {
|
|
|
|
flex-direction: row-reverse;
|
|
|
|
}
|
2022-04-05 16:02:32 +02:00
|
|
|
.button__label {
|
2022-04-05 16:59:38 +02:00
|
|
|
margin-top: -1px;
|
2022-04-05 16:02:32 +02:00
|
|
|
padding-top: 0px;
|
|
|
|
margin-bottom: -4px;
|
2022-04-05 16:59:38 +02:00
|
|
|
margin-left: 4px;
|
|
|
|
margin-right: var(--spacing-xxs);
|
2022-05-18 13:16:35 +02:00
|
|
|
text-overflow: ellipsis;
|
2022-04-05 16:02:32 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
width: auto;
|
2022-04-05 16:59:38 +02:00
|
|
|
min-width: 25.59px;
|
|
|
|
max-width: 140px;
|
2022-04-05 16:02:32 +02:00
|
|
|
}
|
|
|
|
}
|
2020-02-05 17:42:46 +01:00
|
|
|
}
|
2020-10-20 19:10:02 +02:00
|
|
|
|
2021-07-13 00:39:23 +02:00
|
|
|
.claim-preview__active {
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
background-color: rgba(var(--color-primary-dynamic), 0.2);
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-preview__title {
|
|
|
|
color: var(--color-link);
|
|
|
|
}
|
|
|
|
|
|
|
|
.media__thumb {
|
2022-05-18 13:16:35 +02:00
|
|
|
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
|
|
|
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
.media__thumb:after {
|
2022-02-11 19:50:55 +01:00
|
|
|
position: absolute;
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
top: 50%;
|
|
|
|
right: 50%;
|
|
|
|
transform: translate(50%);
|
2022-04-05 16:02:32 +02:00
|
|
|
top: 0px;
|
2022-03-09 15:42:35 +01:00
|
|
|
content: '▸';
|
2022-02-11 19:50:55 +01:00
|
|
|
z-index: 1;
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
font-size: 3rem;
|
2022-02-11 19:50:55 +01:00
|
|
|
color: #fff;
|
|
|
|
text-shadow: 0 0 3px var(--color-primary), 0 0 5px var(--color-primary);
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
max-height: 100%;
|
2022-02-13 11:21:55 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
2022-03-09 14:48:25 +01:00
|
|
|
top: -2px;
|
2022-03-09 15:42:35 +01:00
|
|
|
left: 66px;
|
2022-03-09 14:48:25 +01:00
|
|
|
font-size: 3.4rem;
|
2022-02-13 11:21:55 +01:00
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
2021-07-13 00:39:23 +02:00
|
|
|
}
|
|
|
|
|
2021-04-28 11:48:13 +02:00
|
|
|
.claim-preview__live {
|
2022-05-18 13:16:35 +02:00
|
|
|
// margin-bottom: 0 !important;
|
2021-04-28 11:48:13 +02:00
|
|
|
.claim-preview__file-property-overlay {
|
2022-05-18 13:16:35 +02:00
|
|
|
opacity: 0.9; // The original 0.7 is not visible over bright thumbnails
|
2021-04-28 11:48:13 +02:00
|
|
|
color: var(--color-white-alt);
|
|
|
|
background-color: var(--color-live);
|
2022-02-11 19:50:55 +01:00
|
|
|
.claim-preview__overlay-properties {
|
|
|
|
color: white;
|
|
|
|
}
|
2021-04-28 11:48:13 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
.file-properties {
|
|
|
|
font-weight: var(--font-weight-bold);
|
|
|
|
margin-top: 2px; // Even out bottom spacing due to all caps "LIVE".
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
.claim-preview__primary-actions {
|
|
|
|
margin-right: var(--spacing-xs);
|
|
|
|
}
|
2021-04-28 11:48:13 +02:00
|
|
|
}
|
|
|
|
|
2020-10-20 19:10:02 +02:00
|
|
|
.claim-link {
|
2021-03-12 17:18:09 +01:00
|
|
|
@include font-sans;
|
2020-10-20 19:10:02 +02:00
|
|
|
position: relative;
|
|
|
|
}
|
2020-12-04 01:10:23 +01:00
|
|
|
|
|
|
|
.claim-preview__null-label {
|
|
|
|
margin: auto;
|
|
|
|
}
|
2021-03-03 19:50:16 +01:00
|
|
|
|
|
|
|
.claim-preview__channel-staked {
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
.channel-thumbnail {
|
2022-02-11 19:50:55 +01:00
|
|
|
@include handleChannelGif(2.1rem);
|
|
|
|
// margin-right: 0;
|
2021-03-03 19:50:16 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-07-15 00:12:07 +02:00
|
|
|
.claim-tile__header {
|
|
|
|
position: relative;
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.icon {
|
|
|
|
margin-top: 1px;
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
stroke: var(--color-primary);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-07-15 00:12:07 +02:00
|
|
|
.claim__menu-button {
|
2022-02-11 19:50:55 +01:00
|
|
|
right: -8px;
|
2021-07-15 00:12:07 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-07-15 19:13:31 +02:00
|
|
|
.menu__button {
|
|
|
|
&.claim__menu-button {
|
|
|
|
position: absolute;
|
|
|
|
top: var(--spacing-xs);
|
2022-02-11 19:50:55 +01:00
|
|
|
//right: var(--spacing-xs);
|
2021-07-15 19:13:31 +02:00
|
|
|
}
|
2021-03-03 19:50:16 +01:00
|
|
|
|
2021-07-15 19:13:31 +02:00
|
|
|
&.claim__menu-button--inline {
|
|
|
|
position: relative;
|
|
|
|
@extend .button--alt;
|
|
|
|
width: var(--height-button);
|
|
|
|
padding: 0;
|
|
|
|
border-radius: var(--border-radius);
|
2021-07-22 09:55:40 +02:00
|
|
|
align-self: flex-end;
|
2021-03-03 19:50:16 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-07-15 19:13:31 +02:00
|
|
|
@media (min-width: $breakpoint-small) {
|
2022-05-24 13:49:28 +02:00
|
|
|
@media (any-pointer: fine) {
|
|
|
|
.claim-preview--tile:not(:hover),
|
|
|
|
.claim-preview__wrapper:not(:hover) {
|
|
|
|
.claim__menu-button:not(:focus):not([aria-expanded='true']) {
|
|
|
|
opacity: 0;
|
|
|
|
}
|
2021-07-15 19:13:31 +02:00
|
|
|
}
|
|
|
|
}
|
2021-03-03 19:50:16 +01:00
|
|
|
}
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
|
|
|
|
.claim-preview__overlay-properties {
|
|
|
|
display: flex;
|
|
|
|
position: relative;
|
|
|
|
align-items: center;
|
2022-02-11 19:50:55 +01:00
|
|
|
color: #dddddd;
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
white-space: nowrap;
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
line-height: 1.2;
|
|
|
|
margin-left: 0;
|
|
|
|
margin-top: auto;
|
|
|
|
|
2022-02-11 19:50:55 +01:00
|
|
|
.icon--Heart {
|
|
|
|
color: var(--color-transparent);
|
|
|
|
}
|
|
|
|
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
& > *:not(:last-child) {
|
|
|
|
margin-right: var(--spacing-xxs);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview__overlay-properties--small {
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
@extend .claim-preview__overlay-properties;
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
line-height: 0.9;
|
|
|
|
font-size: var(--font-xxsmall);
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
color: var(--color-text);
|
|
|
|
|
|
|
|
@media (min-width: $breakpoint-small) {
|
|
|
|
&.playlist-channel {
|
|
|
|
display: flex;
|
|
|
|
gap: 0.5rem;
|
|
|
|
|
|
|
|
.ff-container {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
.ff-canvas {
|
|
|
|
max-width: 100%;
|
|
|
|
max-height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.ff-image {
|
|
|
|
width: 100% !important;
|
|
|
|
height: 100% !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
&.visibility-icon {
|
|
|
|
color: var(--color-text);
|
|
|
|
}
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
.claim__tags {
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
line-height: 1.2;
|
|
|
|
margin-left: 0;
|
|
|
|
margin-top: auto;
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
.tag {
|
2022-04-25 10:10:45 +02:00
|
|
|
background-color: var(--color-header-background);
|
|
|
|
color: var(--color-text);
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
font-size: var(--font-xsmall);
|
2022-02-01 21:28:18 +01:00
|
|
|
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
font-size: var(--font-xxsmall);
|
|
|
|
margin-top: var(--spacing-xxs);
|
|
|
|
padding: 2px var(--spacing-xxs);
|
|
|
|
height: unset;
|
|
|
|
|
|
|
|
.button__content {
|
|
|
|
height: unset;
|
|
|
|
}
|
|
|
|
}
|
2022-02-11 19:50:55 +01:00
|
|
|
|
|
|
|
&:hover {
|
2022-04-25 10:10:45 +02:00
|
|
|
background-color: var(--color-primary);
|
|
|
|
color: var(--color-primary-contrast);
|
2022-02-11 19:50:55 +01:00
|
|
|
}
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
& > *:not(:last-child) {
|
|
|
|
margin-right: var(--spacing-xxs);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim__tags--large {
|
|
|
|
flex-wrap: wrap;
|
|
|
|
margin-left: 0;
|
2022-02-11 19:50:55 +01:00
|
|
|
margin-bottom: var(--spacing-m);
|
wip
wip
wip - everything but publish, autoplay, and styling
collection publishing
add channel to collection publish
cleanup
wip
bump
clear mass add after success
move collection item management controls
redirect replace to published collection id
bump
playlist selector on create
bump
use new collection add ui element
bump
wip
gitignore
add content json
wip
bump
context add to playlist
basic collections page style pass wip
wip: edits, buttons, styles...
change fileAuthor to claimAuthor
update, pending bugfixes, delete modal progress, collection header, other bugfixes
bump
cleaning
show page bugfix
builtin collection headers
no playlists, no grid title
wip
style tweaks
use normal looking claim previews for collection tiles
add collection changes
style library previews
collection menulist for delete/view on library
delete modal works for unpublished
rearrange collection publish tabs
clean up collection publishing and items
show on odysee
begin collectoin edit header and css renaming
better thumbnails
bump
fix collection publish redirect
view collection in menu does something
copy and thumbs
list previews, pending, context menus, list page
enter to add collection, lists page empty state
playable lists only, delete feature, bump
put fileListDownloaded back
better collection titles
improve collection claim details
fix horiz more icon
fix up channel page
style, copy, bump
refactor preview overlay properties,
fix reposts showing as floppydisk
add watch later toast,
small overlay properties on wunderbar results,
fix collection actions buttons
bump
cleanup
cleaning, refactoring
bump
preview thumb styling, cleanup
support discover page lists search
sync, bump
bump, fix sync more
enforce builtin order for now
new lists page empty state
try to indicate unpublished edits in lists
bump
fix autoplay and linting
consts, fix autoplay
bugs
fixes
cleanup
fix, bump
lists experimental ui, fixes
refactor listIndex out
hack in collection fallback thumb
bump
2021-02-06 08:03:51 +01:00
|
|
|
|
|
|
|
& > * {
|
|
|
|
margin-top: var(--spacing-s);
|
|
|
|
}
|
|
|
|
}
|
Support resume-able upload via tus (#186)
* Publish button: use spinner instead of "Publishing..."
Looks better, plus the preview could take a while sometimes.
* Refactor `doPublish`. No functional change
This is to allow `doPublish` to accept a custom payload as an input (for resuming uploads), instead of always resolving it from the redux data.
* Add doPublishResume
* Support resume-able upload via tus
## Issue
38 Handle resumable file upload
## Notes
Since we can't serialize a File object, we'll need to the user to re-select the file to resume.
* Exclude "modified date" for Firefox/Android
## Issue
It appears that the modification date of the Android file changes when selected, so that file was deemed "different" when trying to resume upload.
## Change
Exclude modification date for now. Let's assume a smart user.
* Move 'currentUploads' to 'publish' reducer
`publish` is currently rehydrated, so we can ride on that and don't need to store the `currentUploads` in `localStorage` for persistence. This would allow us to store Markdown Post data too, as `localStorage` has a 5MB limit per app.
We could have also made `webReducer` rehydrate, but in this repo, there is no need to split it to another reducer. It also makes more sense to be part of publish anyway (at least to me).
This change is mostly moving items between files, with the exception of
1. An additional REHYDRATE in the publish reducer to clean up the tusUploader.
2. Not clearing `currentUploads` in CLEAR_PUBLISH.
* Restore v1 code for livestream replay, etc.
v2 (tus) does not handle `remote_url`, so the app still needs v1 for that. Since we'll still have v1 code, use v1 for previews as well.
2021-11-10 19:16:16 +01:00
|
|
|
|
|
|
|
.web-upload-item.claim-preview {
|
|
|
|
@media (max-width: $breakpoint-small) {
|
|
|
|
display: block;
|
|
|
|
|
|
|
|
.media__thumb {
|
|
|
|
margin-bottom: var(--spacing-s);
|
|
|
|
}
|
|
|
|
|
|
|
|
.claim-preview-metadata {
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
Playlists v2: Refactors, touch ups + Queue Mode (#1604)
* Playlists v2
* Style pass
* Change playlist items arrange icon
* Playlist card body open by default
* Refactor collectionEdit components
* Paginate & Refactor bid field
* Collection page changes
* Add Thumbnail optional
* Replace extra info for description on collection page
* Playlist card right below video on medium screen
* Allow editing private collections
* Add edit option to menus
* Allow deleting a public playlist but keeping a private version
* Add queue to Save menu, remove edit option from Builtin pages, show queue on playlists page
* Fix scroll to recent persisting on medium screen
* Fix adding to queue from menu
* Fixes for delete
* PublishList: delay mounting Items tab to prevent lock-up (#1783)
For a large list, the playlist publish form is unusable (super-slow typing) due to the entire list being mounted despite the tab is not active.
The full solution is still to paginate it, but for now, don't mount the tab until it is selected. Add a spinner to indicate something is loading. It's not prefect, but it's throwaway code anyway. At least we can fill in the fields properly now.
* Batch-resolve private collections (#1782)
* makeSelectClaimForClaimId --> selectClaimForClaimId
Move away from the problematic `makeSelect*`, especially in large loops.
* Batch-resolve private collections
1758
This alleviates the lock-up that is caused by large number of invidual resolves. There will still be some minor stutter due to the large DOM that React needs to handle -- that is logged in 1758 and will be handled separately.
At least the stutter is short (1-2s) and the app is still usable.
Private list items are being resolve individually, super slow if the list is large (>100). Published lists doesn't have this issue.
doFetchItemsInCollections contains most of the useful logic, but it isn't called for private/built-in lists because it's not an actual claim.
Tweaked doFetchItemsInCollections to handle private (UUID-based) collections.
* Use persisted state for floating player playlist card body
- I find it annoying being open everytime
* Fix removing edits from published playlist
* Fix scroll on mobile
* Allow going editing items from toast
* Fix ClaimShareButton
* Prevent edit/publish of builtin
* Fix async inside forEach
* Fix sync on queue edit
* Fix autoplayCountdown replay
* Fix deleting an item scrolling the playlist
* CreatedAt fixes
* Remove repost for now
* Anon publish fixes
* Fix mature case on floating
Co-authored-by: infinite-persistence <64950861+infinite-persistence@users.noreply.github.com>
2022-07-13 15:59:59 +02:00
|
|
|
|
|
|
|
.claim-list__scroll-to-recent {
|
|
|
|
margin-bottom: var(--spacing-xxs);
|
|
|
|
position: absolute;
|
|
|
|
right: 50%;
|
|
|
|
transform: translateX(50%);
|
|
|
|
z-index: 1600;
|
|
|
|
|
|
|
|
font-size: var(--font-xsmall);
|
|
|
|
padding: var(--spacing-xxs) var(--spacing-s);
|
|
|
|
bottom: var(--spacing-xxs);
|
|
|
|
|
|
|
|
background-color: var(--color-header-button) !important;
|
|
|
|
-webkit-backdrop-filter: blur(4px);
|
|
|
|
backdrop-filter: blur(4px);
|
|
|
|
border: 1px solid var(--color-text);
|
|
|
|
|
|
|
|
transition: opacity 0.2s ease, visibility 0.2s ease;
|
|
|
|
}
|