fixed beta 1 bugs, 31062, 31063, 31101, 31067, 31065
[com.zyxware.civiwci.git] / templates / CRM / Wci / Page / wciwidget.tpl
index 6dad7da4b4fd959e0e922271f004cfa0c537dab5..50c569de725002bad9be4416d96a1c08da91b0bd 100644 (file)
@@ -4,13 +4,22 @@
         font-size:12px;
         font-family:Helvetica, Arial, sans;
         padding:6px;
-        -moz-border-radius:       4px;
-        -webkit-border-radius:   4px;
-        -khtml-border-radius:   4px;
-        border-radius:      4px;
-        border:1px solid #96C0E7;
+        -moz-border-radius: 12px;
+        -webkit-border-radius: 12px;
+        -khtml-border-radius: 12px;
+        border-radius: 12px;
+    }
+    .crm-wci-widget-border {
+        border: 4px solid {/literal}{$wciform.color_border}{literal};
+        background-color: {/literal}{$wciform.color_widget_bg}{literal}; /* background color */
     }
     
+    .crm-wci-widget hr {
+      text-align:center;
+      display: block; height: 1px;
+      border: 0; border-top: 1px solid {/literal}{$wciform.color_border}{literal};
+      margin: 1em 0; padding: 0;
+    }
     .crm-wci-widget.thin {
       width: 150px;
     }
         -webkit-border-radius:   4px;
         -khtml-border-radius:   4px;
         border-radius:      4px;
-    }
+        color: {/literal}{$wciform.color_title}{literal};
+        background-color: {/literal}{$wciform.color_title_bg}{literal};
+    } /* title */
 
-    .crm-wci-widget .crm-amounts {
+    .crm-amounts {
         height:1em;
         margin:.8em 0px;
         font-size:13px;
     }
-    .crm-wci-widget .crm-amount-low {
+    .crm-amount-low {
         float:left;
     }
-    .crm-wci-widget .crm-amount-high {
+    .crm-amount-high {
         float:right;
     }
-    .crm-wci-widget .crm-percentage {
+    .crm-percentage {
         margin:0px 30%;
         text-align:center;
     }
-    .crm-wci-widget .crm-amount-bar {
+    .crm-amount-bar { /* progress bar */
         background-color:#FFF;
         width:100%;
         display:block;
         border-radius:      4px;
         margin-bottom:.8em;
         text-align:left;
+        
+        background-color: #FFFFFF;
+        border-color:#CECECE;
     }
-    .crm-wci-widget .crm-amount-fill {
-        background-color:#2786C2;
+    .crm-amount-fill {
+        background-color:{/literal}{$wciform.color_bar}{literal};
         height:1em;
         display:block;
-        -moz-border-radius:   4px 0px 0px 4px;
-        -webkit-border-radius:   4px 0px 0px 4px;
-        -khtml-border-radius:   4px 0px 0px 4px;
-        border-radius:      4px 0px 0px 4px;
+        -moz-border-radius:   4px;
+        -webkit-border-radius:   4px;
+        -khtml-border-radius:   4px;
+        border-radius:      4px;
         text-align:left;
         width: {/literal}{$wciform.pb_percentage}{literal}%; /* progress bar percentage */
     }
-    .crm-wci-widget .crm-amount-raised-wrapper {
+    .crm-amount-raised-wrapper {
         margin-bottom:.8em;
     }
-    .crm-wci-widget .crm-amount-raised {
+    .crm-amount-raised {
         font-weight:bold;
+        color:#000;
     }
 
-    .crm-wci-widget .crm-logo {
+    .crm-logo {
         text-align:center;
     }
 
-    .crm-wci-widget .crm-comments,
-    .crm-wci-widget .crm-donors,
-    .crm-wci-widget .crm-campaign {
+    .crm-comments,
+    .crm-donors,
+    .crm-campaign {
         font-size:11px;
         margin-bottom:.8em;
+        color:{/literal}{$wciform.color_description}{literal} /* other color*/
     }
 
-    .crm-wci-widget .crm-wci-button {
+    .crm-wci-button {
         display:block;
         background-color:#CECECE;
         -moz-border-radius:       4px;
         font-size:13px;
     }
 
-    .crm-wci-widget .crm-home-url {
+    .crm-home-url {
         text-decoration:none;
         border:0px;
+        color:{/literal}{$wciform.color_homepage_link}{literal} /* home page link color*/
     }
 
-</style>
-<style>
-    .crm-wci-widget {
-        background-color: {/literal}{$wciform.color_widget_bg}{literal}; /* background color */
-        border-color:{/literal}{$wciform.color_border}{literal}; /* border color */
-        background:  {/literal}{if $wciform.image}url('{$wciform.image}'){else}none{/if}{literal}; /* background image */
-    }
-
-    .crm-wci-widget h5 {
-        color: {/literal}{$wciform.color_title}{literal};
-        background-color: {/literal}{$wciform.color_title_bg}{literal};
-    } /* title */
-
-    .crm-wci-widget .crm-amount-raised { color:#000; }
-    .crm-wci-widget .crm-amount-bar  /* progress bar */
-        background-color:{/literal}{$wciform.color_bar}{literal};
-        border-color:#CECECE;
-    }
-    .crm-wci-widget .crm-amount-fill { background-color:#2786C2; }
-
-    .crm-wci-widget a.crm-wci-button { /* button color */
+    a.crm-wci-button { /* button color */
         background-color:{/literal}{$wciform.color_button_bg}{literal};
     }
 
-    .crm-wci-widget .crm-wci-button-inner { /* button text color */
+    .crm-wci-button-inner { /* button text color */
         padding:2px;
         display:block;
         color:{/literal}{$wciform.color_button}{literal};
     }
-
-    .crm-wci-widget .crm-comments,
-    .crm-wci-widget .crm-donors,
-    .crm-wci-widget .crm-campaign {
-        color:{/literal}{$wciform.color_description}{literal} /* other color*/
+    #crm_wci_image_container {
+      text-align: center;
+      padding: 10px 20px;
     }
-
-    .crm-wci-widget .crm-home-url {
-        color:{/literal}{$wciform.color_homepage_link}{literal} /* home page link color*/
+    .thin #crm_wci_image {
+      width: 100px;
+    }
+    .normal #crm_wci_image {
+      width: 150px;
+    }
+    .wide #crm_wci_image {
+      width: 200px;
+    }
+    #newsletter_msg, #newsletter_mail, #newsletter_submit {
+      text-align: center;
+      margin: 0 auto;
+    }
+    input.btnNL, button.btnNL {
+       color:{/literal}{$wciform.color_btn_newsletter}{literal};
+       background:{/literal}{$wciform.color_btn_newsletter_bg}{literal};
+    }
+    #newsletter_msg {
+      color:{/literal}{$wciform.color_newsletter_text}{literal};
     }
-
 </style>
+
 <style>
 {/literal}
   {$wciform.style_rules}
 </style>
 {/literal}
 
-<div id="crm_wid_{$widgetId}" class="crm-wci-widget {$wciform.size_variant}">
-    <h5 id="crm_wid_{$widgetId}_title">
+{if (1 == $wciform.hide_border)}
+<div id="crm_wid_{$wciform.widgetId}" class="crm-wci-widget {$wciform.size_variant}">
+{else}
+<div id="crm_wid_{$wciform.widgetId}" class="crm-wci-widget crm-wci-widget-border {$wciform.size_variant}">
+{/if}
       {if $wciform.logo_image}
         <span class="crm-logo">
           <img src="{$wciform.logo_image}" alt={ts}Logo{/ts}>
         </span>
       {/if}
+  {if $wciform.title && (false == $wciform.hide_title)}
+    <h5 id="crm_wid_{$wciform.widgetId}_title">
       {$wciform.title}
     </h5>
+  {/if}
+    {if $wciform.image}
+      <div id="crm_wci_image_container">
+        <img id="crm_wci_image" src='{$wciform.image}'/>
+      </div>
+    {/if}
+    {if (false == $wciform.hide_pbcap)}
     <div class="crm-amounts">
-        <div id="crm_wid_{$widgetId}_amt_hi" class="crm-amount-high"></div>
-        <div id="crm_wid_{$widgetId}_amt_low" class="crm-amount-low"></div>
-        <div id="crm_wid_{$widgetId}_percentage" class="crm-percentage"></div>
+        <div id="crm_wid_{$wciform.widgetId}_amt_hi" class="crm-amount-high">${$wciform.goal_amount}</div>
+        <div id="crm_wid_{$wciform.widgetId}_amt_low" class="crm-amount-low">${$wciform.starting_amount}</div>
+        <div id="crm_wid_{$wciform.widgetId}_percentage" class="crm-percentage">{$wciform.pb_percentage}%</div>
     </div>
+    {/if}
     <div class="crm-amount-bar">
-        <div class="crm-amount-fill" id="crm_wid_{$widgetId}_amt_fill"></div>
+        <div class="crm-amount-fill" id="crm_wid_{$wciform.widgetId}_amt_fill"></div>
     </div>
-    <div id="crm_wid_{$widgetId}_donors" class="crm-donors">
+    <div id="crm_wid_{$wciform.widgetId}_donors" class="crm-donors">
     </div>
-    <div id="crm_wid_{$widgetId}_comments" class="crm-comments">
+    <div id="crm_wid_{$wciform.widgetId}_comments" class="crm-comments">
       {$wciform.description}
     </div>
-    <div id="crm_wid_{$widgetId}_campaign" class="crm-campaign">
+    <div id="crm_wid_{$wciform.widgetId}_campaign" class="crm-campaign">
     </div>
-    <div class="crm-wci-button-wrapper" id="crm_wid_{$widgetId}_button">
-        <a href='{crmURL p="civicrm/contribute/transact" q="reset=1&id=$cpageId" h=0 a=1 fe=1}' class="crm-wci-button"><span class="crm-wci-button-inner" id="crm_wid_{$widgetId}_btn_txt">{$wciform.button_title}</span></a>
+    {if $wciform.button_title && $cpageId}
+    <div class="crm-wci-button-wrapper" id="crm_wid_{$wciform.widgetId}_button">
+        <a href='{crmURL p="civicrm/contribute/transact" q="reset=1&id=$cpageId" h=0 a=1 fe=1}' class="crm-wci-button"><span class="crm-wci-button-inner" id="crm_wid_{$wciform.widgetId}_btn_txt">{$wciform.button_title}</span></a>
     </div>
-    {$wciform.embed}
+        {if $wciform.email_signup_group_id}
+        <hr>
+        {/if}
+    {/if}
     {if $wciform.email_signup_group_id}
-      {if $wciform.embed == 1}
-        <form method="get" action="http://{php}echo $_SERVER['SERVER_NAME'];{/php}/civicrm/mailing/subscribe"
+      {if $preview eq 0 }
+        <form action="{$wciform.emailSignupGroupFormURL}" method="post">
       {/if}
-        <p style="text-align:center;">
-          <input type="text" id="frmEmail" name="email-Primary" size="10">
+        <p id="newsletter_msg">
+          {$wciform.newsletter_text}
+        </p>
+        <p id="newsletter_mail">
+          <input id="frmEmail" type="text" name="email-Primary" size="18" maxlength="80" placeholder="email address">
         </p>
-        <p style="text-align: center; margin-top: 10px;">
-          <input type="submit" name="_qf_Edit_next" value="Subscribe Me">
+        <p id="newsletter_submit">
+          {if $preview eq 0 }
+            <input class ="btnNL" type="submit" name="_qf_Edit_next" value="Subscribe me">
+          {else}
+            <button class ="btnNL" type="button" name="_qf_Edit_next" value="Subscribe me">Subscribe me</button>
+          {/if}
         </p>
-      {if $wciform.embed == 1}
+        <div>
+          <input name="postURL" type="hidden" value="">
+          <input type="hidden" name="group[{$wciform.email_signup_group_id}]" value="1">
+          <input name="_qf_default" type="hidden" value="Edit:cancel">
+        </div>
+      {if $preview eq 0 }
         </form>
       {/if}
     {/if}