Several useful items ⇒ headerbar slide top

[TRUBLITZ]

Slide-Top

Add some movement to your style. In this example we will slide the headerbar, and slide it upwards (top).

Demo: - you can peek at my headerbar, i current have this installed.

Open: - Your last loading css file. (not responsive) and add,

CSS

Code: Select all

@keyframes slide-top {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
    opacity: 1;
  }
}

Find:

Code: Select all

.headerbar

After Add:

Code: Select all

    webkit-animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
    animation: slide-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
    

save, upload, dump your cache.

Yes, you can add this code to navbar, forumbg, forabg etc.. add just like you added to headerbar.

If you add this to forumbg, add this to your css, it will add some margin bottom to the action bar

Code: Select all

.action-bar {
    margin: 8px 0;
}

[martin]

Put it in a ext since 3.1 ppl dont care for edits any more.

[TRUBLITZ]

Wish i knew how.. Im a 3d modeler and stylist, i dont know jack about php or how to make exts. Wish i did. Feel free

[martin]

I have it in ext now.

Take it and rename it.
removed.

[TRUBLITZ]

No shit huh? Nice! No need to rename it thou you did it! Nice job man!

[martin]

Simple one change my name to yours in all files and board links.

[dmzx]

[Wesleyw3zep]

Which .css file do i need to edit?

utilities.css ?

[martin]

I'l put it back into an ext if you want. Edits are a thing of the passed.

https://www.youtube.com/watch?v=3k_3mJd ... b-test.com

[Wesleyw3zep]

Hello, ok that would be great