From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [IPv6:2a01:7e0:0:424::9]) by lore.proxmox.com (Postfix) with ESMTPS id 9FE8D1FF15E for ; Mon, 29 Sep 2025 16:25:10 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id AC53B14AD5; Mon, 29 Sep 2025 16:25:16 +0200 (CEST) From: Dominik Csapak To: yew-devel@lists.proxmox.com Date: Mon, 29 Sep 2025 16:24:37 +0200 Message-ID: <20250929142443.3460960-1-d.csapak@proxmox.com> X-Mailer: git-send-email 2.47.3 MIME-Version: 1.0 X-SPAM-LEVEL: Spam detection results: 0 AWL 0.027 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% DMARC_MISSING 0.1 Missing DMARC policy KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment RCVD_IN_VALIDITY_CERTIFIED_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. RCVD_IN_VALIDITY_RPBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. RCVD_IN_VALIDITY_SAFE_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to Validity was blocked. See https://knowledge.validity.com/hc/en-us/articles/20961730681243 for more information. SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [yew-devel] [PATCH proxmox-yew-widget-toolkit-assets] infinite progress bar: use purely transforms for the animation X-BeenThere: yew-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Yew framework devel list at Proxmox List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , Reply-To: Yew framework devel list at Proxmox Content-Type: text/plain; charset="us-ascii" Content-Transfer-Encoding: 7bit Errors-To: yew-devel-bounces@lists.proxmox.com Sender: "yew-devel" this has the advantage that it works even when the wasm/js code blocks the browser, the animation can still continue. When using `left`, that seemingly triggers a reflow/layout and can't be done until wasm/js is done. Visually there should be no difference. Signed-off-by: Dominik Csapak --- scss/_progress.scss | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/scss/_progress.scss b/scss/_progress.scss index a2da0ea..7f619d8 100644 --- a/scss/_progress.scss +++ b/scss/_progress.scss @@ -17,11 +17,11 @@ @keyframes infinite-progress { from { - left: 0; + transform: translateX(-40%) scaleX(0.2) ; } to { - left: calc(100% - 20%); + transform: translateX(40%) scaleX(0.2) ; } } @@ -29,8 +29,9 @@ position: absolute; top: 0; bottom: 0; - width: 20%; + width: 100%; left: 0; + transform: translateX(-40%) scaleX(0.2); background: var(--pwt-accent-color-background); animation-duration: 2s; animation-name: infinite-progress; -- 2.47.3 _______________________________________________ yew-devel mailing list yew-devel@lists.proxmox.com https://lists.proxmox.com/cgi-bin/mailman/listinfo/yew-devel