Skip to content

Commit

Permalink
Fixed media queries and elements, added new styles and classes, fixed…
Browse files Browse the repository at this point in the history 
… in-line styling of certain elements.

See wpsharks/comet-cache#699
  • Loading branch information
@renzms
renzms committed Oct 14, 2016
1 parent 66e7c58 commit 716f30a
Show file tree
Hide file tree
Showing 8 changed files with 81 additions and 22 deletions.
2 changes: 1 addition & 1 deletion phings
Submodule phings updated from 70dcec to d9558e
2 changes: 1 addition & 1 deletion src/client-s/css/menu-pages.min.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion src/client-s/css/menu-pages.min.css.map
View file

Large diffs are not rendered by default.

23 changes: 22 additions & 1 deletion src/client-s/css/menu-pages/_elements.scss
View file
Expand Up @@ -53,7 +53,12 @@

img {
border: 0;
max-width: 99%;
max-width: 100%;

@media (max-width: 876px) {
display: block;
margin: auto;
}

&.screenshot {
float: right;
Expand All @@ -78,6 +83,10 @@
label {
@include user-select(none);

@media (max-width: 500px) {
margin-left: -15px;
}

&.switch-primary {
font-size: 120%;
margin: 0;
Expand All @@ -88,6 +97,17 @@
background: $primary-switch-bg-color;
border: 1px solid $primary-switch-border-color;
box-shadow: -1px -1px 0 0 $primary-switch-box-shadow-color-a inset, 1px 1px 0 0 $primary-switch-box-shadow-color-b inset;

@media (max-width: 500px) {
margin: 0;
padding: 0.5em;
border-radius: 4px;
display: inline;
color: $primary-switch-color;
background: $primary-switch-bg-color;
border: 1px solid $primary-switch-border-color;
box-shadow: -1px -1px 0 0 $primary-switch-box-shadow-color-a inset, 1px 1px 0 0 $primary-switch-box-shadow-color-b inset;
}
}
}

Expand Down Expand Up @@ -178,6 +198,7 @@
&:active {
@include transform(scale(0.98, 0.98));
}

}

.info,
Expand Down
58 changes: 48 additions & 10 deletions src/client-s/css/menu-pages/_heading.scss
View file
@@ -1,16 +1,54 @@
.plugin-menu-page-heading {

.plugin-menu-page-restore-defaults,
.plugin-menu-page-panel-togglers {
.plugin-menu-page-stats-button {
float: right;

@media (max-width: 860px) {
float: none;
display: block;
margin: auto;
}
}

.plugin-menu-page-restore-defaults{
float: right;
margin: 0 1em 0 0;
@media (max-width: 480px) {
float: left;
margin: 0 3em 0 0;
}

@media (max-width: 900px) {
float: none;
clear: left;
text-align: center;
margin: 0 auto 0 auto;
}
}

.plugin-menu-page-panel-togglers {
float: right;
margin: 0 1em 0 0;

@media (max-width: 900px) {
float: none;
clear: left;
text-align: center;
margin: -40px auto 0 auto;
padding-left: 6em;
}

@media (max-width: 660px) {
float: none;
clear: left;
text-align: center;
margin: -40px auto 0 auto;
padding-left: 8em;
}

@media (max-width: 540px) {
float: none;
clear: left;
text-align: center;
margin: -40px auto 0 auto;
padding-left: 8.5em;
}
button {
background: $heading-panel-togglers-bg-color !important;
}
Expand All @@ -23,7 +61,7 @@
max-width: 350px;
margin: 1em 0 0;

@media (max-width: 480px) {
@media (max-width: 876px) {
float: none;
clear: both;
text-align: center;
Expand All @@ -45,7 +83,7 @@
max-width: 400px;
margin: .5em 0 0;

@media (max-width: 480px) {
@media (max-width: 876px) {
float: none;
clear: both;
text-align: center;
Expand All @@ -65,7 +103,7 @@
max-width: 400px;
margin: .5em 0 0;

@media (max-width: 480px) {
@media (max-width: 876px) {
float: none;
clear: both;
text-align: center;
Expand All @@ -85,7 +123,7 @@
margin: 0.5em 0 0 0;
text-align: right;

@media (max-width: 480px) {
@media (max-width: 876px) {
float: none;
clear: both;
text-align: center;
Expand Down
2 changes: 1 addition & 1 deletion src/client-s/css/menu-pages/_panels.scss
View file
Expand Up @@ -104,7 +104,7 @@
font-size: 120%;
font-weight: bold;

@media (max-width: 480px) {
@media (max-width: 860px) {
float: none;
font-size: 120%;
font-weight: bold;
Expand Down
10 changes: 5 additions & 5 deletions src/includes/classes/MenuPageOptions.php
View file
Expand Up @@ -30,11 +30,11 @@ public function __construct()
if (is_multisite()) {
echo '<button type="button" class="plugin-menu-page-wipe-cache" style="float:right; margin-left:15px;" title="'.esc_attr(__('Wipe Cache (Start Fresh); clears the cache for all sites in this network at once!', SLUG_TD)).'"'.
' data-action="'.esc_attr(add_query_arg(urlencode_deep(['page' => GLOBAL_NS, '_wpnonce' => wp_create_nonce(), GLOBAL_NS => ['wipeCache' => '1']]), self_admin_url('/admin.php'))).'">'.
' '.__('Wipe', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/wipe.png')).'" style="width:16px; height:16px;" /></button>'."\n";
' '.__('Wipe', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/wipe.png')).'" style="width:16px; height:16px; display:inline-block;" /></button>'."\n";
}
echo ' <button type="button" class="plugin-menu-page-clear-cache" style="float:right;" title="'.esc_attr(__('Clear Cache (Start Fresh)', SLUG_TD).((is_multisite()) ? __('; affects the current site only.', SLUG_TD) : '')).'"'.
' data-action="'.esc_attr(add_query_arg(urlencode_deep(['page' => GLOBAL_NS, '_wpnonce' => wp_create_nonce(), GLOBAL_NS => ['clearCache' => '1']]), self_admin_url('/admin.php'))).'">'.
' '.__('Clear', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/clear.png')).'" style="width:16px; height:16px;" /></button>'."\n";
' '.__('Clear', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/clear.png')).'" style="width:16px; height:16px; display:inline-block;" /></button>'."\n";

echo ' <button type="button" class="plugin-menu-page-restore-defaults"'.// Restores default options.
' data-confirmation="'.esc_attr(__('Restore default plugin options? You will lose all of your current settings! Are you absolutely sure about this?', SLUG_TD)).'"'.
Expand Down Expand Up @@ -102,7 +102,7 @@ public function __construct()
}
echo '</div>'."\n";
}
echo ' <img src="'.$this->plugin->url('/src/client-s/images/options-'.(IS_PRO ? 'pro' : 'lite').'.png').'" alt="'.esc_attr(__('Plugin Options', SLUG_TD)).'" />'."\n";
echo ' <img src="'.$this->plugin->url('/src/client-s/images/options-'.(IS_PRO ? 'pro' : 'lite').'.png').'" alt="'.esc_attr(__('Plugin Options', SLUG_TD)).'" />'."\n";

echo '<div style="clear:both;"></div>'."\n";

Expand Down Expand Up @@ -305,7 +305,7 @@ public function __construct()
echo ' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/clear-cache-ops1-ss.png')).'" class="-clear-cache-ops-ss screenshot" />'."\n";
echo ' <p>'.sprintf(__('Once %1$s is enabled, you will find this new option in your WordPress Admin Bar (screenshot on right). Clicking this button will clear the cache and you can start fresh at anytime (e.g., you can do this manually; and as often as you wish).', SLUG_TD), esc_html(NAME)).'</p>'."\n";
echo ' <p>'.sprintf(__('Depending on the structure of your site, there could be many reasons to clear the cache. However, the most common reasons are related to Post/Page edits or deletions, Category/Tag edits or deletions, and Theme changes. %1$s handles most scenarios all by itself. However, many site owners like to clear the cache manually; for a variety of reasons (just to force a refresh).', SLUG_TD), esc_html(NAME)).'</p>'."\n";
echo ' <p><select name="'.esc_attr(GLOBAL_NS).'[saveOptions][cache_clear_admin_bar_enable]" data-target=".-cache-clear-admin-bar-options, .-cache-clear-admin-bar-roles-caps" style="width:auto;">'."\n";
echo ' <p><select name="'.esc_attr(GLOBAL_NS).'[saveOptions][cache_clear_admin_bar_enable]" data-target=".-cache-clear-admin-bar-options, .-cache-clear-admin-bar-roles-caps">'."\n";
echo ' <option value="1"'.selected($this->plugin->options['cache_clear_admin_bar_enable'], '1', false).'>'.__('Yes, enable &quot;Clear Cache&quot; button in admin bar', SLUG_TD).'</option>'."\n";
echo ' <option value="0"'.selected($this->plugin->options['cache_clear_admin_bar_enable'], '0', false).'>'.__('No, I don\'t intend to clear the cache manually.', SLUG_TD).'</option>'."\n";
echo ' </select>'."\n";
Expand Down Expand Up @@ -980,7 +980,7 @@ public function __construct()
echo ' </a>'."\n";

echo ' <div class="plugin-menu-page-panel-body clearfix">'."\n";
echo ' <button type="button" class="plugin-menu-page-clear-cdn-cache" style="float:right; margin:0 0 1em 1em;" title="'.esc_attr(__('Clear CDN Cache (Bump CDN Invalidation Counter)', SLUG_TD)).'">'.__('Clear CDN Cache', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/clear.png')).'" style="width:16px; height:16px;" /></button>'."\n";
echo ' <button type="button" class="plugin-menu-page-clear-cdn-cache" style="float:right; margin:0 0 1em 1em;" title="'.esc_attr(__('Clear CDN Cache (Bump CDN Invalidation Counter)', SLUG_TD)).'">'.__('Clear CDN Cache', SLUG_TD).' <img src="'.esc_attr($this->plugin->url('/src/client-s/images/clear.png')).'" style="width:16px; height:16px; display:inline-block;" /></button>'."\n";
echo ' <h3>'.__('Enable Static CDN Filters (e.g., MaxCDN/CloudFront)?', SLUG_TD).'</h3>'."\n";
echo ' <p>'.sprintf(__('This feature allows you to serve some and/or ALL static files on your site from a CDN of your choosing. This is made possible through content/URL filters exposed by WordPress and implemented by %1$s. All it requires is that you setup a CDN host name sourced by your WordPress installation domain. You enter that CDN host name below and %1$s will do the rest! Super easy, and it doesn\'t require any DNS changes either. :-) Please <a href="http://cometcache.com/r/static-cdn-filters-general-instructions/" target="_blank">click here</a> for a general set of instructions.', SLUG_TD), esc_html(NAME)).'</p>'."\n";
echo ' <p>'.__('<strong>What\'s a CDN?</strong> It\'s a Content Delivery Network (i.e., a network of optimized servers) designed to cache static resources served from your site (e.g., JS/CSS/images and other static files) onto it\'s own servers, which are located strategically in various geographic areas around the world. Integrating a CDN for static files can dramatically improve the speed and performance of your site, lower the burden on your own server, and reduce latency associated with visitors attempting to access your site from geographic areas of the world that might be very far away from the primary location of your own web servers.', SLUG_TD).'</p>'."\n";
Expand Down
4 changes: 2 additions & 2 deletions src/includes/classes/MenuPageStats.php
View file
Expand Up @@ -25,7 +25,7 @@ public function __construct()

echo '<div class="plugin-menu-page-heading">'."\n";

echo ' <button type="button" class="plugin-menu-page-stats-button" style="float:right;">'.
echo ' <button type="button" class="plugin-menu-page-stats-button">'.
__('Refresh Stats/Charts', SLUG_TD).' <i class="si si-refresh"></i>'.
'</button>'."\n";

Expand Down Expand Up @@ -74,7 +74,7 @@ public function __construct()
}
echo '</div>'."\n";
}
echo ' <img src="'.$this->plugin->url('/src/client-s/images/stats.png').'" alt="'.esc_attr(__('Statistics', SLUG_TD)).'" />'."\n";
echo ' <img src="'.$this->plugin->url('/src/client-s/images/stats.png').'" alt="'.esc_attr(__('Statistics', SLUG_TD)).'" />'."\n";

echo '<div style="clear:both;"></div>'."\n";

Expand Down

0 comments on commit 716f30a

Please sign in to comment.