Fix: calculate day calendar grid in JS as chrome does not support calc-division in CSS-grid (#2340)

Co-authored-by: Raphael Michel <michel@rami.io>
This commit is contained in:
Richard Schreiber
2021-11-19 17:42:16 +01:00
committed by GitHub
parent e694bd8c21
commit 910a35dedc

View File

@@ -512,7 +512,31 @@ $(function () {
$(".day-calendar [data-concurrency]").each(function() {
var c = parseInt(this.getAttribute("data-concurrency"), 10);
if (c > 9) this.style.setProperty('--concurrency', c);
})
});
(function() {
var s = window.getComputedStyle($(".day-timeline > li").get(0));
if (s.getPropertyValue('grid-column-start') != "auto") return;
// Fix Chrome not being able to use calc-division in grid
$(".day-calendar").each(function() {
var rasterSize = this.getAttribute("data-raster-size");
var duration = this.getAttribute("data-duration").split(":");
var cols = duration[0]*60/rasterSize + duration[1]/rasterSize;
$(".day-timeline", this).css("grid-template-columns", "repeat(" + cols + ", minmax(var(--col-min-size, 3em), 1fr))");
$(".day-timeline > li", this).each(function() {
var s = window.getComputedStyle(this);
var offset = this.getAttribute("data-offset").split(":");
var duration = this.getAttribute("data-duration").split(":");
var columnStart = 1 + offset[0]*60/rasterSize + offset[1]/rasterSize;
var columnSpan = duration[0]*60/rasterSize + duration[1]/rasterSize
this.style.gridColumn = columnStart + " / span " + columnSpan;
});
});
})();
$(".day-calendar").each(function() {
var timezone = this.getAttribute("data-timezone");
var startTime = moment.tz(this.getAttribute("data-start"), timezone);