docs: update screenshots
Summary: Updating screenshots adding screenshot slideshow to landing page Reviewed By: passy Differential Revision: D15164431 fbshipit-source-id: a7201f59205593e38b48bce87cacdb58e9b2b180
BIN
docs/assets/crashreporterplugin.png
Normal file → Executable file
|
Before Width: | Height: | Size: 232 KiB After Width: | Height: | Size: 241 KiB |
BIN
docs/assets/crashreporterpluginnotification.png
Normal file → Executable file
|
Before Width: | Height: | Size: 113 KiB After Width: | Height: | Size: 32 KiB |
BIN
docs/assets/initial.png
Normal file → Executable file
|
Before Width: | Height: | Size: 206 KiB After Width: | Height: | Size: 216 KiB |
BIN
docs/assets/layout.png
Normal file → Executable file
|
Before Width: | Height: | Size: 524 KiB After Width: | Height: | Size: 176 KiB |
BIN
docs/assets/logs.png
Normal file → Executable file
|
Before Width: | Height: | Size: 298 KiB After Width: | Height: | Size: 201 KiB |
BIN
docs/assets/network.png
Normal file → Executable file
|
Before Width: | Height: | Size: 616 KiB After Width: | Height: | Size: 188 KiB |
BIN
docs/assets/plugins.png
Normal file → Executable file
|
Before Width: | Height: | Size: 1.9 MiB After Width: | Height: | Size: 412 KiB |
|
Before Width: | Height: | Size: 71 KiB After Width: | Height: | Size: 102 KiB |
BIN
docs/assets/shared-preferences.png
Normal file → Executable file
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 132 KiB |
@@ -30,11 +30,15 @@ class Index extends React.Component {
|
||||
Learn more
|
||||
</a>
|
||||
</div>
|
||||
<img
|
||||
src="/img/splash.png"
|
||||
srcSet="/img/splash.png 1x, /img/splash@2x.png 2x"
|
||||
className="splashScreen"
|
||||
/>
|
||||
<div className="slideshow">
|
||||
<img src="/docs/assets/logs.png" className="splashScreen" />
|
||||
<img src="/docs/assets/layout.png" className="splashScreen" />
|
||||
<img src="/docs/assets/network.png" className="splashScreen" />
|
||||
<img
|
||||
src="/docs/assets/crashreporterplugin.png"
|
||||
className="splashScreen"
|
||||
/>
|
||||
</div>
|
||||
<div className="shadow" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -85,14 +85,66 @@ h6 {
|
||||
}
|
||||
}
|
||||
|
||||
.splashScreen {
|
||||
width: 100%;
|
||||
.slideshow {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 100%;
|
||||
animation: 0.6s ease-out 0.2s 1 slideIn forwards;
|
||||
width: 1116px;
|
||||
max-width: 100%;
|
||||
width: 1116px;
|
||||
}
|
||||
|
||||
.splashScreen {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
max-width: 100%;
|
||||
width: 1116px;
|
||||
}
|
||||
|
||||
@keyframes slideshow2 {
|
||||
20%,
|
||||
55% {
|
||||
opacity: 0;
|
||||
}
|
||||
25%,
|
||||
50% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes slideshow3 {
|
||||
45%,
|
||||
80% {
|
||||
opacity: 0;
|
||||
}
|
||||
50%,
|
||||
75% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes slideshow4 {
|
||||
65%,
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
70%,
|
||||
95% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.slideshow .splashScreen:nth-child(1) {
|
||||
opacity: 1;
|
||||
}
|
||||
.slideshow .splashScreen:nth-child(2) {
|
||||
animation: 16s slideshow2 infinite;
|
||||
}
|
||||
.slideshow .splashScreen:nth-child(3) {
|
||||
animation: 16s slideshow3 infinite;
|
||||
}
|
||||
.slideshow .splashScreen:nth-child(4) {
|
||||
animation: 16s slideshow4 infinite;
|
||||
}
|
||||
|
||||
.content {
|
||||
|
||||