tangled
alpha
login
or
join now
stream.place
/
streamplace
Live video on the AT Protocol
74
fork
atom
overview
issues
1
pulls
pipelines
add max width on not desktop
Natalie Bridgers
4 months ago
f5a4c2ec
03649849
+17
-4
1 changed file
expand all
collapse all
unified
split
js
components
src
components
ui
toast.tsx
+17
-4
js/components/src/components/ui/toast.tsx
···
351
351
const styles: ViewStyle = {
352
352
position: "absolute",
353
353
zIndex: 1000,
354
354
-
width: isDesktop ? 400 : "100%",
355
354
paddingHorizontal: isDesktop ? 0 : theme.spacing[4],
356
355
};
356
356
+
357
357
+
// Set width/maxWidth
358
358
+
if (isDesktop) {
359
359
+
styles.width = 400;
360
360
+
} else {
361
361
+
styles.width = "100%";
362
362
+
styles.maxWidth = 400;
363
363
+
}
357
364
358
365
if (resolvedPosition.includes("top")) {
359
366
styles.top = insets.top + theme.spacing[4];
···
370
377
styles.alignItems = "flex-end";
371
378
}
372
379
if (resolvedPosition.includes("center")) {
373
373
-
styles.left = 0;
374
374
-
styles.right = 0;
375
380
styles.alignItems = "center";
381
381
+
// Center the container itself when it has maxWidth
382
382
+
if (!isDesktop) {
383
383
+
styles.left = "50%";
384
384
+
styles.transform = [{ translateX: "-50%" }];
385
385
+
} else {
386
386
+
styles.left = 0;
387
387
+
styles.right = 0;
388
388
+
}
376
389
}
377
390
378
391
return styles;
···
790
803
justifyContent: "space-between",
791
804
alignItems: "center",
792
805
padding: theme.spacing[4],
793
793
-
width: isDesktop ? "100%" : "95%",
806
806
+
width: "100%",
794
807
},
795
808
variantStyles[variant],
796
809
]}