From 3c98ae556b955175906c2640f44cb0f3512e90ea Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:23:10 -0400 Subject: Smarter upscaling/downscaling By default it used to make all images pixelated. --- webAO/styles/default.css | 14 ++++++++++++++ 1 file changed, 14 insertions(+) (limited to 'webAO/styles') diff --git a/webAO/styles/default.css b/webAO/styles/default.css index 5e941e0..8a090cb 100644 --- a/webAO/styles/default.css +++ b/webAO/styles/default.css @@ -2,11 +2,25 @@ body { font-family: sans-serif; } +@media (max-height: 270x) { + img { + image-rendering: crisp-edges; + image-rendering: pixelated; + } + +} + img { + image-rendering: auto; +} + +img[src$=".gif"], +img[src$=".apng"] { image-rendering: crisp-edges; image-rendering: pixelated; } + .client_button { margin: 1px; padding: 2px 15px; -- cgit From c959f01c93ca6e106f1ce4426a098c8205873961 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:33:40 -0400 Subject: Make the web client UI behave more like AO2 client Fix: background scaling #92 Changes: Now every image on the viewport is centered in the X and Y. --- webAO/styles/client.css | 37 +++++++++++++++++++++++++++---------- 1 file changed, 27 insertions(+), 10 deletions(-) (limited to 'webAO/styles') diff --git a/webAO/styles/client.css b/webAO/styles/client.css index 9671a9a..cdf9ab3 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -206,9 +206,11 @@ #client_court_static { position: absolute; height: 100%; - width: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_court { @@ -216,6 +218,9 @@ height: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_stitch_court { @@ -229,8 +234,10 @@ #client_stitch_court>img { position: absolute; height: 100%; - width: 100%; bottom: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_court_classic { @@ -238,10 +245,13 @@ height: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } .def_court { - object-position: left; + object-position: center; } .wit_court { @@ -249,7 +259,7 @@ } .pro_court { - object-position: right; + object-position: center; } #client_fullview { @@ -275,16 +285,20 @@ bottom: 0; } + .client_char>img { position: absolute; height: 100%; - width: 100%; bottom: 0; left: 0; - object-fit: cover; - object-position: 50% 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + #client_bench_classic { left: 0; } @@ -311,17 +325,20 @@ .client_bench { position: absolute; - height: auto; - width: 100%; + height: 100%; + width: 1; bottom: 0; + object-fit: contain; } #client_fg { position: absolute; height: 100%; - width: 100%; bottom: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_evi { -- cgit From e44929a7d1db3e2eb7186060d93bbcdf66591876 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 12:26:28 -0400 Subject: Reverted some bugs caused by experimenting Now is stable --- webAO/styles/client.css | 20 +++----------------- 1 file changed, 3 insertions(+), 17 deletions(-) (limited to 'webAO/styles') diff --git a/webAO/styles/client.css b/webAO/styles/client.css index cdf9ab3..7d3438b 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -206,11 +206,9 @@ #client_court_static { position: absolute; height: 100%; + width: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_court { @@ -218,9 +216,6 @@ height: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_stitch_court { @@ -234,10 +229,8 @@ #client_stitch_court>img { position: absolute; height: 100%; + width: 100%; bottom: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_court_classic { @@ -245,9 +238,6 @@ height: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } .def_court { @@ -285,7 +275,6 @@ bottom: 0; } - .client_char>img { position: absolute; height: 100%; @@ -297,8 +286,6 @@ } - - #client_bench_classic { left: 0; } @@ -326,7 +313,6 @@ .client_bench { position: absolute; height: 100%; - width: 1; bottom: 0; object-fit: contain; } @@ -742,4 +728,4 @@ .hrtext:after { left: 0.5em; margin-right: -50%; -} +} \ No newline at end of file -- cgit From f126caa2931b4ca8e41364d23d48e4406e146362 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 12:33:16 -0400 Subject: Remove old "left" field --- webAO/styles/client.css | 1 - 1 file changed, 1 deletion(-) (limited to 'webAO/styles') diff --git a/webAO/styles/client.css b/webAO/styles/client.css index 7d3438b..702766e 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -279,7 +279,6 @@ position: absolute; height: 100%; bottom: 0; - left: 0; top: 50%; left: 50%; transform: translate(-50%, -50%); -- cgit