From 49fa981f9f4de0b476af5e151868c9e3276d83b3 Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Sat, 14 Feb 2015 15:06:29 -0500
Subject: [PATCH] CRM-15705 - Style mailing submit button

---
 css/angular-crmMailing.css           | 58 +++++++++-------------------
 partials/crmMailing/edit-wizard.html |  2 +-
 partials/crmMailing/edit.html        |  2 +-
 partials/crmMailingAB/edit.html      |  2 +-
 4 files changed, 22 insertions(+), 42 deletions(-)

diff --git a/css/angular-crmMailing.css b/css/angular-crmMailing.css
index 1d2a065b8a..d5536a58e2 100644
--- a/css/angular-crmMailing.css
+++ b/css/angular-crmMailing.css
@@ -72,45 +72,25 @@ input[name=preview_test_email]:-ms-input-placeholder {
 .crmMailing-inactive {
   text-decoration: line-through;
 }
-a.crmMailing-submit-button div {
-  color: black;
-  background: #bfb;
-  border: 1px solid #8a8;
-  padding: 1em;
-  margin: 1em;
-  width: 15em;
-}
-a.crmMailing-submit-button div:hover {
-  background: #afa;
-  border: 1px solid #7a7;
-  cursor: pointer;
-}
-a.crmMailing-submit-button:hover {
-  text-decoration: none;
-}
-a.crmMailing-submit-button.disabled div {
-  color: black;
-  background: #aaa;
-  border: 1px solid #8a8;
-}
-a.crmMailing-submit-button.blocking div {
-  -webkit-animation: crmMailingPulse 2s infinite !important; /* Chrome, Safari, Opera */
-  animation: crmMailingPulse 2s infinite !important;
-}
-@-webkit-keyframes crmMailingPulse {
-  0% {background: #bfb;}
-  50% {background: #aaa;}
-  100% {background: #bfb;}
-}
-@keyframes crmMailingPulse {
-  0% {background: #bfb;}
-  50% {background: #aaa;}
-  100% {background: #bfb;}
-}
-a.crmMailing-submit-button.disabled div:hover, a.crmMailing-submit-button.blocking div:hover {
-  background: #aaa;
-  border: 1px solid #7a7;
-  cursor: not-allowed;
+.crm-container a.crmMailing-submit-button {
+  display: inline-block;
+  padding: .2em .4em;
+  margin: 1em auto;
+  border-radius: 5px;
+  font-size: 1.2em;
+  float: none;
+}
+.crm-container a.crmMailing-submit-button div {
+  background: url(../i/check.gif) no-repeat left center;
+  padding-left: 20px;
+}
+.crm-container a.crmMailing-submit-button.disabled,
+.crm-container a.crmMailing-submit-button.blocking {
+  opacity: .6;
+  cursor: default;
+}
+.crm-container a.crmMailing-submit-button.blocking div {
+  background: url(../i/loading-2f2f2e.gif) no-repeat left center;
 }
 
 .crm-container .crm-form-block label {
diff --git a/partials/crmMailing/edit-wizard.html b/partials/crmMailing/edit-wizard.html
index e202a4f0ad..5458c42119 100644
--- a/partials/crmMailing/edit-wizard.html
+++ b/partials/crmMailing/edit-wizard.html
@@ -53,7 +53,7 @@
           <div crm-mailing-block-review crm-mailing="mailing"/>
         </div>
         <center>
-          <a class="crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailing.$invalid}">
+          <a class="button crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailing.$invalid}">
             <div>{{ts('Submit Mailing')}}</div>
           </a>
         </center>
diff --git a/partials/crmMailing/edit.html b/partials/crmMailing/edit.html
index b10c5a922d..4ae598a370 100644
--- a/partials/crmMailing/edit.html
+++ b/partials/crmMailing/edit.html
@@ -51,7 +51,7 @@
           <div crm-mailing-block-schedule crm-mailing="mailing"/>
         </div>
         <center>
-          <a class="crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailing.$invalid}">
+          <a class="button crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailing.$invalid}">
             <div>{{ts('Submit Mailing')}}</div>
           </a>
         </center>
diff --git a/partials/crmMailingAB/edit.html b/partials/crmMailingAB/edit.html
index 0553280a46..ee1af5c667 100644
--- a/partials/crmMailingAB/edit.html
+++ b/partials/crmMailingAB/edit.html
@@ -165,7 +165,7 @@
           }"
           crm-abtest="abtest"></div>
         <center>
-          <a class="crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailingAB.$invalid}">
+          <a class="button crmMailing-submit-button" ng-click="submit()" ng-class="{blocking: block.check(), disabled: crmMailingAB.$invalid}">
             <div>{{ts('Submit Mailing')}}</div>
           </a>
         </center>
-- 
2.25.1