#plantedthemes

[htmlqueens]

Hi guys! how can i make the ask box, the follow and dashboard buttons move like "fruihti"? ✔

hey! i don't see her follow & dash buttons moving, but add the following code under or <style type="text/css">

@keyframes shakeee{0% {transform:rotate(7deg); }50% {transform:rotate(-7deg);}70% {transform: scale(.9); }100% {transform: scale(1); }}

@-moz-webkit-keyframes shakeee {0% { -webkit-transform:rotate(7deg); }50% {-webkit-transform:rotate(-7deg); }70% {-webkit-transform: scale(.9); }100% {-webkit-transform: scale(1); }}

@-o-webkit-keyframes shakeee {0% { -webkit-transform:rotate(7deg); }50% {-webkit-transform:rotate(-7deg); }70% {-webkit-transform: scale(.9); }100% {-webkit-transform: scale(1); }}

@-webkit-keyframes shakeee {0% { -webkit-transform:rotate(7deg); }50% {-webkit-transform:rotate(-7deg); }70% {-webkit-transform: scale(.9); }100% {-webkit-transform: scale(1); }}

and then add the following under .popup_block{

-webkit-animation: shakeee 2s;-moz-animation: shakeee 2s;-ms-animation: shakeee 2s;

xoxo, monica

[htmlqueens]

i was wondering how to make a "hover here for ask box" option like r-elaxation

under or

/* hoverforaskbox code */

#hoverforaskbox {display: inline-block;font-size: 30px;line-height: 30px;color: black; text-align: center; border: 3px double black;width: 495px;height: 205px;padding: 3px;overflow: hidden;transition: all 0.1s ease-out;-o-transition-transition: all 1s ease-out;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;}

.hoverhere {margin-top: 50px;opacity: 1;transition: all 1s ease-out;-o-transition-transition: all 1s ease-out;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;}

#hoverforaskbox:hover .hoverhere {margin-top: 10px;opacity: 0;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-ms-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}

.askbox{margin-top: -65px;opacity: 0;transition: all 1s ease-out;-o-transition-transition: all 1s ease-out;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;}

#hoverforaskbox:hover .askbox{opacity: 1;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;-ms-transition: all 1s ease-in-out;transition: all 1s ease-in-out;}

/* hoverforaskbox code */

under the

hover here for askbox

xoxo, monica

[htmlqueens]

how can I take off a image I put as my links hover? I'm trying to find it in my theme but I can't!

it should look something like

background: url('image url');-webkit-text-fill-color: transparent; -webkit-background-clip: text;

xoxo, monica

[htmlqueens]

how do you make your posts 'swivel' in, like h-azei/spahrke and how do you make popups swivel open as well? ✔

under .post { add

-webkit-animation: spin 2s; -moz-animation: spin 2s; -ms-animation: spin 2s;

then under  or  add

@-webkit-keyframes spin { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }}

@-moz-keyframes spin { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }}

@-o-keyframes spin { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }}

@keyframes spin { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); }}

.spin { -webkit-animation-name: spin; -moz-animation-name: spin; -o-animation-name: spin; animation-name: spin;}

under .popup_block { add

-webkit-animation: flip 2s;-moz-animation: flip 2s;-ms-animation: flip 2s;

then under  or  add

@-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1; }}@-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateY(-10deg); } 70% { -moz-transform: perspective(400px) rotateY(10deg); } 100% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1; }}@-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateY(-10deg); } 70% { -o-transform: perspective(400px) rotateY(10deg); } 100% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1; }}@keyframes flip { 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateY(-10deg); } 70% { transform: perspective(400px) rotateY(10deg); } 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; }}

.flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip;}

xoxo, monica

[htmlqueens]

How Can I get my popup to float down kinda like monicas

under the style code add

@-webkit-keyframes floor {0% {opacity: 0;-webkit-transform: translateY(500px);}

100% {opacity: 1;-webkit-transform: translateY(0%);}}

@-moz-keyframes floor {0% {opacity: 0;-webkit-transform: translateY(500px);}

100% {opacity: 1;-webkit-transform: translateY(0%);}}

@-o-keyframes floor {0% {opacity: 0;-o-transform: translateY(500px);}

100% {opacity: 1;-o-transform: translateY(0%);}}

@keyframes floor {0% {opacity: 0;-webkit-transform: translateY(500px);}

100% {opacity: 1;-webkit-transform: translateY(0%);}}

and under .popup_block{ add 

-webkit-animation: floor 1s;-moz-animation: floor 1s;-ms-animation: floor 1s;

xoxo, monica

[htmlqueens]

heeey:) i'd like to have a tab like yours, is there a tutorial? please help and thank you so much for taking the time <3

hey! it’s basically a really edited bubble tab, but here’s the code

under or <style type=”text/css”> or before copy & paste the following code

/* downward tab by monica (uncraized / htmlqueens) */

#tab {

position: fixed;

height: 70px; /*height of how much is showing*/

width: 175px; /*width of the tab (if you change this change the width below too!)*/

top: 15px; /*how far it is from the top*/

left: 15px; /*how far it is from the left*/

text-align: center; /*centers the text*/

font-size: 11px; /*the font size*/

line-height: 15px; /*how far the text is from each other vertically*/

overflow: hidden;

padding: 3px; /*space between content and the borders*/

background: white; /*tab background color*/

color: black; /*tab font color*/

opacity: 0.85;

-webkit-transition-duration: 1.5s; /*how long it takes to go down*/

-moz-transition-duration: 1.5s; /*how long it takes to go down*/

-o-transition-duration: 1.5s; /*how long it takes to go down*/

transition-duration: 1.5s; /*how long it takes to go down*/

overflow: hidden;

z-index: 9999999; /*increase if the tab is behind anything*/

}

#tab:hover {

height: 545px; /*how tall the tab ends up*/

opacity: 0.95;

-webkit-transition-duration: 1.5s; /*how long it takes to go down*/

-moz-transition-duration: 1.5s; /*how long it takes to go down*/

-o-transition-duration: 1.5s; /*how long it takes to go down*/

transition-duration: 1.5s; /*how long it takes to go down*/

}

/* downward tab by monica (uncraized / htmlqueens) */

under

or before copy & paste the following code

put your stuff here

xoxo, monica

[plantedthemes]

Cactus Theme

by Monica (tipsyplant)

preview | code

features: one column (400px wide) ✿ fixed header (max 400px wide) ✿ home(refresh), past (archive), and credit (my blog) links ✿ mailbox (ask & submit)and links (customizable) popups ✿ scroll to top, autoscroll, and stop autoscrolling buttons ✿ energy saving mode (every 35 seconds) ✿

customizable options: two other links ✿ tab title ✿ transparent sidebar ✿ mirrored posts (pictures are reflected horizontally) ✿ faded posts ✿ transparent post background ✿ tooltips ✿ white tumblr buttons ✿ all the links ✿ fireworks ✿ custom cursor ✿ google analytics ✿

uploadable images (optional): background ✿ sidebar background ✿ banner(in the sidebar at the top) ✿ custom favicon ✿

color options for: background ✿ sidebar background ✿ sidebar border ✿ selfie border (& when hovered) ✿ nav links (& when hovered) ✿ description ✿ highlighted text & the highlighted background ✿ post background, borders, links (& when hovered), shadow, and text ✿ permalink background, border, and text ✿ tooltip background, border, and text ✿ scrollbar ✿ fireworks (three options) ✿

[plantedthemes]

Poppy Theme

by Monica (tipsyplant)

preview | code

features: one column (400px wide) ✿ fixed sidebar (max 300px wide) ✿ home (refresh), past (archive), and credit (my blog) links ✿ mailbox (ask & submit) and links (customizable) popups ✿ scroll to top, autoscroll, and stop autoscrolling buttons ✿ energy saving mode (every 35 seconds) ✿

customizable options: two other links ✿ tab title ✿ transparent sidebar ✿ mirrored posts (pictures are reflected horizontally) ✿ faded posts ✿ transparent post background ✿ tooltips ✿ white tumblr buttons ✿ all the links ✿ fireworks ✿ custom cursor ✿ google analytics ✿

uploadable images (optional): background ✿ sidebar background ✿ banner (in the sidebar at the top) ✿ a "selfie" (in a circle either under the banner/title or at the top of the sidebar) (make it a square image) ✿ custom favicon ✿

color options for: background ✿ sidebar background ✿ sidebar border ✿ selfie border (& when hovered) ✿ nav links (& when hovered) ✿ description ✿ highlighted text & the highlighted background ✿ post background, borders, links (& when hovered), shadow, and text ✿ permalink background, border, and text ✿ tooltip background, border, and text ✿ scrollbar ✿ fireworks (three options) ✿