added stuff
This commit is contained in:
Jon Lambson
parent
439e58bb25
commit
10084b7eb9
119
css/styles.css
119
css/styles.css
|
|
@ -58,11 +58,12 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
.button-container.active .side-menu-button {
|
.button-container.active .side-menu-button {
|
||||||
background: steelblue;
|
color: #fff;
|
||||||
color: white;
|
background-color: #286090;
|
||||||
|
border-color: #122b40;
|
||||||
}
|
}
|
||||||
.button-container.active .button-title {
|
.button-container.active .button-title {
|
||||||
color: steelblue;
|
color: #286090;
|
||||||
}
|
}
|
||||||
.button-container a:hover {
|
.button-container a:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -148,3 +149,115 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: #e5e5e5;
|
background-color: #e5e5e5;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.demo-title {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 3rem;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
}
|
||||||
|
.invite-option {
|
||||||
|
border: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
.invite-card-container {
|
||||||
|
display: table;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option {
|
||||||
|
width: 28%;
|
||||||
|
background: white;
|
||||||
|
float: left;
|
||||||
|
padding: 2%;
|
||||||
|
text-align: center;
|
||||||
|
-webkit-transition: all .3s ease-in-out;
|
||||||
|
transition: all .3s ease-in-out;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:nth-child(even) {
|
||||||
|
margin: 0 2%;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.3);
|
||||||
|
-webkit-transform: scale(1.04);
|
||||||
|
transform: scale(1.04);
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:hover i, .invite-card-container .invite-option:hover h1, .invite-card-container .invite-option:hover span, .invite-card-container .invite-option:hover b {
|
||||||
|
color: #286090;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:hover .front {
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:hover .back {
|
||||||
|
opacity: 1 !important;
|
||||||
|
visibility: visible !important;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option:hover .back a.button {
|
||||||
|
-webkit-transform: translateY(0px) !important;
|
||||||
|
transform: translateY(0px) !important;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option hr {
|
||||||
|
border: none;
|
||||||
|
border-bottom: 1px solid #F0F0F0;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option i {
|
||||||
|
font-size: 3rem;
|
||||||
|
color: #D8D8D8;
|
||||||
|
-webkit-transition: all .3s ease-in-out;
|
||||||
|
transition: all .3s ease-in-out;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option h1 {
|
||||||
|
margin: 10px 0;
|
||||||
|
color: #212121;
|
||||||
|
-webkit-transition: all .3s ease-in-out;
|
||||||
|
transition: all .3s ease-in-out;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option p {
|
||||||
|
color: #999;
|
||||||
|
padding: 0 10px;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price .front span.price {
|
||||||
|
font-size: 2rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin-top: 20px;
|
||||||
|
display: block;
|
||||||
|
font-weight: 700;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price .front span.price b {
|
||||||
|
position: absolute;
|
||||||
|
font-size: 1rem;
|
||||||
|
margin-left: 2px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price .back {
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
-webkit-transition: all .3s ease-in-out;
|
||||||
|
transition: all .3s ease-in-out;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price .back a.button {
|
||||||
|
background: #286090;
|
||||||
|
padding: 15px 20px;
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
color: white;
|
||||||
|
position: absolute;
|
||||||
|
font-size: 13px;
|
||||||
|
top: -5px;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 150px;
|
||||||
|
margin: auto;
|
||||||
|
text-transform: uppercase;
|
||||||
|
-webkit-transform: translateY(20px);
|
||||||
|
transform: translateY(20px);
|
||||||
|
-webkit-transition: all .3s ease-in-out;
|
||||||
|
transition: all .3s ease-in-out;
|
||||||
|
}
|
||||||
|
.invite-card-container .invite-option .price .back a.button:hover {
|
||||||
|
background: #286090;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
<h4 class="text-center">Sign in</h4>
|
<h4 class="text-center">Sign in</h4>
|
||||||
<a href="#!/home" class="current-user-container" ng-repeat="profile in vm.Auth.sessions track by $index" ng-click="vm.selectSession(profile);">
|
<a href="#!/home" class="current-user-container" ng-repeat="profile in vm.Auth.sessions track by $index" ng-click="vm.selectSession(profile);">
|
||||||
<div class="current-user-split"><i class="fa fa-user"></i></div>
|
<div class="current-user-split"><i class="fa fa-user"></i></div>
|
||||||
<div class="current-user-text">Resume with {{ profile.email }}</div>
|
<div class="current-user-text">Resume with {{ profile.email }} | {{ profile.issuer }}</div>
|
||||||
</a>
|
</a>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label for="dap-address">Address</label>
|
<label for="dap-address">Address</label>
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,131 @@
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<h1>Create a new Website</h1>
|
||||||
|
<button class="btn btn-primary btn-lg" title="..." data-toggle="modal" data-target=".create-website-modal">
|
||||||
|
Create Website
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="modal fade create-website-modal" tabindex="-1" role="dialog" aria-labelledby="create-website-modal" aria-hidden="true">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
|
||||||
|
<h4 class="modal-title">Create a new Website</h4>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<h4>Select a domain</h4>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<div angucomplete-alt
|
||||||
|
placeholder="Select a domain"
|
||||||
|
pause="300"
|
||||||
|
selected-object="vm.selectedDomain"
|
||||||
|
local-data="domain"
|
||||||
|
local-search="localDomainSearch"
|
||||||
|
title-field="domain"
|
||||||
|
minlength="0"
|
||||||
|
input-class="form-control trigger-dropdown"
|
||||||
|
match-class="highlight">
|
||||||
|
</div>
|
||||||
|
<!-- <input type="text" class="form-control" placeholder="Select a domain" aria-label="Domain Name" ng-model="vm.newDomain" ng-change="vm.setDomain()" /> -->
|
||||||
|
<div class="input-group-btn">
|
||||||
|
<div class="btn-group">
|
||||||
|
<button type="button" class="btn btn-default trigger-dropdown" aria-haspopup="true" aria-expanded="false" ng-click="vm.triggerDropdown()"><span class="caret"></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<input type="text" class="form-control" placeholder="www" ng-model="vm.newRecord" ng-change="vm.setRecord()" />
|
||||||
|
<div class="input-group-btn">
|
||||||
|
<div class="btn-group">
|
||||||
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="caret"></span>
|
||||||
|
</button>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li ng-repeat="record in vm.records track by $index"><button class="btn btn-link" ng-bind="record.sub" ng-click="vm.selectRecord(record)">www</button></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group">
|
||||||
|
<div>
|
||||||
|
<label>Select .zip upload</label>
|
||||||
|
<input type="file" class="js-file-upload this-has-a-special-non-angular-event-handler" />
|
||||||
|
</div>
|
||||||
|
<div ng-if="vm.isZip" >
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" ng-model="vm.unzip" />
|
||||||
|
Unpack .zip
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div ng-if="vm.unzip" >
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" ng-model="vm.stripZip" />
|
||||||
|
Strip zip directory root
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<!-- <div ng-if="vm.isZip" ><label>Unzip directory</label> <input type="text" ng-model="vm.unzipPath" /></div -->
|
||||||
|
<div ng-if="vm.uploadTotal">
|
||||||
|
<span ng-bind="vm.uploadPercent">99</span>% | <span ng-bind="vm.uploadProgress">1</span> MiB / <span ng-bind="vm.uploadTotal">100</span> MiB
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label>Web path</label>
|
||||||
|
<input type="text" class="form-control" ng-model="vm.uploadPath" />
|
||||||
|
</div>
|
||||||
|
<button ng-click="vm.Sites.create()" type="button" name="button" class="btn btn-default">Create Website</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="invite-card-container">
|
||||||
|
<div class="invite-option">
|
||||||
|
<h1>Invite Code</h1>
|
||||||
|
<hr />
|
||||||
|
<input type="text" class="form-control" ng-model="vm.Shares.inviteToken" />
|
||||||
|
<hr />
|
||||||
|
<div class="price">
|
||||||
|
<div class="front">
|
||||||
|
<span class="price"> </span>
|
||||||
|
</div>
|
||||||
|
<div class="back">
|
||||||
|
<a class="button" ng-click="vm.Shares.accept()">Accept Invite</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="invite-card-container">
|
||||||
|
<h1>Your Websites</h1>
|
||||||
|
<div class="invite-option" ng-repeat="r in vm.sites">
|
||||||
|
<h3><a ng-href="https://{{r.domain}}" target="_blank" ng-bind="r.domain">example.com</a></h3>
|
||||||
|
<hr />
|
||||||
|
<hr />
|
||||||
|
<div class="">
|
||||||
|
<div class="">
|
||||||
|
<a ng-href="{{r.download}}" class="btn btn-default" target="_blank"><i class="fa fa-download"></i> Download</a>
|
||||||
|
</div>
|
||||||
|
<div class="">
|
||||||
|
<button type="button" name="button" class="btn btn-danger" ng-click="vm.Sites.remove(r)"><i class="fa fa-trash"></i> Clear</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.panel{
|
.panel{
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue