Skip to content

Instantly share code, notes, and snippets.

@CoachBirgit
CoachBirgit / divi-cta-buttons-outline-style.css
Created November 5, 2015 07:14
DIVI: CTA BUTTONS - OUTLINE STYLE
/*DIVI CTA BUTTONS - OUTLINE STYLE*/
.et_pb_bg_layout_light .et_pb_promo_button, .et_pb_bg_layout_light .et_pb_more_button, .et_pb_bg_layout_light .et_pb_newsletter_button, .et_pb_pricing_table_button {
background-color: rgba(255, 255, 255, 0) !important;
color: #82c0c7;
border-color: #82c0c7;
}
.et_pb_promo_button, .et_pb_newsletter_button, a.et_pb_more_button, .et_pb_pricing_table_button {
@CoachBirgit
CoachBirgit / divi-cta-buttons-squared-corners.css
Created November 5, 2015 07:15
DIVI: CTA BUTTONS - SQUARED CORNERS
/*DIVI CTA BUTTONS - SQUARED CORNERS*/
.et_pb_promo_button, .et_pb_newsletter_button, a.et_pb_more_button, .et_pb_pricing_table_button {
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
}
/* source: http://www.elegantthemes.com/blog/resources/divi-css-tricks */
@CoachBirgit
CoachBirgit / divi-cta-buttons-opacity-hover.css
Created November 5, 2015 07:17
DIVI: CTA BUTTONS - 50% Opacity Hover State
/*DIVI CTA BUTTONS - HOVER*/
.et_pb_promo_button, .et_pb_newsletter_button, a.et_pb_more_button, .et_pb_pricing_table_button {
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.et_pb_promo_button:hover, .et_pb_newsletter_button:hover, a.et_pb_more_button:hover, .et_pb_pricing_table_button:hover {
opacity:.75;
@CoachBirgit
CoachBirgit / divi-post-types-gray-scale-hover-effect.css
Created November 5, 2015 07:21
DIVI: POST, PROJECTS, and PRODUCTS - B&W HOVER STATE
/*DIVI POST, PROJECTS, and PRODUCTS - B&W HOVER STATE*/
.et_shop_image:hover, .et_portfolio_image:hover, .et_pb_post img:hover {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: grayscale(100%);
}
.et_pb_post img{-moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s}

Keybase proof

I hereby claim:

  • I am CoachBirgit on github.
  • I am coachbirgit (https://keybase.io/coachbirgit) on keybase.
  • I have a public key whose fingerprint is 8D6B E6DB AC82 C2D9 E188 DB2D 6002 F1C5 8782 3445

To claim this, I am signing this object:

@CoachBirgit
CoachBirgit / functions.php
Created January 13, 2016 15:59
Set a default layout with the Genesis Framework.
<?php
//* Do NOT include the opening php tag
//* Set content/sidebar as the default layout
genesis_set_default_layout( 'content-sidebar' );
//* Set sidebar/content as the default layout
genesis_set_default_layout( 'sidebar-content' );
//* Set content/sidebar/sidebar as the default layout
@CoachBirgit
CoachBirgit / functions.php
Created January 13, 2016 15:59
Exclude categories from blog homepage with the Genesis Framework.
<?php
//* Do NOT include the opening php tag
//* Exclude categories from blog homepage
add_action( 'pre_get_posts', 'bg_exclude_categories' );
function bg_exclude_categories( $query ) {
if( $query->is_main_query() && $query->is_home() ) {
$query->set( 'cat', '-5,-7' );
}
@CoachBirgit
CoachBirgit / sample.css
Created January 13, 2016 15:59
Sample CSS to add "Made with Love" to your site footer with the Genesis Framework. Raw
/* Heart Icon
--------------------------------------------- */
.site-footer .icon {
font-size: 20px;
}
.site-footer .love .icon {
font-size: 12px;
margin-left: 2px;
@CoachBirgit
CoachBirgit / sample.css
Created January 13, 2016 16:00
Sample CSS used for social media links using Ionicons with the Genesis Framework.
/* Ionicons
--------------------------------------------- */
.site-footer p.social a {
border: 1px solid #949792;
border-radius: 50%;
color: #949792;
display: inline-block;
height: 42px;
margin-left: 10px;
@CoachBirgit
CoachBirgit / sample.html
Created January 13, 2016 16:00
Sample HTML used for social media links using Ionicons with the Genesis Framework.
<p class="social">
<a href="http://twitter.com/bgardner"><i class="icon ion-social-twitter"></i></a>
<a href="http://www.facebook.com/bgardner"><i class="icon ion-social-facebook"></i></a>
<a href="http://instagram.com/bgardner"><i class="icon ion-social-instagram-outline"></i></a>
<a href="http://dribbble.com/bgardner"><i class="icon ion-social-dribbble-outline"></i></a>
</p>