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

Misalignment issues on different screen resolutions #3739

Closed
mbechev opened this issue Aug 15, 2022 · 5 comments
Closed

Misalignment issues on different screen resolutions #3739

mbechev opened this issue Aug 15, 2022 · 5 comments

Comments

@mbechev
Copy link
Contributor

mbechev commented Aug 15, 2022

Describe the bug
The Scheduler has some misalignment issues caused by different screen resolutions (reproduced on mobile devices as well).

Month view issue (snapshot taken from the site):
image

Week view all-day slot misalignment (snapshot taken from the site):
image

To Reproduce
Zoom the browser
https://stackblitz.com/edit/angular-q4aaeu?file=src%2Fapp%2Fapp.component.ts

@HaberkornJonas
Copy link

HaberkornJonas commented Aug 31, 2022

I face the same issue.
I noticed that it happens as soon as I set a height via CSS to the <kendo-scheduler>

@Leafgard
Copy link

Leafgard commented Sep 1, 2022

Please also note that there is another misalignment issue when having multiple lines in header, as you can see below:

image

<kendo-scheduler
    scrollTime="08:00"
    [weekStart]="weekStart"
    [kendoSchedulerBinding]="events"
    [selectedDate]="selectedDate"
    [selectedViewIndex]="selectedViewIndex"
    [showWorkHours]="true"
  >
    <ng-template kendoSchedulerDateHeaderTemplate let-date="date">
      <span>{{ date | kendoDate:'EEEE' }}</span>
      <br>
      <span>{{ date | kendoDate:'dd.MM.yyyy' }}</span>
    </ng-template>
    <kendo-scheduler-day-view> </kendo-scheduler-day-view>
    <kendo-scheduler-week-view> </kendo-scheduler-week-view>
    <kendo-scheduler-month-view> </kendo-scheduler-month-view>
    <kendo-scheduler-timeline-view> </kendo-scheduler-timeline-view>
    <kendo-scheduler-agenda-view> </kendo-scheduler-agenda-view>
  </kendo-scheduler>

In my opinion this issue should have higher severity.

Also, none of these issues are happening on the Kendo UI React library. Perhaps the structure of the Scheduler is different? If so, it might be a good idea to build Kendo UI libraries atomically to avoid such surprises.

@mbechev
Copy link
Contributor Author

mbechev commented Sep 1, 2022

An example of the last reported issue:

https://stackblitz.com/edit/angular-cfkeca-zwqudl

@ipeshev
Copy link
Contributor

ipeshev commented Oct 24, 2022

Fix available in latest dev version.

@stnikolova
Copy link
Contributor

Fix available in v4.3.5 and above of @progress/kendo-angular-scheduler.

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

No branches or pull requests

7 participants