Search…

X3 Photo Gallery Support Forums

Search…
 
hwilms
Topic Author
Posts: 13
Joined: 11 Aug 2018, 15:49

Size of topbar and horizontal ruler

06 Jul 2020, 05:13

Hi,

I desperately try to change the size (height) of the topbar. Is there any way, perhaps by a custom css, to change the size and remove the <hr> under the bar?

In addition I'd like to see the gallery in the index completely. Each picture, even the landscape ones are cropped at the bottom, although I have set height to 100% and fit to "contain". Changing the height has no effect either.

My site is https://h-art.photos.

Best regards,
Hartmut
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Size of topbar and horizontal ruler

06 Jul 2020, 05:36

hwilms wrote:I desperately try to change the size (height) of the topbar. Is there any way, perhaps by a custom css, to change the size
First of all, the topbar height is dictated by the logo size within. If you go to Settings > Style > Logo, you will see a CSS section specifically for the logo. You will see that default logo width is 230 px, which in your case based on the logo aspect, causes a logo height 118px. Try to reduce the logo width to for example 120px. Then, in the same logo CSS section, you will see padding: 1em 0, which assigns 1em padding above and below the logo. You could for example reduce this to padding: 5px 0. To demonstrate the result, here I have set .logo > img width: 100 px; and .logo padding: 0;:
Image
As you can see, that makes the topbar too small and looks strange without any margin, but it demonstrates how to make it thinner. The topbar must contain your logo, with padding.
hwilms wrote:and remove the <hr> under the bar?
This is part of the style, but you can remove it by going to Settings > Custom > Custom CSS and adding this:
Code
.nav {
  border: none !important;
}
In Settings > Style > Skin, you could also set "navigation background: FILLED", but that would set a background color for the topbar instead of the border-bottom.

In addition I'd like to see the gallery in the index completely. Each picture, even the landscape ones are cropped at the bottom, although I have set height to 100% and fit to "contain". Changing the height has no effect either.
I can't see this. When it slides to portrait aspect image "streets-of-san-francisco.jpg", I see this:
Image
... which is identical display and aspect as the original image:
https://h-art.photos/content/index/Stre ... ncisco.jpg

Not sure it's related, but you did not resize all images prior to upload? There is one image in the slideshow at > 5000 px width, which will load slow, render slow and is way beyond the resolution of what most screens support. All images should be uploaded at "web-friendly" sizes. I wrote a post about this here:
https://www.photo.gallery/blog/image-si ... -websites/

It could be, depending on your specific device, that images might be getting cut off at 4096 px, as that might be a limit on some older devices. From here, I can't see any images being cut off ...