Cleaned up modal dialogs

This commit is contained in:
Victoria Wang 2014-10-28 11:22:45 -07:00
parent 6122a188b6
commit dde3ce4abc
9 changed files with 55 additions and 27 deletions

View file

@ -28,6 +28,11 @@
}
&:visited{color:$c-Lighter;}
&.cancel {
background: #999;
text-shadow: none;
}
}
@ -78,7 +83,6 @@
&:hover{
@include linear-gradient(top, #d51c3a, #841526);
}
.fa {
margin-right:5px;
}

View file

@ -62,3 +62,31 @@ a{
.alert{
background-color:#F5BA00; color:#fff;
}
.modal {
&.fade.in {
top: 20%;
}
form {
margin-bottom: 0;
}
@include border-radius(20px 20px 6px 6px);
}
.modal-header {
background: #5e95a1;
padding: 12px 16px 9px 23px;
@include border-radius(6px 6px 0px 0px);
h3 {
color: white;
font-size: 1.6em;
}
}
.modal-body {
padding: 20px 23px 0 23px;
}
.modal-footer {
border: 0;
background: none;
padding: 0 23px 19px 0;
}

View file

@ -321,7 +321,7 @@
display: block;
margin-left: 5px;
}
.overlay .fa-trash {
.overlay .fa-trash, .modal .fa-trash {
vertical-align: 1px;
}
.overlay {

View file

@ -21,18 +21,17 @@
<form method="POST" action="/tags/add">
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="addTagLabel">Add a Tag</h3>
</div>
<div class="modal-body">
<p>
A tag can only be a single word, and can only contain letters and numbers.
</p>
<p>Tag:</p>
<input type="text" name="tags" class="typeahead">
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Add Tag</button>
</div>
</form>
@ -42,7 +41,7 @@
<form method="POST" action="/tags/remove">
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="removeTagLabel">Remove Tags</h3>
</div>
<div class="modal-body">
@ -55,7 +54,7 @@
<% end %>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Remove Tag(s)</button>
</div>
</form>

View file

@ -170,15 +170,15 @@
<div class="modal hide fade" id="deleteConfirmModal" tabindex="-1" role="dialog" aria-labelledby="deleteConfirmModalLabel" aria-hidden="true">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="deleteConfirmModalLabel">Confirm deletion</h3>
</div>
<div class="modal-body">
<p>You are about to delete "<span id="deleteFileName"></span>". Are you sure?</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn btn-danger" onclick="fileDelete()">Delete</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn btn-Action btn-danger" onclick="fileDelete()"><i class="fa fa-trash" title="Delete"></i>Delete</button>
</div>
</div>
@ -255,18 +255,15 @@
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<input type="hidden" value="<%= @dir %>" name="dir">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="createDirLabel">Create Folder</h3>
</div>
<div class="modal-body">
<p>
Folder name:
</p>
<input name="name" type="text" placeholder="images">
<input name="name" type="text" placeholder="folder_name">
</div>
<div class="modal-footer">
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Create</button>
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
</div>
</form>
</div>

View file

@ -364,7 +364,7 @@
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<input type="hidden" value="" name="plan_type" id="upgradePlanType">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="planSignupLabel">
<% if parent_site && parent_site.plan_type == 'free' %>
Upgrade
@ -422,7 +422,7 @@
<% end %>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Upgrade</button>
</div>
</form>

View file

@ -62,7 +62,7 @@
<form method="POST" action="/site/delete">
<%== csrf_token_input_html %>
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="deleteSiteLabel">Permanently Delete Site</h3>
</div>
<div class="modal-body">
@ -73,7 +73,7 @@
<input class="input-Area" name="username" type="text">
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Permanently Delete Site</button>
</div>
</form>

View file

@ -62,7 +62,7 @@
<form method="POST" action="/site/delete">
<%== csrf_token_input_html %>
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="deleteSiteLabel">Permanently Delete Site</h3>
</div>
<div class="modal-body">
@ -73,7 +73,7 @@
<input class="input-Area" name="username" type="text">
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Permanently Delete Site</button>
</div>
</form>

View file

@ -133,7 +133,7 @@
<form method="POST" action="/site/<%= site.username %>/report">
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="reportLabel">Report Site</h3>
</div>
<div class="modal-body">
@ -149,10 +149,10 @@
</select>
</p>
<p>Comments:</p>
<textarea name="comments" type="text" style="width: 400px"></textarea>
<textarea name="comments" type="text" style="width: 400px; margin-bottom: 20px;"></textarea>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Report</button>
</div>
</form>
@ -162,7 +162,7 @@
<form method="POST" action="/site/<%= site.username %>/block">
<input type="hidden" value="<%= csrf_token %>" name="csrf_token">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">x</button>
<button class="close" type="button" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
<h3 id="blockLabel">Block Site</h3>
</div>
<div class="modal-body">
@ -178,7 +178,7 @@
<p>Are you sure you want to do this?</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button type="submit" class="btn btn-Action">Block Site</button>
</div>
</form>