1. Lock the width of the second pane so that the layout doesn't shift after the image is fetched.
2. The image is huge, so pass through the optimizer.
- Wait until the container is mounted to get the exact image width.
Unfortunately, it still takes 0.8s on average to fetch the image, regardless of how small the image has been optimized.
Login graphic improvements
1. Lock the width of the second pane so that the layout doesn't shift after the image is fetched.
2. The image is huge, so pass through the optimizer.
- Wait until the container is mounted to get the exact image width.
Unfortunately, it still takes 1s (on average) to fetch the image, regardless of how small the image has been optimized.
## Issue
Closes "6056 Extend notificaiton text to show more characters"
## Notes
Looking at the code and comments, I couldn't figure out what was the reason for adding the width constraint (just in case this breaks something).
My guesses:
- Try not to make the rhs thumbnail too far apart from the lhs thumbnail.
- Try not to make the rhs thumbnail misaligned due to dynamic width of the "xx days ago" string on the far right.
## Changes:
Extended the width as much as possible, while retaining some gap before the "xx days ago" string and "unread dot" so that thumbnails stay align in the general case.
The components still reflows nicely (as it did previously) per window-size.
* Markdown: make '>Quote' look less like a banner
Quotes should be subtle as it is primarily intended for redundant content, but currently it looks more like a banner that brings lots of focus.
This change is also background-independent. Currently, the Quotes in Posts doesn't look like it has a background color, because it happened to be the same as the Post's background. This makes it inconsistent with Quotes in Comments. Let's just always make it blend in + grayish text.
* Markdown: inline code tweak
- better symmetry
- less spacing to the left and right, since it's common to already have a space in the sentence (even if it doesn't, like in CJK, the new spacing looks sufficient).
* 4481: Use regular font in Markdown Editor
I think we should not use Monospace fonts for the Markdown Editor since we are not coding.
Similar to Github, code-blocks and inline-code only gets converted to monospace in the Preview.
## Issue
- Closes 5998 Theme color problems
- "_Seeing the theme go blue when a modal pops up. There's a change in color on Odysee branch also when this happens (but not as apparent)_"
##
1. Fix overlay background color back to gray theme.
2. Also, fixed the Active Toggle Button back to primary colors.
3. Fix hard-to-read "videojs time tooltip". Using the primary colors is a nice touch, but people have complained in Discord that it's too dim given it's transparent background. Just use 'white' instead. Don't use '--color-white' since that's a bit dimmed down.
4. Fix odd highlight in the volume slider (the bright primary color was used in the background).
* Fix error text color for dark mode.
Don't alter --color-danger since that color works fine as a backdrop for the Toast Message.
* Remove duplicates
* Fix typo
* Fix primary/secondary button and notice_message
* Fix dimmed checkbox
* #6006 Switch from 'coolGray' to 'gray'
* Fix invisible nag (missing --color-orange)
* Release date -- initial attempt (squashed and rebased)
- Use white color for calendar buttons in release date input
- Update icon color for release date input
- Allow to set time in release date and display it under additional options
- Add release date field
* Upgrade to latest react-datetime-picker.
I believe this also picks up the y18n security fix.
* Handle dark theme and general style fixes.
* [+redux] Change how release_time is edited.
- `releaseTime` is now a number instead of a string, matching `release_time`. It was getting confusing what the variable units were.
- `releaseTime` will always match `release_time` for an edit. It will be used in the GUI to reset just the date to the original, instead of having to reset the entire form.
- `releaseTimeEdited` will be used by `updatePublishForm` in the GUI to represent the desired new release time. Set to `undefined` if we don't want to change the date.
* Add 'Reset|Now|Default' buttons instead of overloading the date-picker's "X" button.
Before this, the "X" button resets to the original (previous) publish date for Edits, and resets to current time for New Claims. This is very confusing, so added explicit text-based buttons -- hopefully this is more intuitive.
* bump redux to master
Co-authored-by: Franco Montenegro <franco.montenegro.ruke@gmail.com>
Co-authored-by: Thomas Zarebczan <thomas.zarebczan@gmail.com>
* Add ICON.INFO - "i" within a circle.
Basically, an inverted ICON.ALERT.
* Posts: restore "Tip unlock | Claim details" component
## Issue
5882: tip unlock + claim id detials missing from markdown posts view
## Notes
The easiest solution would be to put `FileDescription` into posts, but I think that goes against the clean up of the Post layout, where the focus should be on the content. The faded style of the File Details section seems too distracting, plus we don't want the File Description anyway.
Fixed by:
- Make the existing "LBC amount" clickable to show credit details. An additional padlock will appear if the content is yours and you have tips to unlock.
- Add an "info" icon beside it to show file details.
These "link" buttons are usually lit, but I dimmed it in this case to make them stand out less. Again, focusing on Post content instead of buttons.
It would have been a clean implementation through `renderProperties`, but due to the need to adjust the opacity of `claim-preview__file-property-overlay` (the parent elemtn), I ended up having to create a new `live` attribute.
* FileExporter: add 'fetch' hook + Web support
* Re-add ability to export transactions
Closes 4793: Export Wallet History For Taxation Purposes
* Move file-creation to the background.
Don't let the file-creation process block the GUI.
Requires lbry-redux update.
* Bump redux | doFetchTransactions: bump pageSize to 999999; remove doFetchSupport
* bump redux
Co-authored-by: Thomas Zarebczan <thomas.zarebczan@gmail.com>
- For the active swap, switch from polling to websocket. The returned data is now the Charge data from the commerce, so some parsing will be required.
- Allow the user to send other coins that the commerce supports.
- Only save the 'chargeCode' to the wallet. The other data can be repopulated from this.
- Store the receipt currency. I'm not sure if the commerce supports sending bits from various coins. Take the coin that came with the 'COMPLETED' message for now.
- Fix 'lbc' calculation to match IAPI side.
- Allow users to see full detauls from "View Past Swaps".
- String cleanup
- GUI cleanup.
- The icon makes the screen too busy when there are lots of images in a page.
- Use src as the last resort for the text (I though `title` and `alt` was mandatory in markdown; apparently not).
## Issue
4945: Simplify / revamp search filters for odysee (and lbry.tv)
## Changes
- Tweaked the "claim type = file | channel | everything" a little to hopefully make it more intuitive.
- Added "Sort By".
- Added "Upload Date".
- Fixed the affected files to handle both Desktop and Odysee.
- Tweaked the layout to be more condensed so that we can see some results as we change the filter.
- Added animations.
- Added "Exact match" option that helps user to surround with quotes.
## Issue
- Redo 5636: Disable video previews in comments/posts made by channels below a certain channel staked level
- Closes 5738: expand video preview level requierment to markdown images also
## Issue
Closes 5721: Publish-Preview updates
## Changes
(1) Match the recent "incognito" change that sets the channel to `undefined` via `updatePublishForm`. This change would also cover `null` -- I don't think it's being used to represent something else, so showing "Anonymous" for `null` should be fine.
(2) Added channel icons, so it'll be more obvious to the user if they accidentally selected the wrong channel.
## Issue
- Second attempt at 5500: Allow right click + report feature on tiles
- Related: PR_5531
## Notes
Although the link can already be easily copied on web, the menu item is still retained for consistency between the platforms.
Looking at a few other files hoping to understand the convention for components, I moved the videojs.scss file to where all CSS related files appear to be in the project.
* initial support for block/mute
* hide blocked + muted content everywhere
* add info message for blocked/muted characteristics
* sort blocked list by most recent block first
* add 'blocked' message on channel page for channels that you have blocked
* cleanup
* delete unused files
* always pass mute/block list to claim_search on homepage
* PR cleanup
## Issues
5349: Remove theater mode button from player in comments
5519: Theatre mode button doesn't do anything in full screen mode [Odysse/LBRY desktop app]
## Notes
5349: Wanted to hide for 'markdown' as well, but it seems useful for 'markdown' (to clear the screen from Related), so I did not include it.
## Issue
Closes#5392 better support for non-standard resolution videos
It's not actually cropped -- the control bar was opaque.
## Change
Use 0.80 opacity to somewhat see the full picture.
Using 0.5 or less would be even better, but due to the default tiny size of the control bar, the text becomes unreadable (it's readable if you zoom the browser to get larger text). Don't want to mess with sizing for now, so using 0.80 to get the best of both worlds.
## Issue
5438: Keep floating player in view area
## Changes
- Restore correct z-index
- The bug came as a side effect of cbac2174. Redo cbac2174 to cover both close button and floating player.
- Remove wobbling when dragging to bottom-right.
- The extra gap introduced is fighting against react-draggable. If gaps are needed, handle it entire ourselves or do it somewhere in react-draggable; neither is worth the effort, so the gap was removed.
## Issue
5221: floating player won't close during autoplay countdown
## Change
Change the z-index when hover to ensure it is really on top of everything.
## Issue:
5119 "Video: Mobile UI + overlay for keyboard shortcut feedback" was disabled because the feature broke the chromecast button in Android Chrome
Clearer display of takeover amounts
Repost from empty search result, from top page, or from claim
review changes
final touches
bump
empty comment copy
they
emptier
validation cleanup
extra
Wider post area for bigger text, while keeping the character count the same or less.
Removed `overflow: auto;` as it was not required and was creating unnecessary scrollbars when margins were incorrectly calculated.
## Issue
- Personally annoyed of having to switch to landscape just to change the setting. There's still space for it.
- This serves as a quick fix until "4712: Video: Allow access to all control in small screen" is figured out
The only downside to this new implementation is that the top-most (or right-most?) scrollbar won't get the customization. Any other sub-components (e.g. sidebar) will get the customization.
My guess is that the "top-most" scrollbar is above the `main-wrapper`. I'm not sure if we can (or should) add another className higher than App.
The impetus for the customization was the ugly sidebar anyway, so at least we covered that.
## Issue
4727: Sidebar's transient scrollbar doesn't fit in the Dark Theme
## Approach
The 'webkit' API works on Chrome, but Firefox ignores it and uses it's own fancy scrollbar when 'webkit' is used (can't seem to change any properties). It's better than the current look, but still doesn't fit our theme, plus it makes the product look different on different browsers.
Firefox now supports the new 'scrollbar' API, so we can now tweak the scrollbar, but the API only provides limited attributes.
Don't wanna complicate things by using Javascript, so we'll use Firefox's limited attributes as the common denominator and just live with a plain, rectangle scroll bar BUT with better color to match the theme.
## Issue:
5044: Auto hide cursor on video on static hover
## Approach
The existing code only hides the cursor when playing in fullscreen. Extend that to normal mode as well.
## Extra
Add in few new strings
## Issue
The abrupt cut-off of the expandable section bugs me (looks like a rendering glitch), especially when it cuts off in the middle of a line.
## Change
In addition to the existing 'More' button, we fade out the section to provide additional visual cues.
## Approach
This solution doesn't require the background color to be known, so it will work regardless where <Expandable> is used, or whatever color-scheme is chosen.
However, it does utilize non-standard css -- for older browsers, it should simply cut-off like the before.
Many of the creators including myself use transparency to achieve some effect. We all love PNGs and GIFs, so please dont shoot in your leg by limiting creative potential :)
For example: you can see the effect here, you can inspect lement and remove background color from channel "profile image": https://lbry.tv/@LBRYlytics:4
