Well tested CSS-customization changes not working anymore

corinos · February 8, 2014

Hi there,

I just noticed that some custom settings of my website (www.orinosphotography.com), implemented via CSS, do not work anymore. Just to name one, the thumbs/photo exchange tweak (http://www.aaronmphotography.com/Customizations/Gallery/SM-Layout/Swap-Photo-Thumbnails-SM).

Additionally some paddings that I inserted so that the bread-crumb, text description and photos of landscape and portrait collage galleries (http://www.orinosphotography.com/Portfolio/Travel/ & http://www.orinosphotography.com/Portfolio/Portrait/) are alligned, only partly work.

Any ideas?

It is unacceptable that such changes in the layout occur. I cannot afford wasting hours checking my site pages every week and re-tune the CSS code to cater for those changes.

bobbyhero · February 8, 2014

You should contact the developer of that custom CSS, to see if they're able to update it. We do not support that customization directly, and cannot promise that as time goes on, things may not change slightly (which will require an update to existing customizations).

Ferguson · February 9, 2014

bobbyhero wrote: »

You should contact the developer of that custom CSS, to see if they're able to update it. We do not support that customization directly, and cannot promise that as time goes on, things may not change slightly (which will require an update to existing customizations).

But if you had a real, detailed release notes posted, the developers and users of such customizations would stand a better chance.

All you post are marketing-level updates with significant feature changes, and occasionally say "fixed" on a bug, there's never the kind of "what happens to the page" detail that would help those who help you, by providing features people want and need (I am a consume of same, not provider, but feel their pain).

phaserbeam · February 9, 2014

I'm also using that tweak for change thumbs/photo on smugmug style galleries... and here it is still working.

denisegoldberg · February 9, 2014

phaserbeam wrote: »

I'm also using that tweak for change thumbs/photo on smugmug style galleries... and here it is still working.

I see thumbs on the left and photo on the right on that page, the usual smugmug-style presentation.

--- Denise

phaserbeam · February 9, 2014

denisegoldberg wrote: »

I see thumbs on the left and photo on the right on that page, the usual smugmug-style presentation.

--- Denise

Now thats odd... see screenshot... Maybe there is a rollout still not yet finished any maybe europeans will get that "update" later...

denisegoldberg · February 9, 2014

phaserbeam wrote: »

Now thats odd... see screenshot... Maybe there is a rollout still not yet finished any maybe europeans will get that "update" later...

It's a bit disconcerting that different viewers of the same page see different things. I wonder what else is lurking...

--- Denise

beardedgit · February 9, 2014

Maybe this is one of those instances where custom code needs to be tailored for each browser?

I'm on latest Firefox and I see the same as Phaserbeam's screenshot.

Oh, and I'm in Europe too. Or maybe I'm not. Hell, I don't know, I'm in the UK so, depending on who's top of the political pile today, we could be in - out - in - out - shake it all about... (Link for Anna Lisa)

pbandj · February 9, 2014

beardedgit wrote: »

Maybe this is one of those instances where custom code needs to be tailored for each browser?

Yep, in Firefox (latest version), Phaserbeam's tweak is working, in Chrome it is not.

phaserbeam · February 9, 2014

pbandj wrote: »

Yep, in Firefox (latest version), Phaserbeam's tweak is working, in Chrome it is not.

Now that's funny... the tweak does not use many complicated css hacks... especially none of them is really browser specific...

I would like to help fixing the code but i have no chrome here... and all other (unsupported) browsers i have (opera 12 and konqueror) do show the page "correctly"... (photo left/thumbs right)

beardedgit · February 9, 2014

pbandj wrote: »

Yep, in Firefox (latest version), Phaserbeam's tweak is working, in Chrome it is not.

I'd agree with that.

phaserbeam wrote: »

Now that's funny... the tweak does not use many complicated css hacks... especially none of them is really browser specific...

I would like to help fixing the code but i have no chrome here... and all other (unsupported) browsers i have (opera 12 and konqueror) do show the page "correctly"... (photo left/thumbs right)

Probably best to contact Aaron about that, so that he can update his code repository and maybe post some sort of warning for those using his customisations.

phaserbeam · February 9, 2014

I just installed ubuntu with google-chrome on virtualbox and i was able to see the "difference"... :-/
I'm not sure but could this be a chrome bug? Because i tried to change the float-css-part and i do not see any difference...

P.S. Hopefully this is not a hard coded "update"... while i can "update" the code on firefox the same code does not work on chrome. Maybe also javascript related? In that case we could not "fix" it anymore... and i really prefer to have the thumbs on the right...

When using chrome the float setting for .sm-gallery-image-container does always show the value "none". FF shows float:left.

thenickdude · February 9, 2014

In SmugMug's CSS, the div .sm-gallery-images is currently set to "flex-direction: row-reverse" which is swapping the order of those elements back to the standard one. Add this CSS to fix it:

.sm-user-ui .sm-gallery-smugmug .sm-gallery-images.yui3-g {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

corinos · February 12, 2014

I replaced the code:

.sm-gallery-smugmug .sm-gallery-image-container {
  float: left !important;
}

with the above snippet provided by Lamah and my galleries appear correctly (i.e. thumbs on the right) in Chrome. For example: http://www.orinosphotography.com/Photo-Exhibit/Places/Santorini-Spring-2013/i-tMm4Pgd

ChancyRat · February 12, 2014

corinos wrote: »
I replaced the code:
.sm-gallery-smugmug .sm-gallery-image-container {
  float: left !important;
}
with the above snippet provided by Lamah and my galleries appear correctly (i.e. thumbs on the right) in Chrome. For example: http://www.orinosphotography.com/Photo-Exhibit/Places/Santorini-Spring-2013/i-tMm4Pgd

FYI, this is what I see (scaled to fit DG's rules).
The thumbs are below the main image because of the width of my window. I think this is normal behavior. My window feels the "right size" for viewing to me. I had to enlarge the window to about 1080 px wide to bring the thumbs to the left of the image.

FYI, to my unpracticed eye, you have a lot of unused space in the left bar. I highlighted in PINK an area that you might be able to remove. If you narrowed the width of the left bar, the thumbs and image might align better? (Guessing).

phaserbeam · February 12, 2014

I checked Lamahs code already on my own site and it seem to work very well... that icons appear below the main photo is pretty normal because of the dynamic design (which i think is a must-have these days with all those various devices and screensizes...).

Thx. to Lamah for the quick update on that.

corinos · February 12, 2014

Thanks for the comments ChancyRat. Indeed I have a lot of unused space in the left bar. The initial rationale was to have all the icons (linkedin, FB, etc.) in one row. I think I will change them to two rows though and squeeze the left bar.

ChancyRat wrote: »

FYI, this is what I see (scaled to fit DG's rules).
The thumbs are below the main image because of the width of my window. I think this is normal behavior. My window feels the "right size" for viewing to me. I had to enlarge the window to about 1080 px wide to bring the thumbs to the left of the image.

FYI, to my unpracticed eye, you have a lot of unused space in the left bar. I highlighted in PINK an area that you might be able to remove. If you narrowed the width of the left bar, the thumbs and image might align better? (Guessing).

ChancyRat · February 12, 2014

corinos wrote: »

Thanks for the comments ChancyRat. Indeed I have a lot of unused space in the left bar. The initial rationale was to have all the icons (linkedin, FB, etc.) in one row. I think I will change them to two rows though and squeeze the left bar.

Oh goodness, I missed the icons taking up space. Two rows sounds good tool.

Well tested CSS-customization changes not working anymore

Comments