Skip to content

Commit

Permalink
namespace CSS to prevent conflicts
Browse files Browse the repository at this point in the history 
All CSS classes and styles provided by Materializer are now namespaced
with the class .materializer to prevent conflicts with other stylesheets
or markup on the same page.
  • Loading branch information
@CodyReichert
CodyReichert committed Oct 30, 2015
1 parent e843402 commit 25959fd
Show file tree
Hide file tree
Showing 15 changed files with 8,036 additions and 90 deletions.
44 changes: 28 additions & 16 deletions components/buttons.php
View file
Expand Up @@ -26,9 +26,11 @@ public function raisedButton($atts, $content) {

ob_start();
?>
<span class="materializer">
<a href="<?php echo $to; ?>" class="waves-effect waves-light btn <?php echo $class; ?>">
<?php echo do_shortcode($content); ?>
</a>
</span>
<?php
return ob_get_clean();
}
Expand All @@ -52,10 +54,12 @@ public function floatingButton($atts, $content) {

ob_start();
?>
<span class="materializer">
<a href="<?php echo $to; ?>" class="waves-effect waves-light btn-floating btn-large
<?php echo $class; ?>">
<?php echo do_shortcode($content); ?>
</a>
</span>
<?php
return ob_get_clean();
}
Expand All @@ -81,22 +85,24 @@ public function fixedActionButton($atts, $content) {

ob_start();
?>
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
<a class="btn-floating btn-large red">
<i class="large material-icons">mode_edit</i>
</a>
<?php if($action_links !== NULL) { ?>
<ul>
<?php
foreach($action_links as $link) {
echo '<li>';
echo do_shortcode($link);
echo '</li>';
}
?>
</ul>
<?php } ?>
</div>
<div class="materializer">
<div class="fixed-action-btn" style="bottom: 45px; right: 24px;">
<a class="btn-floating btn-large red">
<i class="large material-icons">mode_edit</i>
</a>
<?php if($action_links !== NULL) { ?>
<ul>
<?php
foreach($action_links as $link) {
echo '<li>';
echo do_shortcode($link);
echo '</li>';
}
?>
</ul>
<?php } ?>
</div>
</div>
<?php
return ob_get_clean();
}
Expand All @@ -110,11 +116,13 @@ function fixedActionButtonAction($atts, $content) {

ob_start();
?>
<span class="materializer">
<a class="btn-floating <?php echo $class; ?>" href="<?php echo $to; ?>">
<span class="material-icons">
<?php echo $content ?>
</span>
</a>
</span>
<?php
return ob_get_clean();
}
Expand All @@ -137,9 +145,11 @@ public function flatButton($atts, $content) {

ob_start();
?>
<span class="materializer">
<a href="<?php echo $to; ?>" class="waves-effect waves-light btn-flat <?php echo $class; ?>">
<?php echo do_shortcode($content); ?>
</a>
</span>
<?php
return ob_get_clean();
}
Expand All @@ -162,9 +172,11 @@ public function largeButton($atts, $content) {

ob_start();
?>
<span class="materializer">
<a href="<?php echo $to; ?>" class="waves-effect waves-light btn-large <?php echo $class; ?>">
<?php echo do_shortcode($content); ?>
</a>
</span>
<?php
return ob_get_clean();
}
Expand Down
43 changes: 24 additions & 19 deletions components/cards.php
View file
Expand Up @@ -30,6 +30,7 @@ public function basicCard($atts, $content) {

ob_start();
?>
<div class="materializer">
<div class="card <?php echo $color . " " . $text . "-text" ; ?>">
<div class="card-content">
<span class="card-title <?php echo $titleColor . "-text" ?>">
Expand All @@ -49,6 +50,7 @@ public function basicCard($atts, $content) {
</div>
<?php } ?>
</div>
</div>
<?php
return ob_get_clean();
}
Expand Down Expand Up @@ -98,24 +100,26 @@ public function imageCard($atts, $content) {

ob_start();
?>
<div class="card <?php echo $color . " " . $text . "-text" ; ?>">
<div class="card-image">
<img src="<?php echo $img; ?>">
</div>
<div class="card-content">
<p>
<?php echo do_shortcode($stripped_content); ?>
</p>
</div>
<?php if($action_links !== NULL) { ?>
<div class="card-action">
<?php
foreach($action_links as $link) {
echo do_shortcode($link);
}
?>
</div>
<?php } ?>
<div class="materializer">
<div class="card <?php echo $color . " " . $text . "-text" ; ?>">
<div class="card-image">
<img src="<?php echo $img; ?>">
</div>
<div class="card-content">
<p>
<?php echo do_shortcode($stripped_content); ?>
</p>
</div>
<?php if($action_links !== NULL) { ?>
<div class="card-action">
<?php
foreach($action_links as $link) {
echo do_shortcode($link);
}
?>
</div>
<?php } ?>
</div>
</div>
<?php
return ob_get_clean();
Expand Down Expand Up @@ -144,6 +148,7 @@ public function revealCard($atts, $content) {

ob_start();
?>
<div class="materializer">
<div class="card">
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="https://simplyrets.com/images/scrot1.png">
Expand All @@ -165,7 +170,7 @@ public function revealCard($atts, $content) {
<?php echo do_shortcode($open_content[0][0]); ?>
</div>
</div>

</div>
<?php
return ob_get_clean();
}
Expand Down
2 changes: 2 additions & 0 deletions components/collapsible.php
View file
Expand Up @@ -32,6 +32,7 @@ public function collapsible($atts, $content) {

ob_start();
?>
<span class="materializer">
<ul class="collapsible <?php echo $class; ?>" data-collapsible="<?php echo $type; ?>">
<?php if(!empty($collapsible_items)) { ?>
<?php foreach($collapsible_items as $item) { ?>
Expand All @@ -41,6 +42,7 @@ public function collapsible($atts, $content) {
<?php } ?>
<?php } ?>
</ul>
</span>
<?php
return ob_get_clean();
}
Expand Down
4 changes: 4 additions & 0 deletions components/collections.php
View file
Expand Up @@ -29,6 +29,7 @@ public function collection($atts, $content) {
if($type === "") {
ob_start();
?>
<span class="materializer">
<ul class="collection <?php echo $class; ?>">
<?php
if(!empty($collection_items)) {
Expand All @@ -38,6 +39,7 @@ public function collection($atts, $content) {
}
?>
</ul>
</span>
<?php
return ob_get_clean();
}
Expand All @@ -46,6 +48,7 @@ public function collection($atts, $content) {

ob_start();
?>
<span class="materializer">
<div class="collection <?php echo $class; ?>">
<?php
if(!empty($links)) {
Expand All @@ -55,6 +58,7 @@ public function collection($atts, $content) {
}
?>
</div>
</span>
<?php
return ob_get_clean();
}
Expand Down
2 changes: 2 additions & 0 deletions components/dropdown.php
View file
Expand Up @@ -27,6 +27,7 @@ public function dropdown($atts, $content) {

ob_start();
?>
<span class="materializer">
<a class='dropdown-button btn <?php echo $class; ?>'
href='<?php echo $to; ?>' data-activates='<?php echo $name; ?>'>
<?php echo do_shortcode($stripped_content); ?>
Expand All @@ -42,6 +43,7 @@ public function dropdown($atts, $content) {
?>
</ul>
<?php } ?>
</span>
<?php
return ob_get_clean();

Expand Down
52 changes: 27 additions & 25 deletions components/footer.php
View file
Expand Up @@ -18,34 +18,36 @@ class Footers extends MaterializerShortcodes {
public function footer($atts) {
ob_start();
?>
<footer class="page-footer">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">Footer Content</h5>
<p class="grey-text text-lighten-4">
You can use rows and columns here to organize your
footer content.
</p>
<div class="materializer">
<footer class="page-footer">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">Footer Content</h5>
<p class="grey-text text-lighten-4">
You can use rows and columns here to organize your
footer content.
</p>
</div>
<div class="col l4 offset-l2 s12">
<h5 class="white-text">Links</h5>
<ul>
<li><a class="grey-text text-lighten-3" href="#!">Link 1</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 2</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 3</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 4</a></li>
</ul>
</div>
</div>
</div>
<div class="col l4 offset-l2 s12">
<h5 class="white-text">Links</h5>
<ul>
<li><a class="grey-text text-lighten-3" href="#!">Link 1</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 2</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 3</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Link 4</a></li>
</ul>
<div class="footer-copyright">
<div class="container">
© 2014 Copyright Text
<a class="grey-text text-lighten-4 right" href="#!">More Links</a>
</div>
</div>
</div>
</footer>
</div>
<div class="footer-copyright">
<div class="container">
© 2014 Copyright Text
<a class="grey-text text-lighten-4 right" href="#!">More Links</a>
</div>
</div>
</footer>
<?php
return ob_get_clean();
}
Expand Down
8 changes: 7 additions & 1 deletion components/images.php
View file
Expand Up @@ -23,10 +23,12 @@ public function responsiveImage($atts) {

ob_start();
?>
<span class="materializer">
<img class="responsive-img <?php echo $class; ?>"
width="<?php echo $width; ?>"
height="<?php echo $height; ?>"
src="<?php echo $src; ?>" />
</span>
<?php
return ob_get_clean();
}
Expand All @@ -46,10 +48,12 @@ public function circularImage($atts) {

ob_start();
?>
<span class="materializer">
<img class="responsive-img circle <?php echo $class; ?>"
width="<?php echo $width; ?>"
height="<?php echo $height; ?>"
src="<?php echo $src; ?>" />
</span>
<?php
return ob_get_clean();
}
Expand All @@ -64,11 +68,13 @@ public function imageBox($atts) {

ob_start();
?>
<img class="materialboxed" <?php echo $class; ?>"
<span class="materializer">
<img class="materialboxed <?php echo $class; ?>"
width="<?php echo $width; ?>"
height="<?php echo $height; ?>"
data-caption="<?php echo $caption; ?>"
src="<?php echo $src; ?>" />
</span>
<?php
return ob_get_clean();
}
Expand Down
2 changes: 2 additions & 0 deletions components/pagination.php
View file
Expand Up @@ -27,6 +27,7 @@ public function pagination($atts, $content) {

ob_start();
?>
<span class="materializer">
<ul class="pagination <?php echo $class; ?>">
<?php
if(!empty($pag_items)) {
Expand All @@ -36,6 +37,7 @@ public function pagination($atts, $content) {
}
?>
</ul>
</span>
<?php
return ob_get_clean();
}
Expand Down

0 comments on commit 25959fd

Please sign in to comment.