Changeset 20403 for extensions/SocialButtons
- Timestamp:
- Jan 26, 2013, 2:02:17 AM (11 years ago)
- Location:
- extensions/SocialButtons/template
- Files:
-
- 4 edited
Legend:
- Unmodified
- Added
- Removed
-
extensions/SocialButtons/template/admin.tpl
r20374 r20403 2 2 3 3 {html_style}{literal} 4 img.grayscale{4 .socialbutt.disabled thead img { 5 5 filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale"); /* Firefox 10+ */ 6 6 filter: gray; /* IE6-9 */ … … 11 11 {footer_script}{literal} 12 12 jQuery("input.enable").change(function() { 13 $parent = $(this).closest(" table");13 $parent = $(this).closest("div.socialbutt"); 14 14 if (!$(this).is(":checked")) { 15 15 $parent.find("thead label").attr("title", "{/literal}{'Enable'|@translate|escape:javascript}{literal}"); 16 $parent. find("thead img").addClass('grayscale');17 $parent. find("tbody").hide();16 $parent.addClass('disabled'); 17 $parent.removeClass('enabled'); 18 18 } 19 19 else { 20 20 $parent.find("thead label").attr("title", "{/literal}{'Disable'|@translate|escape:javascript}{literal}"); 21 $parent. find("thead img").removeClass('grayscale');22 $parent. find("tbody").show();21 $parent.addClass('enabled'); 22 $parent.removeClass('disabled'); 23 23 } 24 24 }); … … 51 51 52 52 53 <div class="socialbutt "> {* <!-- twitter --> *}53 <div class="socialbutt {if not $twitter.enabled}disabled{else}enabled{/if}"> {* <!-- twitter --> *} 54 54 <table> 55 55 <thead> 56 56 <tr><td colspan="2"> 57 57 <label title="{if $twitter.enabled}{'Disable'|@translate}{else}{'Enable'|@translate}{/if}"> 58 <img {if not $twitter.enabled}class="grayscale"{/if}src="{$SOCIALBUTT_PATH}template/images/twitter_logo.png"/>58 <img src="{$SOCIALBUTT_PATH}template/images/twitter_logo.png"/> 59 59 <input class="enable" style="display:none;" type="checkbox" name="twitter[enabled]" {if $twitter.enabled}checked="checked"{/if}/> 60 60 </label> 61 61 </td></tr> 62 62 </thead> 63 <tbody {if not $twitter.enabled}style="display:none;"{/if}>63 <tbody> 64 64 <tr class="property"> 65 65 <td> … … 70 70 <tr class="button"> 71 71 <td><label> 72 20px73 72 <img src="{$SOCIALBUTT_PATH}template/images/twitter_small.png"/> 74 73 <input type="radio" name="twitter[size]" value="small" {if $twitter.size=='small'}checked="checked"{/if}/> … … 77 76 <input type="radio" name="twitter[size]" value="large" {if $twitter.size=='large'}checked="checked"{/if}/> 78 77 <img src="{$SOCIALBUTT_PATH}template/images/twitter_large.png"/> 79 28px80 78 </label></td> 81 79 </tr> … … 101 99 </div> {* <!-- twitter --> *} 102 100 103 <div class="socialbutt "> {* <!-- google --> *}101 <div class="socialbutt {if not $google.enabled}disabled{else}enabled{/if}"> {* <!-- google --> *} 104 102 <table> 105 103 <thead> 106 104 <tr><td colspan="2"> 107 105 <label title="{if $google.enabled}{'Disable'|@translate}{else}{'Enable'|@translate}{/if}"> 108 <img {if not $google.enabled}class="grayscale"{/if}src="{$SOCIALBUTT_PATH}template/images/google_logo.png"/>106 <img src="{$SOCIALBUTT_PATH}template/images/google_logo.png"/> 109 107 <input class="enable" style="display:none;" type="checkbox" name="google[enabled]" {if $google.enabled}checked="checked"{/if}/> 110 108 </label> 111 109 </td></tr> 112 110 </thead> 113 <tbody {if not $google.enabled}style="display:none;"{/if}>111 <tbody> 114 112 <tr class="property"> 115 113 <td> … … 120 118 <tr class="button"> 121 119 <td><label> 122 15px123 120 <img src="{$SOCIALBUTT_PATH}template/images/google_small.png"/> 124 121 <input type="radio" name="google[size]" value="small" {if $google.size=='small'}checked="checked"{/if}/> … … 127 124 <input type="radio" name="google[size]" value="medium" {if $google.size=='medium'}checked="checked"{/if}/> 128 125 <img src="{$SOCIALBUTT_PATH}template/images/google_medium.png"/> 129 20px 130 </label></td> 131 </tr> 132 <tr class="button"> 133 <td><label> 134 24px 126 </label></td> 127 </tr> 128 <tr class="button"> 129 <td><label> 135 130 <img src="{$SOCIALBUTT_PATH}template/images/google_standard.png"/> 136 131 <input type="radio" name="google[size]" value="standard" {if $google.size=='standard'}checked="checked"{/if}/> … … 139 134 <input type="radio" name="google[size]" value="tall" {if $google.size=='tall'}checked="checked"{/if}/> 140 135 <img src="{$SOCIALBUTT_PATH}template/images/google_tall.png"/> 141 60px142 136 </label></td> 143 137 </tr> … … 158 152 <br> 159 153 160 <div class="socialbutt "> {* <!-- pinterest --> *}154 <div class="socialbutt {if not $pinterest.enabled}disabled{else}enabled{/if}"> {* <!-- pinterest --> *} 161 155 <table> 162 156 <thead> 163 157 <tr><td colspan="2"> 164 158 <label title="{if $pinterest.enabled}{'Disable'|@translate}{else}{'Enable'|@translate}{/if}"> 165 <img {if not $pinterest.enabled}class="grayscale"{/if}src="{$SOCIALBUTT_PATH}template/images/pinterest_logo.png"/>159 <img src="{$SOCIALBUTT_PATH}template/images/pinterest_logo.png"/> 166 160 <input class="enable" style="display:none;" type="checkbox" name="pinterest[enabled]" {if $pinterest.enabled}checked="checked"{/if}/> 167 161 </label> 168 162 </td></tr> 169 163 </thead> 170 <tbody {if not $pinterest.enabled}style="display:none;"{/if}>164 <tbody> 171 165 <tr class="property"> 172 166 <td> … … 191 185 </div> {* <!-- pinterest --> *} 192 186 193 <div class="socialbutt "> {* <!-- facebook --> *}187 <div class="socialbutt {if not $facebook.enabled}disabled{else}enabled{/if}"> {* <!-- facebook --> *} 194 188 <table> 195 189 <thead> 196 190 <tr><td colspan="2"> 197 191 <label title="{if $facebook.enabled}{'Disable'|@translate}{else}{'Enable'|@translate}{/if}"> 198 <img {if not $facebook.enabled}class="grayscale"{/if}src="{$SOCIALBUTT_PATH}template/images/facebook_logo.png"/>192 <img src="{$SOCIALBUTT_PATH}template/images/facebook_logo.png"/> 199 193 <input class="enable" style="display:none;" type="checkbox" name="facebook[enabled]" {if $facebook.enabled}checked="checked"{/if}/> 200 194 </label> 201 195 </td></tr> 202 196 </thead> 203 <tbody {if not $facebook.enabled}style="display:none;"{/if}>197 <tbody> 204 198 <tr class="property"> 205 199 <td> … … 235 229 <br> 236 230 237 <div class="socialbutt "> {* <!-- tumblr --> *}231 <div class="socialbutt {if not $tumblr.enabled}disabled{else}enabled{/if}"> {* <!-- tumblr --> *} 238 232 <table> 239 233 <thead> 240 234 <tr><td colspan="2"> 241 235 <label title="{if $tumblr.enabled}{'Disable'|@translate}{else}{'Enable'|@translate}{/if}"> 242 <img {if not $tumblr.enabled}class="grayscale"{/if}src="{$SOCIALBUTT_PATH}template/images/tumblr_logo.png"/>236 <img src="{$SOCIALBUTT_PATH}template/images/tumblr_logo.png"/> 243 237 <input class="enable" style="display:none;" type="checkbox" name="tumblr[enabled]" {if $tumblr.enabled}checked="checked"{/if}/> 244 238 </label> 245 239 </td></tr> 246 240 </thead> 247 <tbody {if not $tumblr.enabled}style="display:none;"{/if}>241 <tbody> 248 242 <tr class="property"> 249 243 <td> -
extensions/SocialButtons/template/style.css
r20358 r20403 1 1 .socialbutt { 2 2 display:inline-block; 3 position:relative; 3 4 vertical-align:top; 4 margin: 10px;5 margin:8px; 5 6 width:500px; 6 border: 10px solid #f9f9f9;7 border:8px solid #f9f9f9; 7 8 border-radius:10px; 8 9 box-shadow:0 0 5px rgba(0,0,0,0.2); … … 11 12 border-spacing: 0px; 12 13 width:100%; 14 } 15 16 .socialbutt.disabled table tbody { 17 display:none; 13 18 } 14 19 … … 26 31 .socialbutt thead td { 27 32 border-top:none; 33 } 34 .socialbutt thead label { 35 display:block; 36 width:100%; 28 37 } 29 38 .socialbutt tr td:last-child { … … 94 103 border-color: #3399DD #3399DD #2288CC; 95 104 } 105 106 .socialbutt thead label:before { 107 position:absolute; 108 top:15px; 109 left:10px; 110 font-size:22px; 111 color:#000; 112 } 113 .socialbutt.disabled thead label:before { 114 content:"\2610"; 115 } 116 .socialbutt.enabled thead label:before { 117 content:"\2611"; 118 }
Note: See TracChangeset
for help on using the changeset viewer.