docs: image gallery viewer (#905)

* add assets, photoswipe html element to body

* add single script, gallery for multiple items

* update docs for image gallery

* fix relative links

* inject image script on mount

* replace inline script

* remove facebook, twitter, pinterest sharing

* fix hover on share

* fix start img aspect radio, reduce size

* right align json script

* right align go script

* change script background
This commit is contained in:
Max Peintner
2020-10-26 13:03:51 +01:00
committed by GitHub
parent 524a6d4467
commit 22d4c345be
28 changed files with 1181 additions and 51 deletions

View File

@@ -22,14 +22,23 @@ title: User Manual
### Login User
<img src="img/accounts_page.png" alt="Login Username" width="1000px" height="auto">
Image: Login Username
<img src="img/accounts_password.png" alt="Login Password" width="1000px" height="auto">
Image: Login Password
<img src="img/accounts_otp_verify.png" alt="Login OTP" width="1000px" height="auto">
Image: Login OTP
<div class="zitadel-gallery" itemscope itemtype="http://schema.org/ImageGallery">
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<a href="img/accounts_page.png" itemprop="contentUrl" data-size="1920x1080">
<img src="img/accounts_page.png" itemprop="thumbnail" alt="Login Username" />
</a>
<figcaption itemprop="caption description">Login Username</figcaption>
</figure>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<a href="img/accounts_password.png" itemprop="contentUrl" data-size="1920x1080">
<img src="img/accounts_password.png" itemprop="thumbnail" alt="Login Password" />
</a>
<figcaption itemprop="caption description">Login Password</figcaption>
</figure>
<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<a href="img/accounts_otp_verify.png" itemprop="contentUrl" data-size="1920x1080">
<img src="img/accounts_otp_verify.png" itemprop="thumbnail" alt="Login OTP" />
</a>
<figcaption itemprop="caption description">Login OTP</figcaption>
</figure>
</div>