thegamer/Cable-Desktop
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Dedupe modal styles

Browse source 
// FREEBIE
This commit is contained in:
lilia 2016-02-18 17:28:34 -08:00
parent bb681526dc
commit 33fde3d4e7
4 changed files with 28 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
background.html
View file

@ -75,7 +75,7 @@
</div> </div>
</script> </script>
<script type='text/x-tmpl-mustache' id='confirmation-dialog'> <script type='text/x-tmpl-mustache' id='confirmation-dialog'>
<div class="modal"> <div class="content">
<div class='message'>{{ message }}</div> <div class='message'>{{ message }}</div>
<div class='buttons'> <div class='buttons'>
<button class='cancel'>{{ cancel }}</button> <button class='cancel'>{{ cancel }}</button>

2
js/views/confirmation_dialog_view.js
View file

@ -6,7 +6,7 @@
window.Whisper = window.Whisper || {}; window.Whisper = window.Whisper || {};
Whisper.ConfirmationDialogView = Whisper.View.extend({ Whisper.ConfirmationDialogView = Whisper.View.extend({
className: 'confirmation-dialog', className: 'confirmation-dialog modal',
templateName: 'confirmation-dialog', templateName: 'confirmation-dialog',
initialize: function(options) { initialize: function(options) {
this.message = options.message; this.message = options.message;

11
stylesheets/_conversation.scss
View file

@ -601,16 +601,7 @@
} }
.confirmation-dialog { .confirmation-dialog {
position: absolute; .content {
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.3);
padding: 0 20px;
z-index: 10;
.modal {
max-width: 350px; max-width: 350px;
margin: 100px auto; margin: 100px auto;
padding: 1em; padding: 1em;

59
stylesheets/manifest.css
View file

@ -1074,39 +1074,30 @@ input.search {
border-radius: 20px; border-radius: 20px;
font-size: small; } font-size: small; }
.confirmation-dialog { .confirmation-dialog .content {
position: absolute; max-width: 350px;
top: 0; margin: 100px auto;
left: 0; padding: 1em;
height: 100%; background: white;
width: 100%; border-radius: 10px;
background-color: rgba(0, 0, 0, 0.3); overflow: auto;
padding: 0 20px; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
z-index: 10; } .confirmation-dialog .content .message {
.confirmation-dialog .modal { text-align: center; }
max-width: 350px; .confirmation-dialog .content .buttons {
margin: 100px auto; margin-top: 10px; }
padding: 1em; .confirmation-dialog .content .buttons button {
background: white; float: right;
border-radius: 10px; margin-left: 10px;
overflow: auto; background-color: #f3f3f3;
box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); } border-radius: 5px;
.confirmation-dialog .modal .message { outline: none;
text-align: center; } padding: 5px 8px;
.confirmation-dialog .modal .buttons { border: 1px solid #d9d9d9; }
margin-top: 10px; } .confirmation-dialog .content .buttons button:focus {
.confirmation-dialog .modal .buttons button { border-color: #8d8d8d; }
float: right; .confirmation-dialog .content .buttons button:hover {
margin-left: 10px; background-color: #d9d9d9;
background-color: #f3f3f3; border-color: silver; }
border-radius: 5px;
outline: none;
padding: 5px 8px;
border: 1px solid #d9d9d9; }
.confirmation-dialog .modal .buttons button:focus {
border-color: #8d8d8d; }
.confirmation-dialog .modal .buttons button:hover {
background-color: #d9d9d9;
border-color: silver; }
/*# sourceMappingURL=manifest.css.map */ /*# sourceMappingURL=manifest.css.map */