Speed Dial Thumbnails too Large...
-
I have to keep the "User Interface" zoomed to 100% or the text in menus and address bar are too small to read comfortably. When the UI is zoomed to 100%, the Speed Dial thumbnails are HUGE! Is there a way around this? If not, please consider separate sizing of the UI and the thumbnails. Thanks!
Robert
-
Hi, you must be new using Vivaldi because, too bad, this is a really old and often requested feature (ability to define speeddial thumbs geometry unrelated to UI zoom)
You can try see if a feature request in the relevant threads is already there or create a new one, and see if it gets voted enough to get the devs attention. Don't hold your breath.
https://forum.vivaldi.net/topic/20968/feature-requests-for-1-13 -
@ddferrari said in Feature requests for Vivaldi 1.14:
Allow resizing of Speed Dial Thumbnails.
-
@bobad hello, try to use my custom css code. I'm using UI zoom on 110%, so they may be too small for you, but I think it's still better than default.
Follow these articles on how to apply it:
https://forum.vivaldi.net/topic/10549/modding-vivaldi/11
https://forum.vivaldi.net/topic/10592/windows-batch-file-for-patching-your-mods-into-vivaldi/19Here the code:
/* SPEED DIAL */ .startpage .startpage-navigation { min-height: 40px; } .dials { position: relative; margin: 30px auto 0; } .sdwrapper .dial-columns { position: relative; width: auto !important; height: auto !important; padding: 15px; margin: 0 auto !important; } @media only screen and (min-width: 951px) and (max-width: 1120px) { .sdwrapper .dial-columns { width: 930px !important; } } @media only screen and (min-width: 1121px) and (max-width: 1320px) { .sdwrapper .dial-columns { width: 1110px !important; } } @media only screen and (min-width: 1321px) and (max-width: 1520px) { .sdwrapper .dial-columns { width: 1290px !important; } } @media only screen and (min-width: 1521px) and (max-width: 1720px) { .sdwrapper .dial-columns { width: 1470px !important; } } @media only screen and (min-width: 1721px) and (max-width: 1920px) { .sdwrapper .dial-columns { width: 1650px !important; } } @media only screen and (min-width: 1921px) { .sdwrapper .dial-columns { width: auto !important; } } .speeddial .dial { position: relative; float: left; width: 160px !important; height: 135px !important; transform: none !important; margin: 10px; } .dials .dial .thumbnail-image { border-radius: 5px; } .dials .dial .button-title { padding: 2px 6px 3px; border-radius: 15px; font-size: 11.5px; } .speeddial .dial:last-of-type { margin-bottom: 15px; } .speeddial .dial.add { display: none; }
-
Cool, it works, thanks
-
@retoree said in Speed Dial Thumbnails too Large...:
@bobad hello, try to use my custom css code. I'm using UI zoom on 110%, so they may be too small for you, but I think it's still better than default.
Follow these articles on how to apply it:
https://forum.vivaldi.net/topic/10549/modding-vivaldi/11
https://forum.vivaldi.net/topic/10592/windows-batch-file-for-patching-your-mods-into-vivaldi/19Here the code:
/* SPEED DIAL */ .startpage .startpage-navigation { min-height: 40px; } .dials { position: relative; margin: 30px auto 0; } .sdwrapper .dial-columns { position: relative; width: auto !important; height: auto !important; padding: 15px; margin: 0 auto !important; } @media only screen and (min-width: 951px) and (max-width: 1120px) { .sdwrapper .dial-columns { width: 930px !important; } } @media only screen and (min-width: 1121px) and (max-width: 1320px) { .sdwrapper .dial-columns { width: 1110px !important; } } @media only screen and (min-width: 1321px) and (max-width: 1520px) { .sdwrapper .dial-columns { width: 1290px !important; } } @media only screen and (min-width: 1521px) and (max-width: 1720px) { .sdwrapper .dial-columns { width: 1470px !important; } } @media only screen and (min-width: 1721px) and (max-width: 1920px) { .sdwrapper .dial-columns { width: 1650px !important; } } @media only screen and (min-width: 1921px) { .sdwrapper .dial-columns { width: auto !important; } } .speeddial .dial { position: relative; float: left; width: 160px !important; height: 135px !important; transform: none !important; margin: 10px; } .dials .dial .thumbnail-image { border-radius: 5px; } .dials .dial .button-title { padding: 2px 6px 3px; border-radius: 15px; font-size: 11.5px; } .speeddial .dial:last-of-type { margin-bottom: 15px; } .speeddial .dial.add { display: none; }
Hey I've been using your code and works great. However there's a strange pattern for the shadows of the thumbnails. Is there any method to remove the shadows?
-
@kallon said in Speed Dial Thumbnails too Large...:
Try to add
box-shadow: none !important;
to.dials .dial .thumbnail-image
-
@hadden89 said in Speed Dial Thumbnails too Large...:
@kallon said in Speed Dial Thumbnails too Large...:
Try to add
box-shadow: none !important;
to.dials .dial .thumbnail-image
Oh yeah!
-
@retoree said in Speed Dial Thumbnails too Large...:
@bobad hello, try to use my custom css code. I'm using UI zoom on 110%, so they may be too small for you, but I think it's still better than default.
Follow these articles on how to apply it:
https://forum.vivaldi.net/topic/10549/modding-vivaldi/11
https://forum.vivaldi.net/topic/10592/windows-batch-file-for-patching-your-mods-into-vivaldi/19Here the code:
/* SPEED DIAL */ .startpage .startpage-navigation { min-height: 40px; } .dials { position: relative; margin: 30px auto 0; } .sdwrapper .dial-columns { position: relative; width: auto !important; height: auto !important; padding: 15px; margin: 0 auto !important; } @media only screen and (min-width: 951px) and (max-width: 1120px) { .sdwrapper .dial-columns { width: 930px !important; } } @media only screen and (min-width: 1121px) and (max-width: 1320px) { .sdwrapper .dial-columns { width: 1110px !important; } } @media only screen and (min-width: 1321px) and (max-width: 1520px) { .sdwrapper .dial-columns { width: 1290px !important; } } @media only screen and (min-width: 1521px) and (max-width: 1720px) { .sdwrapper .dial-columns { width: 1470px !important; } } @media only screen and (min-width: 1721px) and (max-width: 1920px) { .sdwrapper .dial-columns { width: 1650px !important; } } @media only screen and (min-width: 1921px) { .sdwrapper .dial-columns { width: auto !important; } } .speeddial .dial { position: relative; float: left; width: 160px !important; height: 135px !important; transform: none !important; margin: 10px; } .dials .dial .thumbnail-image { border-radius: 5px; } .dials .dial .button-title { padding: 2px 6px 3px; border-radius: 15px; font-size: 11.5px; } .speeddial .dial:last-of-type { margin-bottom: 15px; } .speeddial .dial.add { display: none; }
Your code broke with latest update 2.2.1388.37 (Stable channel) or is there something wrong with my set up? Speed dial shows one single thumbnail.
-
@kallon I use a version based on retoree code (recent snapshot), probably there is something wrong in another mod you use.
Try to do a custom.css with only this mod, and retry. -
This is truly great but is there a way to scale the speed dials inside the smaller speed dial folder accordingly too?
-
Almost obsolete with the new Vivaldi snapshot 1511.4
-
@npro Almost? I already deleted it new size options fit my needs already.
-
@iAN-CooG haha yeah I thought this thread was about modding, which still can be done to the SD tiles, that's why I wrote "almsost" but I didn't bother editing the comment
-
As of the latest release 2.5, there are settings for you to choose which size to use for speed dial thumbnails. You can get them in settings. I'll mark this request as done.
-
Hi,
I would like to transform the thumbnails from Square to Wide.
Would this code work modifying the sizes?I think I've read it and seen it long time ago, but can't find the Topic.
Thank you.
-
@Pathduck gave the solution here: https://forum.vivaldi.net/topic/40714/question-wide-speeddial-thumbs