Deep Bot - Twitch Streamer Assistant

Deep Bot => Custom Notifications => Topic started by: emrerocky on September 27, 2014, 02:58:09 PM

Title: Custom Follower Notification Gallery
Post by: emrerocky on September 27, 2014, 02:58:09 PM
Hey folks, this is a little gallery of some different styles of CSS for you to choose from for your notification!

1.

Requested by: mrrugerb

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 460px !important;
height: 240px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/z5tGMuA.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 35px !important;
text-align: center !important;
width: 380px !important;
font-size: 44px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #fdbb30;


}

Preview:
(http://puu.sh/bKt76/0ad32f00e6.jpg)

2.

Requested by: AFS_Smokes

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 100px !important;
border-radius: 0px !important;
background-image: url('http://i1143.photobucket.com/albums/n631/MGC_Smokes/14_zps9f48d697.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 10px !important;
margin-left: 15px !important;
text-align: center !important;
width: 430px !important;
font-size: 32px !important;
font-weight: normal !important;
font-family: Comic Sans MS !important;
color: white !important;
}

Preview:
(http://puu.sh/bx83q/458a0f55df.jpg)

3.

Requested by: gh0sthound

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


CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 950px !important;
height: 265px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/fPkqo5Q.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 180px !important;
text-align: center !important;
width: 600px !important;
font-size: 52px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #00fdbd;


}

Preview:
(http://puu.sh/b1XAc/d40a0069c3.jpg)

4.

Requested by: xxPam

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 440px !important;
height: 160px !important;
border-radius: 1px!important;
background-image: url('http://i.imgur.com/Rx73FLr.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 30px !important;
margin-left: 0px !important;
text-align: center !important;
width: 440px !important;
font-size: 38px !important;
font-weight: normal !important;
font-family: Algerian !important;
color: #FFFFFF !important;
-webkit-text-stroke: 0.5px;
-webkit-text-stroke-color: #000
}

Preview:
(http://puu.sh/b3RIn/ffbbd93953.jpg)

5.

Requested by: dominerar

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 600px !important;
height: 220px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/5L3gkpu.png') !important;
background-repeat: no-repeat !important;
overflow: hidden !important;
}
#follow-notification .followname {
margin-top: 42px !important;
margin-left: 200px !important;
text-align: center !important;
width: 400px !important;
font-size: 48px !important;
font-weight: bold !important;
font-family: Impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 5px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;
}

Preview:
(http://puu.sh/bMxGN/d3e32dabbe.jpg)

6.

Requested by: Taintedh

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 1080
Height: 275

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 1080px !important;
height: 275px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/veKUdJB.png') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 60px !important;
margin-left: 330px !important;
text-align: center !important;
width: 260px !important;
font-size: 26px !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;


}

Preview:
(http://puu.sh/bORBX/3bd76e1f70.jpg)

7.

Requested by: dominerar

Link : http://deepbot.tv/notifications/follownotification.htm
Width: 510
Height: 110

CSS Code:
Code: [Select]
#follow-notification {
position: absolute;
width: 500px !important;
height: 110px !important;
background-color: transparent !important;
border-radius: 0px !important;
background-image: url('http://i5.photobucket.com/albums/y158/adira_tyree/snake/snakebar.jpg') !important;
background-repeat: no-repeat !important;
}
#follow-notification .leftimage {
position: absolute !important;
width: 243px !important;
background-repeat: no-repeat !important;
background-image: url('http://i.giphy.com/nOFWb50JcTgAw.gif') !important;
background-size: 243px !important;
border-radius: 0px !important;
z-index: 0 !important;
}
#follow-notification .followname {
position: absolute !important;
margin-left: 0px !important;
padding-top: 20px !important;
text-align: center !important;
width: 500px !important;
font-size: 32px !important;
font-family: Algerian !important;
text-shadow: 2px 2px 1px #000 !important;
color: #ffffff !important;
}

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

Preview:
(http://puu.sh/bCokE/adeb7d76d8.jpg)

8. 

Requested by: Cuerdas

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 453px !important;
height: 135px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/yMAJt0L.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 35px !important;
margin-left: 50px !important;
text-align: center !important;
width: 450px !important;
font-size: 34px !important;
font-weight: bold !important;
font-family: Algerian !important;
color: #FFFFFF !important;
-webkit-text-stroke: 0.3px;
-webkit-text-stroke-color: #000
}

Preview:
(http://puu.sh/b0uch/14c1214d70.png)

9.

Requested by: PowerwalkXD

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 510
Height: 130

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 125px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/0bPrSEm.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 42px !important;
margin-left: 100px !important;
text-align: center !important;
width: 380px !important;
font-size: 32px !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;


}

Preview:
(http://puu.sh/bLFak/cf6d959642.jpg)

10.

Requested by: Yawn_Gaming

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 600px !important;
height: 145px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/A9waiZn.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 35px !important;
margin-left: 0px !important;
text-align: center !important;
width: 600px !important;
font-size: 38px !important;
font-weight: bold !important;
font-family: Verdana !important;
color: #FF0000 !important;
-webkit-text-stroke: 1px;
-webkit-text-stroke-color: #000
}

Preview:
(http://puu.sh/b1UBZ/60fa8ea106.jpg)

11.

Requested by: MrL3x

Link : http://deepbot.tv/notifications/follownotification.htm
Width: 590
Height: 120

CSS Code:
Code: [Select]
#follow-notification {
position: absolute !important;
width: 590px !important;
height: 120px !important;
background-color: transparent !important;
border-radius: 10px !important;
background-image: url('http://i.imgur.com/uvwaYra.png') !important;
background-repeat: no-repeat !important;
}
#follow-notification .leftimage {
position: absolute !important;
visibility: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-left: 0px  !important;
padding-top: 45px !important;
text-align: center !important;
width: 580px !important;
font-size: 32px !important;
font-family: Algerian !important;
text-shadow: 2px 2px 1px #000 !important;
color: #ffffff !important;
}

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

Preview:
(http://puu.sh/bAZav/ac3e22483d.png)

12.

Requested by: Silent

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 360px !important;
height: 75px !important;
border-radius: 10px;
background-image: url('http://img4.hostingpics.net/pics/533358D3Ticker.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
position: absolute !important;
margin-top: -10px !important;
padding-top: 0px !important;
margin-left: 0px !important;
text-align: center !important;
width: 350px !important;
font-size: 29px !important;
font-weight: normal !important;
font-family: Algerian !important;
color: #f5f214 !important;
-webkit-text-stroke: 0.2px;
-webkit-text-stroke-color: #000
}

Preview:
(http://puu.sh/b8O0w/326ec7065b.jpg)

13.

Requested by: HayZ

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 590px !important;
height: 115px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/7XcUztQ.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 13px !important;
margin-left: 0px !important;
text-align: center !important;
width: 590px !important;
font-size: 42px !important;
font-weight: bold !important;
font-family: Calibri !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #d6d6d6;


}

Preview:
(http://puu.sh/byYai/1b6c0c7afa.jpg)

14.

Requested by: bluemurdergaming

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 1920
Height: 120

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 1920px !important;
height: 120px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/5iDt0tK.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 18px !important;
margin-left: 820px !important;
text-align: center !important;
width: 350px !important;
font-size: 32px !important;
font-weight: bold !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}

Preview:
(http://puu.sh/bFK6Z/9b59737100.jpg)

15.

Requested by: andshelikedit

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 480px !important;
height: 265px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/IdnOn9x.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 88px !important;
margin-left: 35px !important;
text-align: center !important;
width: 400px !important;
font-size: 52px !important;
font-weight: normal !important;
font-family: impact !important;
color: #00cebb !important;
-webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #fdbb30;


}

Preview:
(http://puu.sh/bx7mC/f0519acc50.jpg)

16.

Requested by: red78phoenix

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 510
Height: 160

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 160px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/OCAhhgO.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
margin-top: 55px !important;
margin-left: 0px !important;
text-align: center !important;
width: 500px !important;
font-size: 32px !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;


}

Preview:
(http://puu.sh/bReLM/5625d68cd2.jpg)

17.

Requested by: Hanger84

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 800px !important;
height: 600px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/mjSZPKo.gif') !important;
background-repeat: no-repeat;
background-position-x: center !important;
overflow: hidden !important;

}
#follow-notification .followname {
position: absolute !important;
margin-top: 480px !important;
margin-left: 0px !important;
text-align: center !important;
width: 800px !important;
font-size: 22px !important;
font-family: ethnocentric !important;
color: #00cebb !important;
-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #FFFFFF;


}
#follow-notification .followname:after {
content: ' has boarded The Mothership';
font-family: !important;
}

Preview:
(http://puu.sh/bQC9H/ced28a81c7.png)

18.

Requested by: NexusSin

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 580
Height: 220

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 580px !important;
height: 200px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/6Yd23FN.png') !important;
background-repeat: no-repeat;
}

#follow-notification .followname {
margin-top: 70px !important;
margin-left: 0px !important;
text-align: center !important;
width: 550px !important;
font-size: 60px !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;
}

Preview:
(http://puu.sh/c9WRD/56e832d05d.jpg)

19.

Requested by: koruny

Link : http://deepbot.tv/notifications/follownotification1.htm
Width: 510
Height: 100

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 500px !important;
height: 100px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/vPb8fWu.png') !important;
background-repeat: no-repeat;
}
 
#follow-notification .followname {
margin-top: 24px !important;
margin-left: 0px !important;
text-align: center !important;
width: 500px !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;
}

Preview:
(http://puu.sh/cbilb/7fa5f6847d.jpg)

20.

Requested by: sodopestavi

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 590
Height: 110

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 580px !important;
height: 110px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/GAJEWaz.png') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 21px !important;
margin-left: 0px !important;
text-align: center !important;
width: 580px !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;


}

Preview:
(http://puu.sh/cn03W/7c347b961a.jpg)

21.

Requested by: bond0788

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 384
Height: 135

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 374px !important;
height: 135px !important;
border-radius: 00px !important;
background-image: url('https://i.imgur.com/J27OdG8.jpg') !important;
background-repeat: no-repeat;
overflow: hidden !important;
}
#follow-notification .followname {
position: absolute !important;
margin-top: 0px !important;
margin-left: 0px !important;
text-align: center !important;
width: 380px !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;
}
#follow-notification .followname:before {
content: 'Thanks for Becoming an Agent: ';
font-family: !important;
font-size: 25px !important
}

(http://puu.sh/cqPVa/a49da6eac6.jpg)