Revert preview border to 1px and fix exact size of preview on different devices

This commit is contained in:
Andrew Kingston 2021-09-08 09:51:08 +01:00
parent c5cd2fb64a
commit 914548de0c
1 changed files with 6 additions and 5 deletions

View File

@ -187,19 +187,20 @@
} }
/* Preview styles */ /* Preview styles */
/* The additional 6px of size is to account for 4px padding and 2px border */
#device-root.preview { #device-root.preview {
padding: 2px; padding: 2px;
} }
#device-root.tablet-preview { #device-root.tablet-preview {
width: calc(1024px + 8px); width: calc(1024px + 6px);
height: calc(768px + 8px); height: calc(768px + 6px);
} }
#device-root.mobile-preview { #device-root.mobile-preview {
width: calc(390px + 8px); width: calc(390px + 6px);
height: calc(844px + 8px); height: calc(844px + 6px);
} }
.preview #app-root { .preview #app-root {
border: 2px solid var(--spectrum-global-color-gray-300); border: 1px solid var(--spectrum-global-color-gray-300);
border-radius: 4px; border-radius: 4px;
} }
</style> </style>