mirrors/electron
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions 1

fix: Revert "feat: Corner Smoothing CSS rule" (#46231)

Browse source 
Revert "feat: Corner Smoothing CSS rule (#45185)"

This reverts commit b75e802280.
This commit is contained in:
Calvin 2025-03-24 13:36:49 -06:00 • committed by GitHub
parent cfd64b5f89
commit abaef13c0b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
26 changed files with 1 additions and 1313 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
spec/fixtures/api/corner-smoothing/shape/expected-false.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 163 KiB

BIN
spec/fixtures/api/corner-smoothing/shape/expected-true.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 167 KiB

BIN
spec/fixtures/api/corner-smoothing/shape/image.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 721 KiB

136
spec/fixtures/api/corner-smoothing/shape/test.html vendored
View file

@ -1,136 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<style>
/* Page is expected to be exactly 800x600 */
html, body {
width: 800px;
height: 600px;
margin: 0;
overflow: hidden;
display: flex;
flex-flow: column nowrap;
justify-content: space-around;
align-items: stretch;
}
.row {
display: flex;
flex-flow: row nowrap;
justify-content: space-around;
align-items: center;
}
.row.rounding-0 > .box {
-electron-corner-smoothing: 0%;
}
.row.rounding-30 > .box {
-electron-corner-smoothing: 30%;
}
.row.rounding-60 > .box {
-electron-corner-smoothing: 60%;
}
.row.rounding-100 > .box {
-electron-corner-smoothing: 100%;
}
.row.rounding-invalid > .box {
-electron-corner-smoothing: 200%;
}
.row.rounding-invalid > .box:nth-child(2) {
-electron-corner-smoothing: -10%;
}
.row.rounding-invalid > .box:nth-child(3) {
-electron-corner-smoothing: -200%;
}
.box {
--boxes-x: 7;
--boxes-y: 5;
--box-shadow-offset: 4px;
--box-shadow-spread: 2px;
--box-shadow-grow: 2px;
--box-gap: calc(var(--box-shadow-offset) + var(--box-shadow-spread) + var(--box-shadow-grow) + 4px);
--box-size: min(calc(((100vw - var(--box-gap)) / var(--boxes-x)) - var(--box-gap)), calc(((100vh - var(--box-gap)) / var(--boxes-y)) - var(--box-gap)));
width: var(--box-size);
height: var(--box-size);
border-radius: calc((var(--box-size) / 4) - 4px);
box-sizing: border-box;
background-color: black;
}
.box.outline {
background-color: bisque;
border: 8px solid black;
}
.box.outline.dashed {
background-color: darkkhaki;
border-style: dashed;
}
.box.outline.double {
background-color: darkseagreen;
border-style: double;
}
.box.outer {
overflow: clip;
}
.box.outer > .inner {
width: 100%;
height: 100%;
background-color: blueviolet;
}
.box.shadow {
background-color: skyblue;
box-shadow: var(--box-shadow-offset) var(--box-shadow-offset) var(--box-shadow-spread) var(--box-shadow-grow) cornflowerblue;
}
</style>
</head>
<body>
<div class="row rounding-0">
<div class="box"></div>
<img class="box" src="image.png" />
<div class="box outline"></div>
<div class="box outline dashed"></div>
<div class="box outline double"></div>
<div class="box outer"><div class="inner"></div></div>
<div class="box shadow"></div>
</div>
<div class="row rounding-30">
<div class="box"></div>
<img class="box" src="image.png" />
<div class="box outline"></div>
<div class="box outline dashed"></div>
<div class="box outline double"></div>
<div class="box outer"><div class="inner"></div></div>
<div class="box shadow"></div>
</div>
<div class="row rounding-60">
<div class="box"></div>
<img class="box" src="image.png" />
<div class="box outline"></div>
<div class="box outline dashed"></div>
<div class="box outline double"></div>
<div class="box outer"><div class="inner"></div></div>
<div class="box shadow"></div>
</div>
<div class="row rounding-100">
<div class="box"></div>
<img class="box" src="image.png" />
<div class="box outline"></div>
<div class="box outline dashed"></div>
<div class="box outline double"></div>
<div class="box outer"><div class="inner"></div></div>
<div class="box shadow"></div>
</div>
<div class="row rounding-invalid">
<div class="box"></div>
<img class="box" src="image.png" />
<div class="box outline"></div>
<div class="box outline dashed"></div>
<div class="box outline double"></div>
<div class="box outer"><div class="inner"></div></div>
<div class="box shadow"></div>
</div>
</body>
</html>

BIN
spec/fixtures/api/corner-smoothing/system-ui-keyword/expected-darwin.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9 KiB

BIN
spec/fixtures/api/corner-smoothing/system-ui-keyword/expected-linux.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 7.9 KiB

BIN
spec/fixtures/api/corner-smoothing/system-ui-keyword/expected-win32.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 7.9 KiB

42
spec/fixtures/api/corner-smoothing/system-ui-keyword/test.html vendored
View file

@ -1,42 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<style>
/* Page is expected to be exactly 800x600 */
html, body {
width: 800px;
height: 600px;
margin: 0;
overflow: hidden;
display: flex;
flex-flow: row nowrap;
justify-content: space-around;
align-items: center;
}
.box {
width: 256px;
height: 256px;
border-radius: 48px;
background-color: cornflowerblue;
}
.box.rounding-0 {
-electron-corner-smoothing: 0%;
}
.box.rounding-system-ui {
-electron-corner-smoothing: system-ui;
}
.box.rounding-100 {
-electron-corner-smoothing: 100%;
}
</style>
</head>
<body>
<div class="box rounding-0"></div>
<div class="box rounding-system-ui"></div>
<div class="box rounding-100"></div>
</body>
</html>