Skip to content

Commit 293cdc1

Browse files
fix(ui): safari css rendering issues with table and folder cards (#12531)
1 parent 06fbc07 commit 293cdc1

File tree

2 files changed

+33
-11
lines changed

2 files changed

+33
-11
lines changed

packages/ui/src/elements/FolderView/FolderFileCard/index.scss

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -134,13 +134,22 @@
134134
grid-area: preview;
135135
aspect-ratio: 1/1;
136136
background-color: var(--card-preview-bg-color);
137-
border-top-left-radius: inherit;
138-
border-top-right-radius: inherit;
137+
border-top-left-radius: var(--style-radius-s);
138+
border-top-right-radius: var(--style-radius-s);
139139
border-bottom: 1px solid var(--card-border-color);
140140
display: grid;
141141
align-items: center;
142142
justify-content: center;
143143
pointer-events: none;
144+
grid-template-columns: auto 50% auto;
145+
146+
&:has(.thumbnail) {
147+
grid-template-columns: unset;
148+
}
149+
150+
> .icon {
151+
grid-column: 2;
152+
}
144153

145154
.icon--document {
146155
pointer-events: none;
@@ -153,6 +162,19 @@
153162
.thumbnail {
154163
width: 100%;
155164
height: 100%;
165+
position: relative;
166+
border-radius: inherit;
167+
> img {
168+
position: absolute;
169+
top: 0;
170+
left: 0;
171+
bottom: 0;
172+
right: 0;
173+
width: 100%;
174+
height: 100%;
175+
object-fit: cover;
176+
border-radius: inherit;
177+
}
156178
}
157179

158180
&:has(.thumbnail) {

packages/ui/src/elements/Table/index.scss

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -43,15 +43,15 @@
4343
tr {
4444
position: relative;
4545
&:nth-child(odd) {
46-
&:after {
47-
content: '';
48-
position: absolute;
49-
left: 0;
50-
top: 0;
51-
width: 100%;
52-
background: var(--theme-elevation-50);
53-
height: 100%;
54-
border-radius: var(--style-radius-s);
46+
background: var(--theme-elevation-50);
47+
border-radius: var(--style-radius-s);
48+
td:first-child {
49+
border-top-left-radius: inherit;
50+
border-bottom-left-radius: inherit;
51+
}
52+
td:last-child {
53+
border-top-right-radius: inherit;
54+
border-bottom-right-radius: inherit;
5555
}
5656
}
5757
}

0 commit comments

Comments
 (0)