From 33fde3d4e756afb071b52a375c7f70d6c203ac53 Mon Sep 17 00:00:00 2001
From: lilia <liliakai@gmail.com>
Date: Thu, 18 Feb 2016 17:28:34 -0800
Subject: [PATCH] Dedupe modal styles

// FREEBIE
---
 background.html                      |  2 +-
 js/views/confirmation_dialog_view.js |  2 +-
 stylesheets/_conversation.scss       | 11 +-----
 stylesheets/manifest.css             | 59 ++++++++++++----------------
 4 files changed, 28 insertions(+), 46 deletions(-)

diff --git a/background.html b/background.html
index 96c3c2a50..3902e3582 100644
--- a/background.html
+++ b/background.html
@@ -75,7 +75,7 @@
     </div>
   </script>
   <script type='text/x-tmpl-mustache' id='confirmation-dialog'>
-    <div class="modal">
+    <div class="content">
       <div class='message'>{{ message }}</div>
       <div class='buttons'>
         <button class='cancel'>{{ cancel }}</button>
diff --git a/js/views/confirmation_dialog_view.js b/js/views/confirmation_dialog_view.js
index 7ffe97321..602c21aa0 100644
--- a/js/views/confirmation_dialog_view.js
+++ b/js/views/confirmation_dialog_view.js
@@ -6,7 +6,7 @@
     window.Whisper = window.Whisper || {};
 
     Whisper.ConfirmationDialogView = Whisper.View.extend({
-        className: 'confirmation-dialog',
+        className: 'confirmation-dialog modal',
         templateName: 'confirmation-dialog',
         initialize: function(options) {
             this.message = options.message;
diff --git a/stylesheets/_conversation.scss b/stylesheets/_conversation.scss
index 5f0f558cb..30a7302c1 100644
--- a/stylesheets/_conversation.scss
+++ b/stylesheets/_conversation.scss
@@ -601,16 +601,7 @@
 }
 
 .confirmation-dialog {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
-  padding: 0 20px;
-  z-index: 10;
-
-  .modal {
+  .content {
     max-width: 350px;
     margin: 100px auto;
     padding: 1em;
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index 63c26eb4f..a8fb9e182 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -1074,39 +1074,30 @@ input.search {
   border-radius: 20px;
   font-size: small; }
 
-.confirmation-dialog {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
-  padding: 0 20px;
-  z-index: 10; }
-  .confirmation-dialog .modal {
-    max-width: 350px;
-    margin: 100px auto;
-    padding: 1em;
-    background: white;
-    border-radius: 10px;
-    overflow: auto;
-    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
-    .confirmation-dialog .modal .message {
-      text-align: center; }
-    .confirmation-dialog .modal .buttons {
-      margin-top: 10px; }
-      .confirmation-dialog .modal .buttons button {
-        float: right;
-        margin-left: 10px;
-        background-color: #f3f3f3;
-        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; }
+.confirmation-dialog .content {
+  max-width: 350px;
+  margin: 100px auto;
+  padding: 1em;
+  background: white;
+  border-radius: 10px;
+  overflow: auto;
+  box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2); }
+  .confirmation-dialog .content .message {
+    text-align: center; }
+  .confirmation-dialog .content .buttons {
+    margin-top: 10px; }
+    .confirmation-dialog .content .buttons button {
+      float: right;
+      margin-left: 10px;
+      background-color: #f3f3f3;
+      border-radius: 5px;
+      outline: none;
+      padding: 5px 8px;
+      border: 1px solid #d9d9d9; }
+      .confirmation-dialog .content .buttons button:focus {
+        border-color: #8d8d8d; }
+      .confirmation-dialog .content .buttons button:hover {
+        background-color: #d9d9d9;
+        border-color: silver; }
 
 /*# sourceMappingURL=manifest.css.map */