Improve weather forecast card layout

[watercrossing]

Proposed change

The weather forecast card is rather space in-efficient and includes a lot of empty space. Here is a screenshot of the weather card, showing 1. Current Weather (2 rows), 2. Hourly forecast (3 rows), 3. Daily forefast (3 rows), 4. Current Weather and Daily Forecast (4 rows), and 5. Current weather and Hourly forecast (4 rows). In particular around 2. and 5. there is a lot of empty vertical space.

I think it looks now a little more similar to the tile cards, although the size could probably be compressed further still.

This pull request adjusts the styling of the cards to enable them to fit them into slighty fewer rows.

I have also added a configuration option to adjust the number of forecast slots to show. The default is still 5 to not change existing installations (but in my opinion 7 looks better).

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

views:
  - title: Home
    sections:
      - type: grid
        cards:
          - type: heading
            heading: Weather
            heading_style: title
          - type: tile
            entity: sensor.sun_next_dawn
          - type: entities
            entities:
              - entity: sensor.sun_next_dusk
          - type: weather-forecast
            entity: weather.forecast_home
            show_forecast: false
            forecast_type: daily
            grid_options:
              columns: 12
              rows: 2
          - show_current: false
            show_forecast: true
            type: weather-forecast
            entity: weather.forecast_home
            forecast_type: hourly
            grid_options:
              columns: 12
              rows: 2
            forecast_slots: 5
          - show_current: false
            show_forecast: true
            type: weather-forecast
            entity: weather.forecast_home
            forecast_type: daily
            forecast_slots: 7
          - show_current: true
            show_forecast: true
            type: weather-forecast
            entity: weather.forecast_home
            forecast_type: hourly
            forecast_slots: 5
          - type: weather-forecast
            entity: weather.forecast_home
            forecast_type: daily
            grid_options:
              columns: 12
              rows: 4
          - show_current: false
            show_forecast: true
            type: weather-forecast
            entity: weather.forecast_home
            forecast_type: hourly
            forecast_slots: 10

Additional information

I have added a new localization string "ui.panel.lovelace.editor.card.weather-forecast.forecast_slots".

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io