search

danroth27 / BlazorWeather

Blazor Weather
https://aka.ms/blazorweather
MIT License
247 stars 57 forks source link

Styling #1

Closed SteveSandersonMS closed 5 years ago

SteveSandersonMS commented 5 years ago

Hopefully this recreates the Xamarin version's styling pretty closely.

On desktop, uses side-by-side layout:

image

On mobile, uses vertical scroll:

image

Beware that the chart component isn't laid out using CSS, so it's not instantly responsive as you resize the window. If you resize the window, the chart will stay at its old size and looks wrong until the next time it repaints itself, which is every time we fetch new weather data. So for demo purposes, it's best not to do that. Just switch between desktop and mobile modes using the browser dev tools and hit reload immediately.

Also I had to update to Telerik's 2.0.0 package, because their 1.7.0 package is no longer on their feed so I can't get it. You'll be better off with 2.0.0 otherwise you'll have the same problem when you try to run this on other machines.

SteveSandersonMS commented 5 years ago

Update: realised I lost the weather image. Have re-added it:

image

danroth27 commented 5 years ago

@SteveSandersonMS Thanks so much! It looks great, and the code is much cleaner!