added stuff

This commit is contained in:
Jon Lambson 2017-09-06 14:17:42 -06:00
parent 439e58bb25
commit 10084b7eb9
3 changed files with 245 additions and 4 deletions

View File

@ -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;
}

View File

@ -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>

View File

@ -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">&nbsp;</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;