How to Disable Animations?

Started by fox_mulder,

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

fox_mulderTopic starter

Something should be an option in settings or else it is forcing new design options that users didn't get to vote on. Thank you.
  •  

Marius P.

That is super easy, just open the css file https://github.com/PHPVibe/PHPVibe-CMS/blob/master/themes/main/styles/phpvibe.css
and using the search (usually ctrl + f) look for definitions that start with animation: and remove the line.
But, be careful to not remove animations that the site actually needs (like loaders and so).

Clear the cache from the admin panel once you're done.
Happy with my help? Buy me a coffee.
Please, always use the search before opening a new topic! We're all here on our (limited) free time! Make sure you help yourself too!
  •  
    The following users thanked this post: fox_mulder

fox_mulderTopic starter

#2
Life is short. I have spent about a half an hour trying to remove animations. You say it's "Super easy" not "easy" but "Super easy". Perhaps you or anyone reading this could provide some guidance especially if you have beeen successful

The animation is probably just as annoying as me asking how to remove it but my attempts at "Super easy" have not been sucessful and I am using incognito mode after making changes.

So, so frustrating.
  •  

Marius P.

Bro, you should start learning the basics https://www.w3schools.com/css/css3_animations.asp , this way you'll spend better half hours in the future.

See this image item:

.image-item {
  position: relative;
  display: inline-block;
  float: left;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: translateZ(400px) translateY(300px) rotateX(-90deg);
  transform: translateZ(400px) translateY(300px) rotateX(-90deg);
  -webkit-animation: fallPerspective 0.8s ease-in-out forwards;
  animation: fallPerspective 1.4s ease-in-out forwards;
  margin: 10px 10px 10px 0;
}

the animation part:

 
-webkit-animation: fallPerspective 0.8s ease-in-out forwards;
  animation: fallPerspective 1.4s ease-in-out forwards;

Or maybe just remove this

/* animate.css -http://daneden.me/animate Copyright (c) 2016 Daniel Eden */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

But this may cause issues (not sure, my bet is on no problem), try and see.
Happy with my help? Buy me a coffee.
Please, always use the search before opening a new topic! We're all here on our (limited) free time! Make sure you help yourself too!
  •  
    The following users thanked this post: fox_mulder

fox_mulderTopic starter

Didn't work for me and not because of lack of trying. Maybe it's just me because currently I cannot access admin dashboard and icons are not visible just squares.

I would be happy to do a video to demonstrate correct installation but it's surprising me the 2018 version was easier to install and work with. I have to go to work at 9am and didn't get much sleep trying to figure this out I am sorry to say. This is becoming its own job on my day off.  I am a technical person. I know how to use FTP, edit files, refresh and use incognito mode. etc.

Has anyone been able to Disable Animations. Anyone?

Anyone?

If so, can you tell me what you did? Did you do what Marius suggested and did that resolve the problem? This post has been viewed 246 times, so it seems there is some interest in this topic and possible solution.
  •  

fox_mulderTopic starter

Ran everything on localhost installation. Updated the CSS and it still doesn't work. I don't think it has to do with learning the basics of css3naviagtions.

I hate to be the person who doesn't try something before asking a question so when I said I spent a half an hour it's because I want to make sure I am not doing something wrong.

I would ask you to do the same. Did you get it to work? When you say "maybe" and "bet" it didn't sound like you were sure it was going to work but you were more sure that I should study css3.😂

This issue is now like a bedbug or lyme tick. I don't know who asked for animations, but this should have been an optional feature or on a separate theme. It is now like Chinese water torture every time I visit the site.
  •  

Marius P.

Did you clear cache and rebuild js/css files from the admin panel?

I haven't tested, true, I'm working on a new PHPVibe, something that's not a Youtube clone, and I haven't touched this version since a few months back.
Happy with my help? Buy me a coffee.
Please, always use the search before opening a new topic! We're all here on our (limited) free time! Make sure you help yourself too!
  •  
    The following users thanked this post: fox_mulder

Marius P.

Find this
.material-symbols-outlined, .material-icons {
    font-family: "Material Icons";
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "liga";
    animation: 0.6s linear 0s materialswap;
}

Remove

animation: 0.6s linear 0s materialswap;


PHPVibe-CMS\themes\main\styles\materialicons.css

Then refresh cache in the admin panel and in the browser.

This will remove the animations in the material icons.
Happy with my help? Buy me a coffee.
Please, always use the search before opening a new topic! We're all here on our (limited) free time! Make sure you help yourself too!
  •  
    The following users thanked this post: fox_mulder

Similar topics (1)