Top Bar with animation problem - Page...

Sep 2nd, 2020 at 03:14 AM
User 116462 Photo

Astropilot
Registered User
130 posts

Wayan Jaya Space Cadet wrote:
As I have mentioned already, there aren't any problems with switching between portrait or landscape with any of the 12 mobile devices (of varying size, age & quality) within our household here in deep dark remote Java.


I quite agree. Even here in my home in even darker Spain all the mobile devices display it flawlessly. If it wasn't for SD's Device view which alerts me to the users of Iphone X/XS and all devices that have a width below 800px and a height above 800px.
I guess it really is a non issue.
Berthold, Spain
Astronomy site: http://www.astronomy.artinso.com
Musical events: http://www.orphelion-ensemble.com
ED V4, SD V5
Sep 2nd, 2020 at 04:57 AM
User 2699991 Photo

Its A Kind Of Bali Magic
Registered User
5,466 posts
Online Now

Beastro wrote:
Wayan Jaya Space Cadet wrote:
As I have mentioned already, there aren't any problems with switching between portrait or landscape with any of the 12 mobile devices (of varying size, age & quality) within our household here in deep dark remote Java.


I quite agree. Even here in my home in even darker Spain all the mobile devices display it flawlessly. If it wasn't for SD's Device view which alerts me to the users of Iphone X/XS and all devices that have a width below 800px and a height above 800px.
I guess it really is a non issue.

You only have to refresh the different viewport widths if viewing locally (IE, preview on) within SD.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

Contact me
https://rsd-tutorialscom.coffeecup.com/index.html
Sep 4th, 2020 at 02:51 PM
User 116462 Photo

Astropilot
Registered User
130 posts

Hi again,
In the end, I stayed with the original Top bar and redesigned the layout to accomodate the 640px (medium) breakpoint.
I cleaned up a lot of the old code and classes and brought the updated site online now.
https://www.orphelion-ensemble.com/

A special thanks again to Wayan and Inger for all the help

Kind regards
Berthold, Spain
Astronomy site: http://www.astronomy.artinso.com
Musical events: http://www.orphelion-ensemble.com
ED V4, SD V5
Sep 4th, 2020 at 04:27 PM
User 2699991 Photo

Its A Kind Of Bali Magic
Registered User
5,466 posts
Online Now

Hello
Unfortunately, I have to say that on our phones here in deepest darkest Java in landscape mode, the links underneath the slider are too small and too close together, making it almost impossible to select 1 (the number of times I was sent to Facebook, was unnerving)
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

Contact me
https://rsd-tutorialscom.coffeecup.com/index.html
Sep 4th, 2020 at 04:49 PM
User 116462 Photo

Astropilot
Registered User
130 posts

Wayan Jaya Space Cadet wrote:
Hello
Unfortunately, I have to say that on our phones here in deepest darkest Java in landscape mode, the links underneath the slider are too small and too close together, making it almost impossible to select 1 (the number of times I was sent to Facebook, was unnerving)


I was afraid you would say that. It drove me crazy on my spanish made mobile phone. So, I think it is time for the facebook link to move and change the sizing.
My tactic is to let the container fontsize of the title above the slide and the arrow below the slide grow and shrink with VH and keep the typeface inside the container at a fixed EM setting. That seemed to be the only way to keep the title reasonably big/small depending on landscape/portrait orientation.
Thanks for the observation!
Berthold, Spain
Astronomy site: http://www.astronomy.artinso.com
Musical events: http://www.orphelion-ensemble.com
ED V4, SD V5
Sep 4th, 2020 at 05:08 PM
User 116462 Photo

Astropilot
Registered User
130 posts

I changed it. Could you try again (No rush).
Berthold, Spain
Astronomy site: http://www.astronomy.artinso.com
Musical events: http://www.orphelion-ensemble.com
ED V4, SD V5
Sep 4th, 2020 at 05:25 PM
User 2699991 Photo

Its A Kind Of Bali Magic
Registered User
5,466 posts
Online Now

Hello again
That's a little better but those links are still too small, you will find that eventually you will get a warning from Google about it and the effect it has for SEO.

On another issue there is now a semi transparent something that overlays the slider images it's about halfway of the width of the image is like an elongated pill shape not in your face visible but enough to notice it.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

Contact me
https://rsd-tutorialscom.coffeecup.com/index.html
Sep 4th, 2020 at 06:00 PM
User 2699991 Photo

Its A Kind Of Bali Magic
Registered User
5,466 posts
Online Now

Wayan Jaya Space Cadet wrote:
Hello again
That's a little better but those links are still too small, you will find that eventually you will get a warning from Google about it and the effect it has for SEO.

On another issue there is now a semi transparent something that overlays the slider images it's about halfway of the width of the image is like an elongated pill shape not in your face visible but enough to notice it.


Here is a suggestion
If I was to do something like what you are trying to do I would try adding another Facebook thingy to the end of the navbar
I would give that an additional class of
"show-for-landscape"

to the Facebook thingy that is at the bottom of the page, I would give that an additional class name of
"hide-for-landscape"
that way you could increase the links for the info to a higher size

Sound simple but it does mean a bit more fiddling about, and I haven't tested it out yet but it might work
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

Contact me
https://rsd-tutorialscom.coffeecup.com/index.html
Sep 5th, 2020 at 04:22 AM
User 116462 Photo

Astropilot
Registered User
130 posts

Wayan Jaya Space Cadet wrote:
Wayan Jaya Space Cadet wrote:
Hello again
That's a little better but those links are still too small, you will find that eventually you will get a warning from Google about it and the effect it has for SEO.

On another issue there is now a semi transparent something that overlays the slider images it's about halfway of the width of the image is like an elongated pill shape not in your face visible but enough to notice it.


Here is a suggestion
If I was to do something like what you are trying to do I would try adding another Facebook thingy to the end of the navbar
I would give that an additional class of
"show-for-landscape"

to the Facebook thingy that is at the bottom of the page, I would give that an additional class name of
"hide-for-landscape"
that way you could increase the links for the info to a higher size

Sound simple but it does mean a bit more fiddling about, and I haven't tested it out yet but it might work


Can you try this:
https://www.artinso.com/orphelion_testing/

I rearranged the Flex and wrapping for 2 breakpoints that seem to be the critical ones -400px and 640px- From 800px, things get sorted out.
I gave the title a min-width to prevent it from wrapping and wrapp the arrow to the right of the slide for small screens, where the slide is small anyway
Berthold, Spain
Astronomy site: http://www.astronomy.artinso.com
Musical events: http://www.orphelion-ensemble.com
ED V4, SD V5
Sep 5th, 2020 at 05:42 AM
User 2699991 Photo

Its A Kind Of Bali Magic
Registered User
5,466 posts
Online Now

Yes that looks a little bit better at least I'm not ending up on facebook :)
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS

Contact me
https://rsd-tutorialscom.coffeecup.com/index.html

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.