passepartout-apple/screenshots/html/style.css
Davide 76a570b7b3
Autogenerate framed screenshots from HTML/CSS (#1000)
Add TV screenshots and organize PassepartoutUITests with two test plans
for generating iOS/macOS (Main) and tvOS (TV) screenshots. Revert to the
.attachment destination and use `xcparse` to export the screenshots.
Change iPad screenshots to portrait.

Then autogenerate framed screenshots in two steps:

- Export the UITests screenshots per device (`export.sh`)
- Embed the results in a HTML/CSS template and take snapshots with
Chrome headless (`compose.sh`)
- Repeat for all devices (iPhone, iPad, Mac and Apple TV)
- Save framed screenshots to the `fastlane` screenshots directory
2024-12-11 20:33:58 +01:00

87 lines
1.1 KiB
CSS

* {
margin: 0;
padding: 0;
}
body {
font-family: "Ubuntu", sans-serif;
font-size: 100px;
}
#background {
position: absolute;
background-color: #515d71;
overflow: hidden;
}
header {
height: 10em;
}
header p {
position: relative;
top: 50%;
transform: translateY(-50%);
color: #fff;
text-align: center;
line-height: 1.7em;
}
em {
color: #d69c68;
font-style: normal;
}
main {
position: relative;
}
#box {
position: absolute;
background-color: #d69c68;
width: 250%;
height: 150%;
transform: rotate(45deg);
}
.container {
display: none;
}
.screenshot {
position: relative;
left: 50%;
transform: translateX(-50%);
display: none;
}
.frame {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.heading {
display: none;
}
.screen-01 .heading:nth-of-type(1) {
display: block;
}
.screen-02 .heading:nth-of-type(2) {
display: block;
}
.screen-03 .heading:nth-of-type(3) {
display: block;
}
.screen-04 .heading:nth-of-type(4) {
display: block;
}
.screen-05 .heading:nth-of-type(5) {
display: block;
}