• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Some CSS code in Genesis that I don't understand

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Some CSS code in Genesis that I don't understand

This topic is: not resolved

Tagged: Animation, css3, fluff, genesis theme css, transition

  • This topic has 2 replies, 2 voices, and was last updated 6 years, 1 month ago by endolil.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • May 16, 2016 at 6:34 am #185699
    endolil
    Participant

    Hi there,

    I just came across some CSS code in the Genesis theme that I don't quite understand in its purpose.

    a,
    input:focus,
    input[type="button"],
    input[type="reset"],
    input[type="submit"],
    textarea:focus,
    .gallery img {
    	-webkit-transition: all 0.1s ease-in-out;
    	-moz-transition:    all 0.1s ease-in-out;
    	-ms-transition:     all 0.1s ease-in-out;
    	-o-transition:      all 0.1s ease-in-out;
    	transition:         all 0.1s ease-in-out;
    }

    Could possible somebody here enlighten me?
    I mean I understand that this is CSS3 and related to some effects that are applied to probably :hover rules or something but why is this a kinda standard for all these elements in Genesis. What does it do and why is it "good"?
    Or is it just some fluff that I can delete and the difference will not even be noticeable?

    Warm regards,
    Sebastian

    May 16, 2016 at 7:05 am #185700
    brock
    Member

    I don't know what theme you are using but they are CSS transitions. You can read more about them and see examples here. I think they are creating a gliding effect on form elements, links, and images within a gallery somewhere. After you see some examples on that link, I'm sure you can spot them. Their purpose is aesthetic. I hope this helps a little.

    May 16, 2016 at 8:54 am #185702
    endolil
    Participant

    Thanks Brock,

    the keywords were " Their purpose is aesthetic." ...
    I think so. It makes sense.

    I am building my own theme based on Genesis and I don't need these little extras since I started using AnimateCSS, which is really cool, especially in combination with jQuery (events).

    So I will just delete this fluff from my child's theme style.css and save some bytes. 😀

    Thanks again!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2022 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble