Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
JamboBuenna opened this issue Aug 6, 2018 · 8 comments

Comments

@JamboBuenna
Copy link

JamboBuenna commented Aug 6, 2018

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.

@JamboBuenna
Copy link
Author

image

@JamboBuenna
Copy link
Author

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

@mattlewis92
Copy link
Owner

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! 😄

@JamboBuenna
Copy link
Author

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

@mattlewis92
Copy link
Owner

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.

@thangviet222
Copy link

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 .

@MarcioMercuri
Copy link

Boa noite, Gostaria de saber se tem como tirar o numeral "1" em vermelho do calendário !!!

@MarcioMercuri
Copy link

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants