Angular-calendar: Text is cut off on days on mwl-calendar-month-view at lower screen resolutions and sizes

Created on 6 Aug 2018  路  6Comments  路  Source: mattlewis92/angular-calendar

Is your feature request related to a problem? Please describe

The title days of mwl-calendar-month-view part of the calendar don't render nicely on small screens or when specified to display at a smaller resolution properly as the day names overlap or are hidden.
It would be great to be able to specify whether or not to render with short day names, without it is difficult to use the calendar as lower resolutions.

Describe the solution you'd like
Preferably specifying whether the mwl-calendar-month-view should render days as full day names or shortened day names would just be a config in mwl-calendar-month-view.

Describe your use case for implementing this feature

Showing the calendar on mobile, or smaller than normal as an advanced date picker in our app.

Additional context

Apologies if didn't spot how to do this, was looking through documentation, especially here...
https://mattlewis92.github.io/angular-calendar/docs/components/CalendarMonthViewComponent.html

Great component and thanks for all the work you've done on it.

Most helpful comment

This is possible via a custom date formatter: https://mattlewis92.github.io/angular-calendar/#/customise-date-formats

You can read more about my reasoning for not supporting mobile out the box here tl;dr I'm not a ux designer and getting this to work great out the box on mobile and desktop is hard. Hope that helps! 馃槃

All 6 comments

image

We used CSS, but it would be far nicer to solve the issue programatically, so don't have todo tricks to stop mobiles browsers from initally rendering the text at full size then breaking the layout.

image

This is possible via a custom date formatter: https://mattlewis92.github.io/angular-calendar/#/customise-date-formats

You can read more about my reasoning for not supporting mobile out the box here tl;dr I'm not a ux designer and getting this to work great out the box on mobile and desktop is hard. Hope that helps! 馃槃

Thanks :-) If you want I can share styling back to the community to get this to work responsively when done.

Yeah if you could that would be awesome! 馃槃 You can base your work off the 0.26 branch as that's where all new dev work is going on right now.

Thanks :-) If you want I can share styling back to the community to get this to work responsively when done.

Hello, can you share me style your calendar. I try to change css in my component but it not work.
I want to change size cell day in month view. Thank you so much .

Was this page helpful?
0 / 5 - 0 ratings