Custom Notification WorkShop

[TheNumbLock]

The built in ones? No, that is the Dev.

The ones from the wiki, that was mostly iiNinetails, but if you need help I can help.

[SurgeMMO]

I was wondering if I can get a full set of custom Notifications? I was hoping a Red Dwarf style?

[TheNumbLock]

I was wondering if I can get a full set of custom Notifications? I was hoping a Red Dwarf style?

If you have the images, I can do the CSS. I am not a graphic artist, just here to do implement any images into notifications.

[SanguineJackal]

I'm sure you're super duper busy, but if you have a few minutes to do a Follow/Host/Gamewisp sub CSS I'd be very much appreciative.

I have two animations (sub and host are the same animation) as GIFs and a custom font. The links on that are strange so let me know if I need to do an alternative!

Code: [Select]

Follower Alert

Image Link: http://imgur.com/RcaJyyr
Font Style/Link: Hyper Light Drifter (Original DL: https://mega.nz/#!6FBmXQhK!ZReRAQmeNcuP7w3n_LJMcejDbb1t2-hISVeBqpvIJ2w    DropboxDL: https://www.dropbox.com/s/dtbppulkdbzpuxv/Hyper%20Light%20Drifter%20Menu%20Text.ttf?dl=0 )
Font Color: #FF69B4
Any text fill/boarder?: No
Where do you want text located? (Follower Name): Centered
Example (If applicable):
Anything else?:

Code: [Select]

Host Alert

Image Link: http://imgur.com/Chs27GR
Font Style/Link: Hyper Light Drifter (Original DL: https://mega.nz/#!6FBmXQhK!ZReRAQmeNcuP7w3n_LJMcejDbb1t2-hISVeBqpvIJ2w    DropboxDL: https://www.dropbox.com/s/dtbppulkdbzpuxv/Hyper%20Light%20Drifter%20Menu%20Text.ttf?dl=0 )
Font Color:#FF69B4
Any text fill/boarder?: No
What do you want the alert to say?(Text Options: Host Name, Amount of Viewers): (Host Name) has brought (Amount of Viewers) adventurers with them!
Example (If applicable):
Anything else?:

Code: [Select]

GameWisp Sub Alert

Image Link:  http://imgur.com/Chs27GR
Font Style/Link: Hyper Light Drifter (Original DL: https://mega.nz/#!6FBmXQhK!ZReRAQmeNcuP7w3n_LJMcejDbb1t2-hISVeBqpvIJ2w    DropboxDL: https://www.dropbox.com/s/dtbppulkdbzpuxv/Hyper%20Light%20Drifter%20Menu%20Text.ttf?dl=0 )
Font Color: #FF69B4
Any text fill/boarder?: No
What do you want the alert to say?(Text Options: Sub Name, Sub months, New Sub, Sub Tier): (Sub Name) has joined the core party for (Sub months) as a (Sub Tier)!
Example (If applicable):
Anything else?:

[TheNumbLock]

Requested by: SanguineJackal

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Width: 1920
Height: 1080

CSS Code:

Code: [Select]

body {
background-color: transparent;
color: white;
}

#follow-notification {
display: none;
position: absolute !important;
top: 0px !important;
left: 0px !important;
width: 1920px !important;
height: 1080px !important;
background-image: url(http://i.imgur.com/RcaJyyr.gif) !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}

#follow-notification .followname {
  margin-left: 500px !important;
  margin-top: 900px !important;
  width: 455px;
  text-align: center;
  line-height: 36px !important;
  font-size: 38px !important;
  font-family: Hyper Drifter Menu Text !important;
  font-weight: bold !important;
  text-shadow: 2px 2px 1px #000 !important;
  text-transform: capitalize !important;
  color: #FF69B4 !important;
  -webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
}

#follow-notification .header {
display: none !important;
}

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



Host:

Link: http://deepbot.tv/notifications/hostnotification.htm?w=1920&h=1080
Width: 1980
Height: 1120

CSS Code:

Code: [Select]

body {
    background-color: transparent;
    color: white;
}

#host-notification {
    top: 0px;
    left: 0px;
    width: 1920px;
    height: 1080px;
    border-radius: 0px !important;
    background-image: url(http://i.imgur.com/Chs27GR.gif) !important;
    background-repeat: no-repeat;
    overflow: hidden !important;
}
#host-notification .hostname {
    margin-top: 700px !important;
    margin-left: 520px !important;
    text-align: center;
    width: 500px !important;
    font-size: 26px !important;
    font-family: Hyper Drifter Menu Text !important;
    font-weight: bold !important;
    text-shadow: 2px 2px #000 !important;
    color: #FF69B4 !important;
    text-transform: capitalize !important;
    -webkit-text-stroke-color: black;
    -webkit-text-stroke-width: 0px;
}
.hostdiv {
    text-align: center;
    vertical-align: middle;
    margin-top: 0px !important;
    margin-left: 2px;
    text-shadow: none !important;
    color: #900020 !important;
    border-radius: 50%;
    width: 500px !important;
    height: 38px;
    line-height: 36px;
    background: #0000;
    border: 0px solid #F00 !important;
    font: 30px Papyrus Regular !important;
    -webkit-transform: rotate(0deg) !important;
}
.hostnumber {
    position: absolute !important;
    margin-top: 840px !important;
    margin-left: 180px !important;
    top: 0 !important;
    font-family: Hyper Drifter Menu Text !important;
    font-weight: normal !important;
    font-size: 26px !important;
    color: #FF69B4 !important;
    text-shadow: 1px 1px #000 !important;
    width: 700px !important;
}
#host-notification .header {
    text-align: center;
    width: 500;
    vertical-align: top;
    font-size: 36px !important;
    line-height: 26px;
    font-family: Arial !important;
    font-weight: bold !important;
    text-shadow: none !important;
    text-decoration: underline;
    color: white !important;
    visibility: hidden;
    padding-top: -50px;
}
.hostname:after {
    content: ' has brought ' !important;
}
.hostnumber:after {
    content: ' adventurers with them!' !important;
}

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



Gamewisp Sub:

Link: http://deepbot.tv/notifications/gwnotification.htm
Width: 1920
Height: 1080

CSS Code:

Code: [Select]

::-webkit-scrollbar {
    visibility: hidden !important;
}

body {
  background-color: transparent;
  color: black;
}
 
#sub-notification {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px !important;
  width: 1920px !important;
  height: 1080px !important;
  background-repeat: no-repeat;
  background-position-y: 0px;
  background-image: url(http://i.imgur.com/Chs27GR.gif) !important;
}
 
#sub-notification .subname {
  margin-left: 400px !important;
  padding-top: 830px !important;
  width: 700px !important;
  text-align: center;
  line-height: 36px !important;
  font-size: 26px !important;
  font-family: Hyper Drifter Menu Text !important;
  font-weight: normal !important;
  text-shadow: 2px 2px 1px #000 !important;
  text-transform: capitalize !important;
  color: #FF69B4 !important;
  -webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
}
 
#sub-notification .subtier {
  position: absolute;
  top: 900px !important;
  margin-left: 630px !important;
  width: 455px;
  text-align: center;
  line-height: 42px !important;
  font-size: 26px !important;
  font-family: Hyper Drifter Menu Text !important;
  font-weight: normal !important;
  text-shadow: 1px 1px #000 !important;
  text-transform: capitalize !important;
  color: #FF69B4 !important;
  -webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
}
 
#sub-notification .submonths {
  position: absolute;
  top: 900px !important;
  margin-left: 420px !important;
  width: 455px;
  text-align: center;
  line-height: 42px !important;
  font-size: 26px !important;
  font-family: Hyper Drifter Menu Text !important;
  font-weight: normal !important;
  text-shadow: 1px 1px #000 !important;
  text-transform: capitalize !important;
  color: #FF69B4 !important;
  -webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
}
 
#sub-notification .newsubmsg {
visibility: hidden !important;
}
 
#sub-notification .submonths::after {
  content: ' months ';
}
 
#sub-notification .newsubmsg::after {
  content: '' !important;
}

#sub-notification .submonths::before{
  content: '';
}

#sub-notification .subname::after {
  content: ' has joined the core party for ' !important;
}

#sub-notification .subtier::before {
  content: ' as a ' !important;
}

#sub-notification .subtier::after {
  content: '!' !important;
}
 
#sub-notification .subamount {
visibility: hidden !important;
}

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

[SanguineJackal]

You are AMAZEBALLS. Thank you so so so much!!!

[grownathome]

Hey! I was wondering if you could help me out with some CSS on a few notifications!

http://imgur.com/a/5r9Xo


There are all of my pictures and the questions you requested that we answer.

[sentinel_infinitus]

i know how busy you must be but i would like it if you could do up a notification for me

Follower Alert

Image Link: http://imgur.com/a/fyNGV
Font Style/Link:
Font Color:red
Any text fill/boarder?:border collor #00fff6
Where do you want text located? (Follower Name):under the image centered
Example (If applicable):
Anything else?:i want it centered

also it would be nice if you did all the alerts too they would use the same infermation

[TheNumbLock]

Requested by: sentinel_infinitus

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 600
Height: 450

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px !important;
left: 100px !important;
width: 250px !important;
height: 250px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url(http://i.imgur.com/1iexz4T.png) !important;
background-repeat: no-repeat;
}

#follow-notification .header {
visibility: hidden !important;
}

#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 240px !important;
margin-left: -20px !important;
width: 300px !important;
font-size: 36px !important;
font-weight: normal !important;
font-family: Arial !important;
color: red !important;
text-transform: capitalize;
-webkit-text-stroke-color: #00fff6;
-webkit-text-stroke-width: 1px;
}

.followname:before {
content: '' !important;
}

.followname:after {
content: ' is now following!' !important;
}

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




Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm?dur=10000
Width: 500
Height: 350

CSS Code:

Code: [Select]

body {
    background-color: transparent;
    color: white;
}
sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}

#donor-notification {
    position: absolute;
    top: 0px;
    left: 100px !important;
    width: 250px !important;
    height: 250px !important;
    background-image: url(http://i.imgur.com/1iexz4T.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
}
#donor-notification .header {
visibility: hidden;
    color: #37b2e5;
    font-size: 38px;
    font-family: Algerian;
}
#donor-notification .streamname {
    float: left;
    visibility: hidden;
}
#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
position: absolute;
margin-top: 250px !important;
margin-left: -250px !important;
width: 300px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 36px !important;
font-family: Arial !important;
color: red !important;
text-transform: capitalize !important;
-webkit-text-stroke-color: #00fff6;
-webkit-text-stroke-width: 1px;
text-shadow: 2px 2px 1px #000 !important;
}
#donor-notification .donor {
position: absolute;
margin-top: 215px !important;
margin-left: -160px !important;
width: 500px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 36px !important;
font-family: Arial !important;
color: red !important;
text-transform: capitalize !important;
-webkit-text-stroke-color: #00fff6;
-webkit-text-stroke-width: 1px;
text-shadow: 2px 2px 1px #000 !important;
}
#donor-notification .title {
    padding-top: 30px;
    width: 100%;
    float: left;
    text-align: center;
}
#donor-notification .messagebox {
    width: 100%;
    text-align: center;
}

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




Host:

Link: http://deepbot.tv/notifications/hostnotification.htm?w=600&h=450
Width: 640
Height: 480

CSS Code:

Code: [Select]

body {
    background-color: transparent;
    color: white;
}
#host-notification {
    top: 0px;
    left: 0px !important;
    width: 300px;
    height: 200px;
    border-radius: 10px;
    background-image: url(http://i.imgur.com/1iexz4T.png) !important;
    background-repeat: no-repeat;
    overflow: hidden;
}
#host-notification .hostname {
    margin-top: 220px !important;
    margin-left: -30px !important;
    text-align: center;
    width: 313px;
    font-size: 36px !important;
    font-family: Arial !important;
    text-shadow: none !important;
    color: red !important;
    -webkit-text-stroke-color: #00fff6;
    -webkit-text-stroke-width: 1px;
    text-transform: capitalize !important;
}
.hostdiv {
visibility: hidden;
}
.hostnumber {
    position: relative;
    top: 11%;
}
#host-notification .header {
    text-align: center;
    width: 500;
    vertical-align: top;
    font-size: 26px;
    line-height: 26px;
    font-family: Arial !important;
    text-shadow: 1px 1px 1px #97A02A;
    text-decoration: underline;
    color: red;
    visibility: hidden;
    padding-top: -50px;
}
.hostname:after {
    content: ' is now hosting!';
}
.hostnum:after {
    content: '';
}

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




GameWisp Sub:

Link: http://deepbot.tv/notifications/gwnotification.htm
Width: 640
Height: 350

CSS Code:

Code: [Select]

::-webkit-scrollbar {
    visibility: hidden !important;
}

body {
  background-color: transparent;
  color: black;
}
 
#sub-notification {
  display: none;
  position: absolute;
  top: 0px;
  left: 150px !important;
  width: 250px !important;
  height: 250px !important;
  background-repeat: no-repeat;
  background-position-y: 0px;
  background-image: url(http://i.imgur.com/1iexz4T.png) !important;
}
 
#sub-notification .subname {
  margin-left: -70px !important;
  padding-top: 250px !important;
  width: 400px !important;
  text-align: center;
  line-height: 36px !important;
  font-size: 36px !important;
  font-family: Arial !important;
  font-weight: normal !important;
  text-shadow: 2px 2px 1px #000 !important;
  text-transform: capitalize !important;
  color: red !important;
  -webkit-text-stroke-color: #00fff6;
-webkit-text-stroke-width: 1px;
}
 
#sub-notification .subtier {
visibility: hidden !important;
}
 
#sub-notification .submonths {
  position: absolute;
  top: 285px !important;
  margin-left: -90px !important;
  width: 455px;
  text-align: center;
  line-height: 42px !important;
  font-size: 36px !important;
  font-family: Arial !important;
  font-weight: normal !important;
  text-shadow: 1px 1px #000 !important;
  text-transform: capitalize !important;
  color: red !important;
  -webkit-text-stroke-color: #00fff6;
-webkit-text-stroke-width: 1px;
}
 
#sub-notification .newsubmsg {
visibility: hidden !important;
}
 
#sub-notification .submonths::after {
  content: ' months ';
}
 
#sub-notification .newsubmsg::after {
  content: '' !important;
}

#sub-notification .submonths::before{
  content: '';
}

#sub-notification .subname::after {
  content: '' !important;
}

#sub-notification .subtier::before {
  content: '' !important;
}

#sub-notification .subtier::after {
  content: '' !important;
}
 
#sub-notification .subamount {
visibility: hidden !important;
}

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

[sentinel_infinitus]

thanks for the help

i would also like to note that the hosting one does not go away for some reason

[TheNumbLock]

thanks for the help

i would also like to note that the hosting one does not go away for some reason

My bad, should have physically tested before giving you the code.

Here is the fixed code (which I fixed in my previous post as well):

Code: [Select]

body {
    background-color: transparent;
    color: white;
}
#host-notification {
    top: 0px;
    left: 0px !important;
    width: 300px;
    height: 200px;
    border-radius: 10px;
    background-image: url(http://i.imgur.com/1iexz4T.png) !important;
    background-repeat: no-repeat;
    overflow: hidden;
}
#host-notification .hostname {
    margin-top: 220px !important;
    margin-left: -30px !important;
    text-align: center;
    width: 313px;
    font-size: 36px !important;
    font-family: Arial !important;
    text-shadow: none !important;
    color: red !important;
    -webkit-text-stroke-color: #00fff6;
    -webkit-text-stroke-width: 1px;
    text-transform: capitalize !important;
}
.hostdiv {
visibility: hidden;
}
.hostnumber {
    position: relative;
    top: 11%;
}
#host-notification .header {
    text-align: center;
    width: 500;
    vertical-align: top;
    font-size: 26px;
    line-height: 26px;
    font-family: Arial !important;
    text-shadow: 1px 1px 1px #97A02A;
    text-decoration: underline;
    color: red;
    visibility: hidden;
    padding-top: -50px;
}
.hostname:after {
    content: ' is now hosting!';
}
.hostnum:after {
    content: '';
}


[SpontaneousJ]

I have some css code that works for my all my alerts through streamlabels, but I want to be able to have the same alert for gamewisp.  When I put the gamewisp link in url
(http://deepbot.tv/notifications/gwnotification.htm) and then my CSS below, it just brings up the deepbot webpage.  Is there something in the css that needs changed to work with this type of integration?

<b style="background: rgba(39,61,53, 0." id="line"><b id="mainText">{name}</b><b id="subText">has just subscribed!</b></b>

body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }html, body {  margin: 0;  padding: 0;}  #widget, #body, #alert-box, #wrap, #alert-text-wrap, #alert-text{  position: relative;  overflow: hidden;  width: 1920px;  height: 1080px;  top: 0;  left: 0;  opacity: 1;}#alert-box.hidden, .hidden {  opacity: 1;}#line {  width: 0;  height: 0;  position: absolute;  top: 400px;  left: 50%;  margin-left: 0;  display: block;  -webkit-transform: rotate(-5deg);          transform: rotate(-5deg);  opacity: 0;  -webkit-animation: lineIn 0.2s .6s forwards,              lineGrow 0.4s 1s forwards,             linehide 0.5s 6.7s forwards;          animation: lineIn 0.2s .6s forwards,              lineGrow 0.4s 1s forwards,             linehide 0.5s 6.7s forwards; }@-webkit-keyframes lineIn {  0% {width: 0; height: 0px;}  100% {width: 2200px; margin-left: -1100px; opacity: 1; height: 3px;}}@keyframes lineIn {  0% {width: 0; height: 0px;}  100% {width: 2200px; margin-left: -1100px; opacity: 1; height: 3px;}}@-webkit-keyframes lineGrow {  0% {}  100% {height: 200px; top: 300px;}}@keyframes lineGrow {  0% {}  100% {height: 200px; top: 300px;}}@-webkit-keyframes linehide {  0% {height: 200px;top: 300px;}  100% {height: 0px; top: 400px;}}@keyframes linehide {  0% {height: 200px;top: 300px;}  100% {height: 0px; top: 400px;}}#mainText {  text-align: center;  font-size: 100px;  width: 2200px;  display: block;  line-height: 100px;  text-indent: -3000px;  position: absolute;  top: 30px;  white-space: nowrap;  opacity: 0;  font-family: "BigNoodleTitling", sans-serif;  font-style: italic;  text-transform: uppercase;  display: block !important;  position: absolute !important;  -webkit-animation: textIn 0.4s 1.4s forwards,             textTravel 4.6s 1.8s linear forwards;          animation: textIn 0.4s 1.4s forwards,             textTravel 4.6s 1.8s linear forwards;}@-webkit-keyframes textIn {  0% {text-indent: -3000px;opacity: 1;}  100% {text-indent: -20px;opacity: 1;} }@keyframes textIn {  0% {text-indent: -3000px;opacity: 1;}  100% {text-indent: -20px;opacity: 1;} }@-webkit-keyframes textTravel {  0% {text-indent: -20px;}  90% {text-indent: 20px;}  95% {text-indent: 3000px;}   100% {text-indent: 3000px;} }@keyframes textTravel {  0% {text-indent: -20px;}  90% {text-indent: 20px;}  95% {text-indent: 3000px;}   100% {text-indent: 3000px;} }#subText {  text-align: center;  font-size: 40px;  width: 2200px;  display: block;  line-height: 40px;  text-indent: 3000px;  position: absolute;  bottom: 30px;  white-space: nowrap;  opacity: 0;  font-family: "BigNoodleTitling", sans-serif;  font-style: italic;  text-transform: uppercase;  display: block !important;  position: absolute !important;  -webkit-animation: tagIn 0.4s 1.4s forwards,             tagTravel 4.6s 1.8s linear forwards;          animation: tagIn 0.4s 1.4s forwards,             tagTravel 4.6s 1.8s linear forwards;}@-webkit-keyframes tagIn {  0% {text-indent: 3000px;opacity: 1;}   100% {text-indent: 20px;opacity: 1;} }@keyframes tagIn {  0% {text-indent: 3000px;opacity: 1;}   100% {text-indent: 20px;opacity: 1;} }@-webkit-keyframes tagTravel {  0% {text-indent: 20px;}  90% {text-indent: -20px;}  95% {text-indent: -3000px;}   100% {text-indent: -3000px;}}@keyframes tagTravel {  0% {text-indent: 20px;}  90% {text-indent: -20px;}  95% {text-indent: -3000px;}   100% {text-indent: -3000px;} }

[TheNumbLock]

Well there is a layout/guide to follow. So you would have to put your CSS into the one below. May have to overwrite some of the lines and add !important; at the end so it takes effect.

http://wiki.deepbot.tv/widgets#gamewisp_notification

Code: [Select]

body {
  background-color: transparent;
  color: black;
}
 
#sub-notification {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 670px;
  height: 200px;
  background-repeat: no-repeat;
  background-position-y: 0px;
  background-image: url(http://deepbot.tv/notifications/images/gwnotice.png);
}
 
#sub-notification .subname {
  margin-left: 150px;
  padding-top: 30px;
  width: 455px;
  text-align: center;
  line-height: 14px;
  font-size: 32px;
  font-family: Verdana;
  text-shadow: 2px 2px 1px #FFF;
  text-transform: uppercase;
  color: ##FF0000;
}
 
#sub-notification .subtier {
  position: absolute;
  top: 53px;
  margin-left: 75px;
  width: 380px;
  text-align: left;
  line-height: 14px;
  font-size: 34px;
  font-family: Algerian;
  text-shadow: 2px 2px 1px #F00;
  color: ##FF0000;
}
 
#sub-notification .submonths {
  position: absolute;
  top: 65px;
  margin-left: 150px;
  width: 455px;
  text-align: center;
  line-height: 14px;
  font-size: 30px;
  font-family: Calibri;
  text-shadow: 1px 1px 1px #000;
  color: ##FF0000;
}
 
#sub-notification .newsubmsg {
  position: absolute;
  top: 65px;
  margin-left: 150px;
  width: 455px;
  text-align: center;
  line-height: 14px;
  font-size: 30px;
  font-family: Calibri;
  text-shadow: 1px 1px 1px #000;
  color: ##FF0000;
}
 
#sub-notification .submonths::after {
  content: " Months!";
}
 
#sub-notification .newsubmsg::after {
  content: "New Sub!";
}
 
#sub-notification .subamount {
  font-family: 'Vollkorn', serif;
  font-size: 28px;
  line-height: 20px;
  text-transform: uppercase;
  font-weight: bold;
  color: red;
  border: 7px solid rgba(255, 0, 0, 0.5);
  float: left;
  padding: 10px 7px;
  border-radius: 10px;
  opacity: 0.8;
  -webkit-transform: rotate(-25deg);
  -o-transform: rotate(-25deg);
  -moz-transform: rotate(-25deg);
  -ms-transform: rotate(-25deg);
  position: absolute;
  top: 20%;
  left: 80%;
}


[SpontaneousJ]

Well there is a layout/guide to follow. So you would have to put your CSS into the one below. May have to overwrite some of the lines and add !important; at the end so it takes effect.

http://wiki.deepbot.tv/widgets#gamewisp_notification

Thanks for the reply, I will look into it!

[hoenens]

Hello, can you make myn also?


Donation:
Image link: http://i.imgur.com/9CRkCnI.png
Font Style/Link: Impact
Font Color:n White
Any text fill/boarder?:Black
Currency Type: €
What do you want the alert to say?(Text Options: Donator Name, Donation Amount, Message): Name and amount in the gray area centered
Example (If applicable):
Anything else?: That's all.

This is what i use in my follow notification, maye you can make it so that it matches as good as possible?
#follow-notification {
   display: none;
   position: absolute;
   top: 0px;
   left: 0px;
   width: 500px !important;
   height: 100px !important;
   border-radius: 00px !important;
   background-image: url(URLURLURL) !important;
   background-repeat: no-repeat;
}
 
#follow-notification .followname {
   margin-top: 24px !important;
   margin-left: 0px !important;
   text-align: center !important;
   width: 450px !important;
   font-size: 40px !important;
   font-weight: bold !important;
   font-family: impact !important;
   color: #00cebb !important;
   -webkit-text-stroke-width: 2px;
   -webkit-text-stroke-color: #000000;
   -webkit-text-fill-color: #FFFFFF;
}

Thanks allot!