diff --git a/lib/admin/admin-functions.php b/lib/admin/admin-functions.php index 2952ae5..fb961bd 100644 --- a/lib/admin/admin-functions.php +++ b/lib/admin/admin-functions.php @@ -41,6 +41,8 @@ function trestle_custom_defaults( $defaults ) { 'trestle_nav_button_text' => '[icon name="icon-list-ul"] ' . __( 'Navigation', 'trestle' ), 'trestle_read_more_text' => __( 'Read More »', 'trestle' ), 'trestle_revisions_number' => 3, + 'trestle_equal_height_cols' => 1, + 'trestle_equal_cols_breakpoint' => 768, ); // Populate Trestle settings with default values if they don't yet exist @@ -75,16 +77,18 @@ function trestle_register_social_sanitization_filters() { 'trestle_auto_nav', 'trestle_include_home_link', 'trestle_link_icons', + 'trestle_equal_height_cols', ) ); // Integer genesis_add_option_filter( - 'int', + 'absint', GENESIS_SETTINGS_FIELD, array( 'footer-widgets-number', 'trestle_revisions_number', + 'trestle_equal_cols_breakpoint', ) ); @@ -169,7 +173,7 @@ function trestle_settings_box() {

- :

@@ -240,6 +244,14 @@ function trestle_settings_box() {

+

+

+ /> +

+

+ px  +

+

/>
diff --git a/lib/admin/admin.js b/lib/admin/admin.js index 62afec1..c580186 100644 --- a/lib/admin/admin.js +++ b/lib/admin/admin.js @@ -28,4 +28,13 @@ jQuery(document).ready(function() { jQuery('.trestle-post-info-meta').slideToggle(); }); + // Add drop-down functionality for equal height breakpoint + if( ! jQuery('#genesis-settings\\[trestle_equal_height_cols\\]').is(':checked') ) { + jQuery('.trestle-equal-columns-breakpoint').hide(); + } + + jQuery('#genesis-settings\\[trestle_equal_height_cols\\]').change(function() { + jQuery('.trestle-equal-columns-breakpoint').slideToggle(); + }); + }); /* end of as page load scripts */ diff --git a/lib/functions/theme-functions.php b/lib/functions/theme-functions.php index 66004ec..b7c4ea8 100644 --- a/lib/functions/theme-functions.php +++ b/lib/functions/theme-functions.php @@ -30,6 +30,12 @@ function trestle_header_actions() { // Custom jQuery (if desired) wp_enqueue_script( 'trestle-custom-jquery', '/wp-content/uploads/custom.js', array( 'jquery' ), '1.0.0', true ); + + // Pass PHP variables to theme jQuery + $php_vars = array ( + 'trestle_equal_cols_breakpoint' => genesis_get_option( 'trestle_equal_cols_breakpoint' ), + ); + wp_localize_script( 'trestle-custom-jquery', 'php_vars', $php_vars ); } @@ -312,6 +318,10 @@ function trestle_body_classes( $classes ) { // Add footer widget number class if ( genesis_get_option( 'trestle_footer_widgets_number' ) ) $classes[] = 'footer-widgets-number-' . esc_attr( genesis_get_option( 'trestle_footer_widgets_number' ) ); + + // Add class for equal height Genesis Extender columns + if ( 1 == genesis_get_option( 'trestle_equal_height_cols' ) ) + $classes[] = 'equal-height-genesis-extender-cols'; return $classes; } diff --git a/lib/js/theme-jquery.js b/lib/js/theme-jquery.js index ab77d73..5e79e1e 100644 --- a/lib/js/theme-jquery.js +++ b/lib/js/theme-jquery.js @@ -8,7 +8,11 @@ // Executes when the document is ready jQuery(document).ready(function() { - + + // Get PHP vars passed via wp_localize_script() + trestleEqualColsBreakpoint = php_vars.trestle_equal_cols_breakpoint; + trestleEqualHeightCols = php_vars.trestle_equal_height_cols + // Remove .no-jquery body class jQuery('body').removeClass('no-jquery'); @@ -51,10 +55,75 @@ jQuery(document).ready(function() { icon.text(closedIcon); }); + // Equal height homepage cols + jQuery('.equal-height-genesis-extender-cols .ez-home-container-area').each(function() { + jQuery(this).children('.widget-area').equalHeights(null,null,trestleEqualColsBreakpoint); + }); + + }); /* end of as page load scripts */ // Executes when complete page is fully loaded, including all frames, objects, and images jQuery(window).load(function() { -}); \ No newline at end of file +}); + + +/** + * Equal Heights Plugin + * + * Equalize the heights of elements. Great for columns or any elements + * that need to be the same size (floats, etc). + * + * Based on Rob Glazebrook's (cssnewbie.com) script + * + * Additions + * - ability to include a break point (the minimum viewport width at which the script does anything) + * - binds the script to run on load, orientation change (for mobile), and when resizing the window + * + * Usage: jQuery(object).equalHeights([minHeight], [maxHeight], [breakPoint]); + * + * Example 1: jQuery(".cols").equalHeights(); Sets all columns to the same height. + * Example 2: jQuery(".cols").equalHeights(400); Sets all cols to at least 400px tall. + * Example 3: jQuery(".cols").equalHeights(100,300); Cols are at least 100 but no more + * than 300 pixels tall. Elements with too much content will gain a scrollbar. + * Example 4: jQuery(".cols").equalHeights(null, null,768); Only resize columns above 768px viewport + * + */ +(function(jQuery) { + jQuery.fn.equalHeights = function(minHeight, maxHeight, breakPoint) { + var items = this; + breakPoint = breakPoint || 0; + + // Bind functionality to appropriate events + jQuery(window).bind('load orientationchange resize', function() { + tallest = (minHeight) ? minHeight : 0; + items.each(function() { + jQuery(this).height('auto'); + if(jQuery(this).height() > tallest) { + tallest = jQuery(this).height(); + } + }); + + // Get viewport width (taking scrollbars into account) + var e = window; + a = 'inner'; + if (!('innerWidth' in window )) { + a = 'client'; + e = document.documentElement || document.body; + } + width = e[ a+'Width' ]; + + // Equalize column heights if above the specified breakpoint + if ( width >= breakPoint ) { + if((maxHeight) && tallest > maxHeight) tallest = maxHeight; + console.log(tallest); + return items.each(function() { + jQuery(this).height(tallest); + }); + } + }); + } + + })(jQuery); \ No newline at end of file diff --git a/style.css b/style.css index 2e026c8..5f2fc2a 100644 --- a/style.css +++ b/style.css @@ -32,9 +32,8 @@ - WordPress - Genesis - Titles - - Widgets + - Plugins & Widgets - Featured Content - - Plugins - Genesis eNews Extended - Genesis Latest Tweets - Genesis Extender @@ -43,6 +42,8 @@ - FancyBox for WordPress - MapPress - Simple Section Navigation + - Events Manager + - Simple Newsletter Signup - Site Header - Title Area - Widget Area @@ -77,7 +78,7 @@ HTML5 Reset normalize.css v2.1.2 | MIT License | git.io/normalize --------------------------------------------- */ -article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:1em;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} +article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:1em;margin:0}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} /* Box Sizing --------------------------------------------- */ @@ -161,6 +162,7 @@ input[type="reset"], input[type="submit"], textarea:focus, .button { + font-weight: 300; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; @@ -275,13 +277,10 @@ a:hover { .site-inner a { border-bottom: 1px solid #ddd; -} - -.content a { color: #f15123; } -.content a:hover { +.site-inner a:hover { color: #333; } @@ -364,6 +363,12 @@ h2 { clear: both; } +.widget .entry h2 { + margin-bottom: 5px; + margin-bottom: 0.5rem; + font-size: 1em; +} + h3 { font-size: 20px; font-size: 2rem; @@ -410,9 +415,15 @@ textarea, button, .button, .genesis-nav-menu a, -.genesis-nav-menu > .right { - padding: 16px 24px; - padding: 1.6rem 2.4rem; +.nav-primary .genesis-nav-menu > .right, +#subscribe-email input, +div.gform_wrapper input[type="email"], +div.gform_wrapper input[type="text"], +div.gform_wrapper textarea, +div.gform_wrapper .ginput_complex label { + padding: 15px; + padding: 1.5rem; + line-height: 1.25; } input, @@ -426,9 +437,15 @@ textarea { width: 100%; } +input[type="file"] { + padding-left: 0; + padding-right: 0; + border: none !important; + box-shadow: none; +} + input:focus, textarea:focus { - border: 1px solid #999; outline: none; } @@ -445,7 +462,11 @@ button, input[type="button"], input[type="reset"], input[type="submit"], -.button { +body .button { + padding-left: 26px; + padding-right: 26px; + padding-left: 2.6rem; + padding-right: 2.6rem; background-color: #333; border: 1px solid #333; box-shadow: none; @@ -454,13 +475,15 @@ input[type="submit"], text-transform: uppercase; width: auto; border-radius: 3px; + font-weight: normal; + letter-spacing: 0.02em; } button:hover, input:hover[type="button"], input:hover[type="reset"], input:hover[type="submit"], -.button:hover, +body .button:hover, .genesis-nav-menu input[type="submit"] { background-color: #f15123; border-color: #f15123; @@ -481,6 +504,52 @@ input:hover[type="submit"], color: #FFF; } +/* Sidebar Forms, Buttons, & Inputs */ + +.sidebar input, +.sidebar select, +.sidebar textarea, +.sidebar button, +.sidebar .button, +.sidebar .genesis-nav-menu a, +.sidebar .nav-primary .genesis-nav-menu > .right, +.sidebar #subscribe-email input, +.sidebar div.gform_wrapper input[type="email"], +.sidebar div.gform_wrapper input[type="text"], +.sidebar div.gform_wrapper textarea, +.sidebar .gform_wrapper .ginput_complex .ginput_left select, +.sidebar .gform_wrapper .ginput_complex .ginput_right select, +.sidebar .gform_wrapper .ginput_complex .ginput_left, +.sidebar .gform_wrapper .ginput_complex .ginput_right, +.sidebar .gform_wrapper .ginput_complex .ginput_right input[type=text] { + width: 100% !important; + padding: 0.5em; +} + +.sidebar input[type="file"], +.sidebar .gform_wrapper .ginput_complex .ginput_left, +.sidebar .gform_wrapper .ginput_complex .ginput_right { + padding: 0; +} + +.sidebar div.gform_wrapper .gfield_time_hour input, +.sidebar div.gform_wrapper .gfield_time_minute input, +.sidebar div.gform_wrapper .gfield_date_month input, +.sidebar div.gform_wrapper .gfield_date_day input, +.sidebar div.gform_wrapper .gfield_date_year input { + width: 70% !important; +} + +.sidebar div.gform_wrapper li, +.sidebar div.gform_wrapper input[type="button"] + input[type="submit"] { + margin-top: 8px; + margin-top: 0.8rem; +} + +.sidebar label { + font-size: 0.9em; +} + .genesis-nav-menu input[type="submit"]:hover { background-color: #555; border-color: #555; @@ -871,7 +940,7 @@ img.alignright, /* -Widgets +Plugins & Widgets ---------------------------------------------------------------------------------------------------- */ /* Featured Content @@ -896,11 +965,6 @@ Widgets border: none; } - -/* -Plugins ----------------------------------------------------------------------------------------------------- */ - /* Genesis eNews Extended --------------------------------------------- */ @@ -959,9 +1023,9 @@ Plugins margin-bottom: 0; } -.home .ez-home-container-area p:last-child, -.home .ez-home-container-area ul:last-child, -.home .ez-home-container-area ol:last-child { +.home .ez-home-container-area .widget:last-child p:last-child, +.home .ez-home-container-area .widget:last-child ul:last-child, +.home .ez-home-container-area .widget:last-child ol:last-child { margin-bottom: 0; } @@ -973,14 +1037,15 @@ Plugins /* Gravity Forms --------------------------------------------- */ +div.gform_wrapper { + max-width: 100%; +} + div.gform_wrapper input[type="email"], div.gform_wrapper input[type="text"], -div.gform_wrapper textarea, -div.gform_wrapper .ginput_complex label { +div.gform_wrapper textarea { font-size: 16px; font-size: 1.6rem; - padding: 16px; - padding: 1.6rem; } div.gform_wrapper .ginput_complex label { @@ -993,18 +1058,52 @@ div.gform_wrapper form li { margin: 1.6rem 0 0; } +div.gform_wrapper li, +div.gform_wrapper form .gfield_checkbox li { + margin: 0; +} + +div.gform_wrapper ul.gfield_radio li { /* Prevent radio optoin from being cut off by default GF CSS */ + padding-left: 1px !important; +} + div.gform_wrapper .gform_footer input[type="submit"] { font-size: 14px; font-size: 1.4rem; } -/* Jetpack +/* Jetpack - WP Stats --------------------------------------------- */ img#wpstats { display: none; } + +/* Jetpack - Blog Subscriptions +--------------------------------------------- */ + +#jetpack_subscription_widget input, +#subscribe-email input { + width: 100%; +} + +.jetpack_subscription_widget .success { + margin-bottom: 15px; + padding: 15px; + background-color: #DFF7DD; + border: 1px solid #CFE7CD; + color: #7EA57B; +} + +.jetpack_subscription_widget .error { + margin-bottom: 15px; + padding: 15px; + background-color: #FFEDE8; + border: 1px solid #EFDDD8; + color: #F15123; +} + /* FancyBox for Wordpress --------------------------------------------- */ @@ -1024,6 +1123,7 @@ img#wpstats { /* Simple Section Navigation --------------------------------------------- */ + .simple-section-nav .current_page_item > a, .simple-section-nav .current_page_ancestor > a { @@ -1033,6 +1133,91 @@ img#wpstats { font-weight: bold; } +/* Events Manager +--------------------------------------------- */ + +.em-calendar-wrapper { + clear: both; +} + +.em-calendar-wrapper .fullcalendar tbody td { + vertical-align: top; +} + +.em-calendar-wrapper .fullcalendar thead th, +.em-calendar-wrapper .fullcalendar thead td { + display: inline-block; +} + +.em-calendar-wrapper .fullcalendar thead th, +.em-calendar-wrapper .fullcalendar thead td, +.em-calendar-wrapper .fullcalendar .days-names td { + font-weight: bold; + text-align: center; + vertical-align: middle; +} + +.em-calendar-wrapper .fullcalendar thead th, +.em-calendar-wrapper .fullcalendar thead td { + border: none; + width: 10%; +} + +.em-calendar-wrapper .fullcalendar .month_name { + width: 80%; +} + +.em-calendar-wrapper .fullcalendar thead a, +.em-calendar-wrapper .fullcalendar .eventful > a:first-child, +.em-calendar-wrapper .fullcalendar .eventful-post > a:first-child, +.em-calendar-wrapper .fullcalendar .eventful-pre > a:first-child { + border-bottom: none; + text-decoration: none; +} + +.em-calendar-wrapper .fullcalendar tbody { + line-height: 1.2; +} + +.em-calendar-wrapper .fullcalendar tbody tr, +.em-calendar-wrapper .fullcalendar tbody td { + display: block; + width: 100%; + height: auto; +} + +.em-calendar-wrapper .fullcalendar tbody td { + display: block; + border-top-width: 0; +} + +.em-calendar-wrapper .fullcalendar tbody .days-names + tr td:first-child { + border-top-width: 1px; +} + +.em-calendar-wrapper .fullcalendar .days-names td { + display: none; + height: auto; + padding: 1em 0; + background-color: #999; + color: #FFF; + border-color: #666; +} + +.em-calendar-wrapper .fullcalendar ul { + margin: 5px 0px 10px 20px; + margin: 0.5rem 0 1rem 2rem; + font-size: 0.9em; +} + +.em-calendar-wrapper .fullcalendar li { + margin-bottom: .5em; +} + +.em-calendar-wrapper table.fullcalendar tr td a { + text-decoration: none; +} + /* Site Header @@ -1057,8 +1242,8 @@ Site Header .title-area { float: left; font-weight: 700; - padding: 16px 0; - padding: 1.6rem 0; + margin-bottom: 16px; + margin-bottom: 1.6rem; width: 100%; text-align: center; } @@ -1159,7 +1344,6 @@ Site Navigation clear: both; margin: 0; color: #999; - line-height: 1.5; width: 100%; } @@ -1195,11 +1379,6 @@ Site Navigation margin-right: 1.5rem; } -.genesis-nav-menu > .search { - padding: 14px 0 0; - padding: 1.4rem 0 0; -} - /* Sub Navigation --------------------------------------------- */ @@ -1345,12 +1524,30 @@ Site Navigation padding: 0; } -.genesis-nav-menu > .right > .button { - padding: 12px 18px; +.genesis-nav-menu > .right .button, +.genesis-nav-menu > .right .search-form { + margin: -1em 0; color: #FFF; - font-weight: normal; } +.genesis-nav-menu > .right .button, +.genesis-nav-menu > .right input { + display: inline-block; + float: none !important; + width: auto; + padding: 0.6em 1.2em; + border: none; +} + +.genesis-nav-menu > .right .search-form { + display: inline-block; + padding: 0; +} + +.genesis-nav-menu > .right input[type="submit"] { + display: none; + margin: 0 0 0 0.5em; +} /* Sub Menus --------------------------------------------- */ @@ -1402,6 +1599,14 @@ Content Area background-color: #fff; } +.widget .entry, +.bubble .widget .entry { + padding: 0; + margin-bottom: 20px; + margin-bottom: 2rem; + +} + /* Lists inside columns (to remove bottom margin as needed at mobile sizes */ .no-list-margin ul, .no-list-margin ol { @@ -1791,6 +1996,8 @@ Media Queries --------------------------------------------- */ .title-area { + width: auto; + margin-bottom: 0; text-align: left; } @@ -1814,8 +2021,6 @@ Media Queries .site-header .search-form { float: right; - margin-top: 16px; - margin-top: 1.6rem; } .site-header .widget-area { @@ -2042,8 +2247,8 @@ Media Queries .genesis-nav-menu a, .genesis-nav-menu > .right { - padding: 20px; - padding: 2rem; + padding: 16px 20px; + padding: 1.6rem 2rem; } /* Navigation Extras @@ -2060,22 +2265,12 @@ Media Queries margin: 0 0 0 2rem; } - .genesis-nav-menu > .search { - padding: 11px 20px; - padding: 1.1rem 2rem; - } - .genesis-nav-menu > .search form { padding-right: 0; } - - .genesis-nav-menu > .search input { - padding: 10px 20px; - padding: 1rem 2rem; - } - .genesis-nav-menu > .search input[type="submit"] { - display: none; + .genesis-nav-menu > .right input[type="submit"] { + display: inline-block; } /* Sub Menus @@ -2135,6 +2330,34 @@ Media Queries margin-left: -1px; } + /* Plugins + --------------------------------------------- */ + + /* Events Manager */ + .em-calendar-wrapper .fullcalendar tr { + display: table-row !important; + } + + .em-calendar-wrapper .fullcalendar th, + .em-calendar-wrapper .fullcalendar td { + display: table-cell !important; + } + + .em-calendar-wrapper .fullcalendar thead th, + .em-calendar-wrapper .fullcalendar thead td, + .em-calendar-wrapper .fullcalendar .month_name { + width: auto; + } + + .em-calendar-wrapper .fullcalendar tbody td { + width: 14.285714286%; + height: 100px; + } + + .em-calendar-wrapper .fullcalendar tbody td { + border-top-width: 1px; + } + } @media (min-width: 1140px) {