Guidance on custom cards, CSS and best practice

Hi - brand new to HA in the past week. I’ve been researching as much as I can, but wanted to test a couple things here as it seems like there are some relatively recent updates and/or tools available to do things.

I am looking to make a custom card to show weather. I want it to be a combination of clock weather card and hourly weather card. I am trying to build a card that has:

  • the top portion of clock weather card showing the picture/time
  • a middle portion showing the hourly breakdown for the day
  • a bottom portion showing the 5-day forecast

My planned approach is going to be:

  • make a vertical stack that has 3 cards
    • first card is a clock weather card (where I would modify to turn off the forecast)
    • second card is the hourly weather card
    • third card is a 2nd clock weather card (modified to only show 5-day forecast)
    • Use Card Mod (or UIX) YAML adjustments to tweak for visual display and consistency

Some questions:

  1. Is the approach above the best/optimum way, or is there a better way other than repeating two of the same card into a single card
  2. I have come across both Card Mod and UIX, and it seems like UIX is the path forward, especially since I am new and have no legacy dashboards/mods. Accurate?
  3. Once I get that custom card build, I’d ideally like to be able to add another level of complexity where the card can be swiped, rotating through a couple of locations (home, ski hill, parents, etc.)…is that just putting a Bubble swipe card overlay and then nesting the above custom card for each location?

Sorry for the long post. Thanks in advance!