Custom notification follow & donation

[SteffenL]

Hi

i would like this as a follow and donation alert (same picture)
follow says: @user@, Thanks for the follow you dawG!
donation: $@amount@ donation received from @user@. @message@

EDIT: i did attach the file, but i cant seem to find it myself, so here is uploaded version: http://i62.tinypic.com/wvyk3a.png

Thanks alot

Kind regards
SL

[TheNumbLock]

Requested by: SteffenL

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 840
Height: 300

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
width: 840px !important;
height: 250px !important;
border-radius: 00px !important;
background-image: url('http://oi62.tinypic.com/wvyk3a.jpg') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 70px !important;
margin-left: 270px !important;
width: 500px !important;
font-size: 26px !important;
font-weight: normal !important;
font-family: Impact !important;
color: #ffffff !important;
text-transform: capitalize;
-webkit-text-fill-color: white;
-webkit-text-stroke-color: white;
-webkit-text-stroke-width: 0px;
}

.followname:after {
content: ', Thanks for the follow you dawG!';
}

Preview: (If there is a black background, it is just my background.)




Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 840
Height: 300

CSS Code:

Code: [Select]

#donor-notification {
width: 840px !important;
height: 250px !important;
background-color: transparent !important;
background-image:url('http://oi62.tinypic.com/wvyk3a.jpg') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}
 
#donor-notification .header {
visibility: hidden !important;
}
 
#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .date {
visibility: hidden !important;
}
 
#donor-notification .message {
position: absolute !important;
margin-top: 105px !important;
margin-left: 210px !important;
width: 600px !important;
font-size: 22px !important;
font-weight: normal !important;
font-family: impact !important;
text-transform: capitalize;
color: white !important;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
text-shadow: 2px 1px 6px black;
}
#donor-notification .amount {
position: absolute !important;
margin-top: 50px !important;
margin-left: -350px !important;
width: 400px !important;
font-size: 26px !important;
font-weight: normal !important;
font-family: impact !important;
text-transform: capitalize;
color: white !important;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
text-shadow: 2px 1px 6px black;
}
#donor-notification .donor {
position: absolute !important;
margin-top: 50px !important;
margin-left: 280px !important;
width: 200px !important;
font-size: 26px !important;
font-weight: normal !important;
font-family: impact !important;
text-transform: capitalize;
color: white !important;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
text-shadow: 2px 1px 6px black;
}

.amount:after {
content: ' donation received from ';
}

Preview: (If there is a black background, it is just my background.)

[SteffenL]

Thanks alot! looks awesome.

one question tho, can i keep using the URL you linked, or do i have to upload the CSS anywhere my self?

Thanks in advance !

[TheNumbLock]

Thanks alot! looks awesome.

one question tho, can i keep using the URL you linked, or do i have to upload the CSS anywhere my self?

Thanks in advance !

In the CSS Tab of the CLR Browser Properties

[SteffenL]

i can't seem to get it to work, when i use the CSS tab and put in the CSS code, nothing shows up.
Do you have a video guide or are you able to help me thru Teamviewer or something?

Thanks in advance
SL

[TheNumbLock]

I can do teamviewer. Just PM me your details.

[SteffenL]

send