askwpgirl

/**
 * Changes Past Event Reverse Chronological Order
 *
 * @param array $template_vars An array of variables used to display the current view.
 *
 * @return array Same as above. 
 */
function tribe_past_reverse_chronological_v2( $template_vars ) {
 
  if ( ! empty( $template_vars['is_past'] ) ) {

askwpgirl

/* -- Changing the menu background on scroll effect -- */

.elementor-sticky--effects {
   background: #3E3EF5!important; /* change the background color here*/
}

.elementor-sticky--effects .sticky-menu ul li a /* change the menu text color here*/ {
   color: #fff!important;
}

askwpgirl

/* Custom button style */

.button-white-outline .elementor-button {
	border: 1px solid #fff;
	color: #fff !important;
	background: transparent !important;
}

.button-white-outline .elementor-button:hover {
	border: 1px solid #AE5900;

askwpgirl

/* Ideally, you will want to have hyperlinks underlined in body copy but remove the underline
   on hover to indicate something has changed. 
*/

.site-content .elementor-widget-text-editor a, 
.elementor-widget-theme-post-content a {
  border-bottom: 1px solid #333333; /* change color as desired */
}

.site-content .elementor-widget-text-editor a:hover,

askwpgirl

/* If you are using https://wordpress.org/plugins/accessibility-new-window-warnings/, 
   the external link icons can look funny or output on items you don't want them to. 
   The following CSS can be adjusted as needed to format or hide these new window icons.
 */
 
 /* Hide external link icon on social media icons in Elementor */
 
 .elementor-social-icon .anww-external-link-icon {
    text-indent: -2000px;
    width: 0;

askwpgirl

// Add this to Code Snippets plugin Javascript snippet

// This sets tabindex to -1 so that keyboard navigation skips over the image link

jQuery(document).ready(function () {
	
    setTabindex('.elementor-post__thumbnail__link', '-1')

    function setTabindex(selector, tabindex) {
        var links = jQuery(selector);

askwpgirl

/* Add this CSS to your child theme or Appearance > Customize and choose Elementor Full Width for the page template */

.elementor-template-full-width .site-inner>.wrap {
    max-width: none;
}

.elementor-template-full-width #main {
    padding: 0;
}

askwpgirl

/* Add this CSS to the Advanced tab > Custom CSS section of the Container containing the background video 
   This solution was proposed here: https://github.com/elementor/elementor/issues/1644#issuecomment-1125174378
*/ 

selector iframe {
  opacity: 1;
  animation-name: fadeInOpacity;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-duration: 1.75s;

askwpgirl

<?php

// See https://developer.wordpress.org/reference/functions/add_image_size/ for reference. 
// Also https://bloggerpilot.com/en/disable-wordpress-image-sizes/ 
// Note: You must regenerate thumbnails for new image sizes to be generated. Use Rengenerate Thumbnails plugin.

// Copy the code below into a new snippet using Code Snippets plugin

// Add all new image sizes for the site here, examples:

askwpgirl

/* See https://www.loom.com/share/eb7a5707d8b44038bde7886e3902ec11?sid=383b1a08-b755-4544-b372-446303907c48 for demo 
   See screeshot for HTML markup exmaple. This demo uses a custom loop. 
   https://www.evernote.com/shard/s20/sh/58ecb810-ad20-4b7c-84ac-17bb1dc94131/nliYiy0GKhDSkf-C-qOJUtYEymkTimGaVNc1PG_qaDajEPBuQPKBVSZGsA
*/

/* You can place this code under Appearance > Customize or in your child theme's style.css file */

/* category-blue, category-red, category-green are the names of the categories. 
   If your category name is "breakfast" then you would use category-breakfast instead.