It's ONLY for a WIDESCREEN(1920x1080)!
► The Goal: use at its maximum my WideScreen:
Flickr Widescreen (Part 1) v.291 (USw) by decembre
Imported from https://raw.githubusercontent.com/uso-archive/data/flomaster/data/usercss/52167.user.css
Details
Authordecembre
Licenseunlicense
Categoryflickr, widescreen, wide screen, darck and gray
Created
Updated
Size698 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
▶ NOTES (2023.08):
- Updated ONLY on Userstyles.world (USw) and GreasyFork:
Usersytles.org is broken for me (their new design don't permit Login! - request done 2023.08)
▶ LAST updates Infos:
[userstyles] "Flickr WideScreen & BigONE" [in Flickr Hacks pool]
- (2023.12.29): Work on Exif Info, 3 dots menu for comments, etc...
- (2023.12.15): Fix for the 2nd aborted New design for Photo Page ! ... pffff.
- (2023.12) THE RETURN of the "New design" for Photo page (2nd round!).
Read:
[Staff Response] Another new Flickr page ! - (2023.11) Aborted FIRST New design for Photo page.
Read:
New Design Photo page (2023.11) - Aborted ? - (2023.11) - Fix for the Photo New Design.
Read:
[Staff Response] New design for the photo pages? - (2023.08) Adaptation for the NEW 3 dots menu for comments, read:
Edit userstyle — UserStyles.world
========================================
►► What This Userstyle Change ? :
Some special advantages are offer by this Userstyle:
► Hidden Flickr Nav bar:
Hide the Top Nav Bar until you hover the Litlle Red Arrow ( at the middle/ top).
or the MAIL Alert Envelope Icon with the number of Mails Waiting (Appear only if you receive a mail...)
►► PHOTO Page Very Clear:
The Place for the photo is big (Heavy Use of Hover...).
All is visible in the windows without scrolling.
Infos / Actions are moved on Right Side of the Photo:
- Left Side: 2/3 space for the Photo or Video
- Right Side: 1/3 space for Infos and Actions.
- PHOTO Title on Top, Description stay at the bottom (hidden until you hover an arrow)
- Comment Form moved Right Side, Near User Avatar.
- Comments are hidden and visible until you hover the "Comment Icon" near the Comment Form.
They are shown by an overlay on the picture. A Comment counter is added to know where you are... .
- Reverse order in Photo page for:
Comments and Favorits user list
- Polls / Sets / Favs List: Counter, Scrollable , and compacted (Use Hover if too long).
- Panels "People in this Photo", "Tags" and "About Flickr": Moved at the bottom of the page (visible on hover too).
► Alternative to the Justified in the ARCHIVES pages:
Show the Hidden Options Bar.
So, Now you can chose the ARCHIVES Thumbnail size (Square - Small - Madium - Large)
► Thumbnail Zoom Plus facility:
Always maintain the capacity to use Thumbnail Zoom Plus, Firefox Addon and see the larger Photo.
► All "too flashy" Generics Buddy User Icons are muted :
Styled to be gray by a grayscale filter
►► Others Pages:
- All Thumbnails (Small and Justified): Total restyle
- Justified View :
. Row counter.
. Pagination Vertical on the left side.
Many small adaptations are done in many part of Flickr Pages....
You need to test it !
►► Find all my Userstyles for Flickr in different places:
A - decembre (UserStyles.org):
Traditional place to share our userstyle... but became worst now (slower).
B - decembre [userstyles.world - USw]:
The best alternative (faster) to the - now buggy - Userstyles.org.
A new place to share our userstyles, provided by very good devs !
C - decembre [UserStyles.org Archive]
Archived Mirror of Userstyles.org
And as Userscripts /UserCSS on:
D - decembre [GreasyFork]
▶ My 3 principals "Flickr WideScreen ALLinONE" userstyles:
- Flickr WideScreen (Part 1):
the first and principal to install
- Flickr WideScreen (Part 2):
Adaptation for GM (Adaptation for some great Userscripts i use a lot , since a long time...),
and Additional styles for some some unused pages.
- - Flickr WideScreen - Dark & Grey
►► You should install these 3 userstyles together, for a better results.
► To install them all at once:
- Flickr WideScreen - BigONE [userstyles.world - USw]
Or as userscript or Userstyles:
Flickr WideScreen - BigONE [GreasyFork]
About this new function in GreasyFork, read:
[Beta] User CSS support
► For Better result you need to use dark and minimal scrollbars with it ("minimal" because without it, some scrolling list can lost columns):
For Firefox Quantum / Chrome (with Stylus):
Overlay Scrollbars - easy customizable
For Waterfox "Classic" 56:
My Firefox - Slim Dark Scrollbar
► Better with Addon for images preview:
- Thumbnail Zoom Plus, Firefox Addon par David Adler (support discontinued) :
Shows full image when you hover over a thumbnail.
But you can use too (same usage):
- Imagus
- Image Max URL
Notes:
► Rework of the Photo page (Right side reorganized and aligned)
► (08.09.2021) - Add support to the New Notification System (work in progress...):
Ramping New Flickr Notifications Center and Settings to all members.
► Fight these New Flickr Adds (2020):
- With Chrome and Firefox Quantum:
Use uBlock Origin by Raymond Hill
- Waterfox Classic you need too:
Scriptlet Doctor
Read:
uBlockOrigin - Del "Upgrade to Flickr Pro to hide these ads" (with Addon "Scriptlet Doctor")
► You can test too my other Usertyles (Many are better for A WIDE SCREEN (1920x1080)!):
- [NEW] For Pool BETA (2020):
Flickr WideScreen - Pool No Beta - Small - [NEW] For Favorites (2020):
Flickr WideScreen - Favorites (Small) - For Flickr Viewers :
► Flickr WideScreen (Viewers) - DACKR Viewer
► Flickr WideScreen (Viewer) - FlickRiver
► Flickr WideScreen (Viewers) - FlickrHiveMind
► Better with them - Useful greasemonkey companions (write by me):
- Flickr - AUTO ShowAllGroups (Photo Page)
- Flickr - AUTO More Comments
- Flickr - AUTO Video Play
- Flickr - AUTO Video Replay
- Flickr - AUTO More Mini Thumbnail:
This script move the Mini-thumbnail under the user buddy icon and expand it on hover while it auto load more thumbnail in it.
An indicator show the origin of the mini-thumbnail:
- Stream
- Favs etc...
I use it always to navigate in stream, favs etc.... from Photo page.
► Greasemonkey's Scripts that i use a lot too:
- Flickr ★ Surf (USO Mirror)
► Scripts Broken? read :
Photopage scripts broken (HTTPS?)
▶ You Can Find Many Other Updated Infos About Flickr Extensions / Userscripts / Userstyles / Applications..
In :
► My BIG List (After New Photo Page Design (2014)) - Updated 2020.
► Addon for images preview:
- Thumbnail Zoom Plus, Firefox Addon par David Adler (support discontinued) :
Shows full image when you hover over a thumbnail.
But you can use too (same usage):
- Imagus
- Image Max URL
Or an userscript:
- Picviewer CE+
"Powerful picture viewing tool online, which can popup/scale/rotate/batch save pictures automatically"
▶ Last Changes in v.242:
- Photo Page corrections for Photo Editor and other things.
- Adaptation for "New design" for Photo page (2nd round!).
Add support for the Comments List in Modal. - Adaptation for:
[Acknowledged by Flickr Staff] NEW feature? Both date taken and uploaded now showing on photo page - SUPP NEW Pubs in Photop pages and Search
- Fix Modal popups (less sensitive to the viewport)
- Search: Show "Print Shop" on Hover.
read:
Can you disable "from the print shop" in searches? - Some Code are moved from Part1 to Part 2 (here) due Userstyle.org limit (on Userstyles World there is not limit, but ... )
- Adaptation to the new "Version History" introduce by Flickr
- Adaptation to the NEW Search Sidebar (Oct 2022):
Visible on arrow on Top/Right.
and fine tuning the Search pages - Adaptation for new Code Change in Photo Page (2020.06.11):
.".photo-notes-scrappy-view-OLD" revert to "photo-notes-scrappy-view"
".photo-well-scrappy-view-OLD" revert to ".photo-well-scrappy-view" - Settings apges, Photo Page: Notes, all popups and rework general
- Rework Slide Show
- Change the Userstyle Name
- Adaptation for Flickr change (11.2021):
New function? - User info Modal on hover the user buddy icon (On photo page ) - Galleries - OLD View before 2018 (seems broken now...):
https://www.flickr.com/help/forum/en-us/72157720068442958/#reply72157720081770587 - Add Support The New Notification System (work in progress...):
Ramping New Flickr Notifications Center and Settings to all members. - Safety Level indicator (on top near buddy icon)
- Fav Star - rework (Flat style: Not the NEW ugly animation)
- Improve the Pool Beta and No Beta pages
- Photo page: Comment Form Enlarge (height on hover) + Emoji Comments
- Map indicator in Photo Page.
- Add a Dark Minimal style for readability (but it's better to use my :
Flickr WideScreen - Dark & Grey
(you can remove it - Top of my CSS - if you don't like) - General Corrections (last one in first):
Forum Help, Photo / Buddy Icon Editor, All Modal popups, Title/Description Editor, "Add to Pool/ Gallery" (with click on "+" icon), Mini Thumbnail in photo page, Top header improve, Pool Discussion / Help Forum, no ADS in Photo page ...... etc .
▶▶ Find my others Userstyles here - Many for Flickr:
Decembre on UserStyles.world[USw]
A New site to post our Userstyles - faster and not buggy!
- USO Archives.
Note: Should become outdated if i can't update my userstyles in Userstyles.org:
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Flickr WideScreen (Part 1) v.291 (USw) - NORMAL NO BETA/BETA
@namespace flickr.com
@version 291.0
@author decembre
@description Flickr using at its maximum a WideScreen
@license unlicense
==/UserStyle== */
@-moz-document domain("flickr.com"), domain("na.ads.yahoo.com"), domain("combo.staticflickr.com") {
/* ==== A - FLICKR - 0 - Flickr WideScreen(Part 1) v.291 (new291) - 2nd ABORTED NEW PHOT DESIGN (JUnew) - POOL no BETA REWORK - NORMAL NO BETA/BETA [A VOIR] ===== */
/* TEST - WIDE */
html.styleguide body #pool-photos.photo-display-container.ju ,
html.styleguide body.super-liquid #pool-photos.photo-display-container.ju {
width: 100% !important;
min-width: 99vw !important;
max-width: 99vw !important;
height: auto !important;
overflow: hidden !important;
overflow-y: auto !important;
}
html.styleguide body.super-liquid #pool-photos.photo-display-container.ju #photo-display-container ,
html.styleguide body #pool-photos.photo-display-container.ju #photo-display-container {
width: 100% !important;
min-width: 99vw !important;
max-width: 99vw !important;
height: auto !important;
overflow: hidden !important;
overflow-y: auto !important;
}
body.new-footer.new-footer-tight-ass #main,
body.new-footer.new-footer-tight-ass #Main {
margin: 0 0 0 0 !important;
}
/* MODAL - ADD PEOPLE TAGS */
.sub-photo-add-tags-view.flickr-view-root-view{
height: 100%;
border-radius: 5px !important;
border: 1px solid red!important;
}
.tags-selection-list-view .tags-selection-list-container {
height: 100%;
min-height: 50vh !important;
max-height: 50vh !important;
overflow: auto;
border-bottom: 1px solid #cfd6d9;
}
.tags-selection-list-view .tags-selection-list-container .tags-selection-list li {
float: left !important;
clear: none !important;
width: 48% !important;
margin: 0 0 3px 2px !important;
}
.tags-selection-list-view .tags-selection-list-container .tags-selection-list li .tag-content .name-info {
display: flex;
flex-direction: column;
max-height: 4vh !important;
overflow: hidden !important;
overflow-y: auto !important;
}
/* TAGS SELEcTED */
.machine-tags-list + .tags-selection-list{
background: green !important;
}
.manage-link-container a{
color: peru !important;
}
.selection-search-container {
color: silver !important;
background: #111 !important;
}
.selection-search-container::before {
width: 22px !important;
height: 22px !important;
opacity: 0.8 !important;
background: #222 url("https://combo.staticflickr.com/ap/build/images/sprites/icons-87310c47.png") no-repeat scroll -315px -231px !important;
}
.tags-selection-list-view .tags-selection-list-container .tags-selection-list li:nth-child(odd){
background: #222 !important;
}
.tags-selection-list-view .tags-selection-list-container .tags-selection-list li:nth-child(even){
background: #111 !important;
}
/* (new225COM) ERRORS PAGES - CLICK MORE BUT GO TO EXPLORE PAGES */
/* ERROR 403 */
.fluid.html-fluid-error-page-view.scrolling-layout{
height: 99.8vh !important;
margin: 0 0 0 0 !important;
overflow: hidden !important;
}
.fluid.html-fluid-error-page-view.scrolling-layout .fluid-error-page-view {
height: 99.8vh !important;
margin: 0 0 0 0 !important;
overflow: hidden !important;
}
.fluid.html-fluid-error-page-view.scrolling-layout .fluid-centered {
max-width: 100% !important;
margin-left: auto;
margin-right: auto;
}
.fluid-error-page-container.message.is-http-403 ,
.fluid-error-page-view section {
margin: 1rem 0;
}
.fluid-error-page-view section.contextual-suggestions {
display: inline-block !important;
height: 70vh !important;
overflow: hidden !important;
overflow-y: auto !important;
}
.fluid-error-page-view section.contextual-suggestions > .photo-list-view {
text-align: center !important;
height: 70vh !important;
padding: 0 10% !important;
overflow: hidden !important;
overflow-y: auto !important;
}
.fluid-error-page-view section .photo-list-photo-view {
position: relative !important;
display: inline-block !important;
height: 125px !important;
margin: 5px !important;
background-position: 50% center;
background-repeat: no-repeat;
background-size: cover;
transform: unset !important;
}
/* ERROR - MORE BUT */
.fluid-error-page-view section.contextual-suggestions > .butt {
position: absolute !important;
margin: 0rem 0 0 -120px !important;
bottom: 6vh !important;
}
.fluid-error-page-view section.contextual-suggestions > a.butt:after {
content: ": ▶ Explore" !important;
}
/* TEST SCROLLBAR HIDDEN - scrollbar-width: none, - WORK ONLY ON TOP HTML / OR IFRAME ? */
html.styleguide body {
position: relative;
display: inline-block !important;
box-sizing: border-box;
padding: 0 0 0 0 !important;
min-height: 100%;
height: auto !important;
overflow-x: hidden !important;
/* scrollbar-width: none !important; */
/* overflow: -moz-scrollbars-none !important; */
/* scrollbar-width: unset !important; */
}
/* SUPP PUBS / GEO YAHOO / SPONS ETC... */
/* (new218) NEW PUBS */
/* MOOOLA = Pépétes / somme d'argent
https://dictionnaire.reverso.net/anglais-francais/moola
=== */
/* SUPP - PB PHO COMMENTS */
/* .fluid.html-photo-page-scrappy-view .photo-page-scrappy-view section> [class*="view"] , */
/* SUPP - PHOT */
.photo-list-getty-item-view ,
.loading-text ,
.fluid.html-photo-page-scrappy-view body script + .fluid-droparound-view + .fluid-droparound-overlay.transparent + .fluid-droparound-view + .fluid-droparound-view ,
.sub-photo-content-container > .sub-photo-right-view > div:not([class*="sub-photo-"]):not(.photo-charm-exif-scrappy-view) ,
.fluid.html-photo-page-scrappy-view .photo-page-scrappy-view section nav > [class*="view"] ,
.with-emoji-picker .attach-to-input .upward-arrow ,
#comments .adding-comment .html-info-trigger ,
#comments #reply.comment-block .comment-icon ,
.html-photo-page-scrappy-view .gift-pro-view ,
.photo-page-i-m-container,
.photo-page-i-m-container .upgrade-to-pro-cta,
.photo-page-m-container,
.photo-page-m-container .upgrade-to-pro-cta ,
/* OTHERS */
div[class*="-moola-"] ,
.photo-list-view .photo-list-moola-item-view ,
.photo-charm-exif-scrappy-view + div:not([class^="view sub-photo-"]) ,
summary ,
.sub-photo-right-view summary ,
.fluid.html-search-photos-unified-page-view #content .search-tools-view + .requiredToShowOnServer[class*="view"] ,
.getty-widget-view ,
.getty-search-widget-view ,
.sub-photo-container.centered-content .getty-photopage-view ,
/* SUPP -PHO - FAVE RED */
.sub-photo-left-view > .sub-photo-fave-view.faves-present .ui-icon-fave-star ,
.photo-engagement-view .fave-view a.fave-star.false.is-faved svg.icon-fave ,
.photo-engagement-view .fave-view a.fave-star.is-faved svg.icon-fave ,
.view.photo-engagement-view .view.fave-view .fave-star.false .icon-fave_hollow ,
.photo-engagement-view .fave-view a.fave-star.false.is-faved svg.icon-fave_hollow ,
#global-nav #gb-ac-wrap.droparound-with-storage #gb-ac-panel .pro-hook-container ,
.NoneFound .SortOptions ,
.sub-photo-tags-people-view .c-contact-search-autocomplete .contact-list + input.add-person + .contact-autocomplete-arrow ,
.feed-rail-view .feed-rail .feed-rail-content-container .rail-items-container .rail-item.flat ,
.photo-page-leader-moola-view ,
.moola-sticky-view ,
.footer-full-view .foot-banner-container.fixed ,
#testimonials .avatar.person.small>span ,
.cookie-banner-reg ,
.sub-photo-left-view > .sub-photo-fave-view i ,
.ForumPost + br ,
#Main > .TopicListing[cellspacing="0"]:not(.PeopleResults):not(#Photo) tr:last-of-type td + td > a.pro-badge-new svg ,
.ad-card ,
.New ,
.html-feed-new-page-view .feed-b ,
.feed-page-view .feed .moola-card ,
.feed-page-view .feed-b,
.feed-page-view .feed-b .upgrade-to-pro-cta,
.activity-card.ad-card.pro-upsell-card ,
a[href="/account/upgrade/pro"] ,
.ad-card ,
.html-feed-new-page-view .feed-b ,
.sub-photo-left-view > .sub-photo-fave-view.faves-present svg.icon ,
.opt-out-widget .feedback ,
.opt-out-widget .optout-toggle .divider ,
.optout-toggle>a ,
.fluid.html-group-home-page-view .fluid-droparound-overlay ,
.main.moola-search-div ,
.signup-footer ,
.photo-page-lightbox-scrappy-view .photo-well-view.enable-zoom .facade-of-protection-neue,
.photo-page-lightbox-scrappy-view .photo-well-view.dark.enable-zoom .facade-of-protection-neue ,
#group-sidebar .pending.sec h3.group-subhead ~ p ,
#foot ,
.view.old-magic-email-banner-view ,
.modal.html-modal[style="top: 50%; left: 50%; margin-top: -218.5px; margin-left: -300px; max-height: inherit; max-width: inherit; overflow: visible;"] ,
.nav-banner-container ,
.featured-toast-view .featured-toast ,
.featured-toast-view.activated ,
#Hint img ,
#invites-and-comments div#comments div#comments-list ol#photo-activity.mixed li.comment-block.comment-deleted ,
#pool-photos.ju[style^="padding-left: 345px;"] .row:empty ,
#pool-photos.sm .photo-display-item:hover .remove-from-group img ,
.TopicReply td h3 ,
.sn-navitem>span>br ,
#you-subnav-more-butt ,
ul.sn-dropdown .sn-dropdownitem.sn-divider ,
.subnav-refresh .sn-avatar.sn-avatar-size-0 img.sn-avatar-ico,
.subnav-refresh .sn-avatar.sn-avatar-size-48 img.sn-avatar-ico,
.subnav-refresh .sn-avatar.sn-avatar-size-60 img.sn-avatar-ico,
.subnav-refresh .sn-avatar.sn-avatar-size-100 img.sn-avatar-ico ,
.photo-display-item .play ,
.spaceball ,
.fluid.html-favorites-page-view .footer-full-view ,
.zoom-modal .zoom-photo-container .facade-of-protection-zoom ,
.photo-well-scrappy-view .height-controller .photo-well-media-scrappy-view-OLD > .facad...