Change the screenshots section to be a single screenshot with clickable sections
This commit is contained in:
parent
cfcbc44c72
commit
2d18117e68
3 changed files with 83 additions and 28 deletions
|
@ -109,39 +109,44 @@
|
|||
</div> <!-- -->
|
||||
|
||||
<div class="landing-section">
|
||||
<h2>Business-class management tools</h2>
|
||||
<h2>Built with our users in mind</h2>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/user-home.png" class="img-responsive">
|
||||
<a href="">Customized for you</a>
|
||||
<div class="col-lg-8 feature-shoutout">
|
||||
<img id="screenshot" ng-src="{{ '/static/img/' + currentScreenshot + '.png' }}" class="img-responsive">
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-view' ? 'active' : ''" ng-click="changeScreenshot('repo-view')">
|
||||
<i class="fa fa-hdd-o"></i>
|
||||
<span class="sf-title">Beautiful repository view</span>
|
||||
<div class="sf-text">
|
||||
Repository is presented with the maximum amount of useful information, including a visual tree of its image history, markdown-based description, and tags.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/repo-view.png" class="img-responsive">
|
||||
<a href="">Detailed repository information</a>
|
||||
</div>
|
||||
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-admin' ? 'active' : ''" ng-click="changeScreenshot('repo-admin')">
|
||||
<i class="fa fa-group"></i>
|
||||
<span class="sf-title">Share at your control</span>
|
||||
<div class="sf-text">
|
||||
Set up the exact permissions your team, organization or business needs. Need to grant external access? Create one or more robot accounts to restrict access.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/build-history.png" class="img-responsive">
|
||||
<a href="">Dockerfile build in the cloud</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="screenshot-feature" ng-class="currentScreenshot == 'build-history' ? 'active' : ''" ng-click="changeScreenshot('build-history')">
|
||||
<i class="fa fa-tasks"></i>
|
||||
<span class="sf-title">Dockerfile Build</span>
|
||||
<div class="sf-text">
|
||||
Repositories can be linked to Github repositories, with automatic building of the Dockerfile(s) found on push.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/repo-admin.png" class="img-responsive">
|
||||
<a href="">Fine grain permissions model</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/repo-changes.png" class="img-responsive">
|
||||
<a href="">Docker diff visualized</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 feature-shoutout">
|
||||
<img src="/static/img/org-repo-list.png" class="img-responsive">
|
||||
<a href="">Organizations and Teams</a>
|
||||
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-changes' ? 'active' : ''" ng-click="changeScreenshot('repo-changes')">
|
||||
<i class="fa fa-code-fork"></i>
|
||||
<span class="sf-title">Repository Diff</span>
|
||||
<div class="sf-text">
|
||||
See exactly which files were added, changed, or removed for each image in a repository.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Reference in a new issue