Author Topic: Custom Notification WorkShop  (Read 263298 times)

0 Members and 1 Guest are viewing this topic.

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #255 on: February 04, 2016, 11:46:03 AM »
Would it be possible to get CSS for follower and donation? I can do the images myself, or would you need them as well?

Well I would need the images in order to place everything on the image. But you can get the CSS here: http://deepbot.deep.sg/wiki/Custom+CSS
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

bittenbytheblade

  • Youngling
  • *
  • Posts: 3
  • Karma: +0/-0
    • View Profile
  • Twitch Name: bittenbytheblade
Re: Custom Notification WorkShop
« Reply #256 on: February 09, 2016, 02:14:52 AM »
Follower Alert

Image Link: http://imgur.com/4bYKOsJ
Font Style/Link: Brittanic Bold
Font Color: Blue
Any text fill/border?: No
Where do you want text located? (Follower Name): Centered on image
Example (If applicable):
Anything else?:

Donation Alert

Image Link: http://imgur.com/50m7XsP
Font Style/Link: Brittanic Bold
Font Color: Blue
Any text fill/border?: No
Currency Type: USD
Where do you want text located?(Donator Name, Donation Amount, Message) all in center of image
Example (If applicable): Viewer_Name donated $20.00 thank you for a good stream!
Anything else?:

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #257 on: February 09, 2016, 03:14:46 AM »
Requested by: bittenbytheblade

Follower:

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
left: 0px !important;
width: 1239px !important;
height: 270px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url('http://i.imgur.com/4bYKOsJ.png') !important;
background-repeat: no-repeat;

}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 80px !important;
margin-left: 400px !important;
width: 400px !important;
font-size: 50px !important;
font-weight: bold !important;
font-family: Brittanic !important;
color: gold !important;
text-transform: capitalize;
-webkit-text-fill-color: Blue;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
text-shadow: 10px white !important;
}
 
.followname:before {
content: '' !important;
color: white !important;
-webkit-text-fill-color: white;
}

.followname:after {
content: '' !important;
color: white !important;
-webkit-text-fill-color: white;
}

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




Donation:

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

CSS Code:
Code: [Select]
#donor-notification {
position: absolute;
top: 0px !important;
left: 0px !important;
width: 1239px !important;
height: 300px !important;
background-repeat: no-repeat;
background-size: contain !important;
background-image: url('http://i.imgur.com/50m7XsP.png') !important;
overflow: ahidden !important;
}
#donor-notification .header {
visibility: hidden !important;
}

#donor-notification .date {
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
position: absolute;
margin-top: 120px !important;
margin-left: 220px !important;
width: 800px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 24px !important;
font-family: Brittanic !important;
color: blue !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
#donor-notification .amount {
position: absolute;
margin-top: 60px !important;
margin-left: -170px !important;
width: 400px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 30px !important;
font-family: Brittanic !important;
color: blue !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
#donor-notification .donor {
position: absolute;
margin-top: 60px !important;
margin-left: -290px !important;
width: 600px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 30px !important;
font-family: Brittanic !important;
color: blue !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}

.donor:after {
content: ' donated';
}

.amount:after {
content: '';
}

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

Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Mak

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: MakToGo
Re: Custom Notification WorkShop
« Reply #258 on: February 19, 2016, 01:58:08 AM »
Donation Alert: (You do not need to include all 3 text options, Just an FYI.)
Code: [Select]
Donation Alert

Image Link: http://imgur.com/64PXfRh
Font Style/Link: Segoe UI
Font Color: White
Any text fill/boarder?:
Currency Type: EUR (€)
Where do you want text located?(Text Options: Donator Name, Donation Amount, Message)
Example (If applicable): @user@ - @amount@ : @message@
Anything else?: -
« Last Edit: February 19, 2016, 03:45:25 AM by Mak »

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #259 on: February 19, 2016, 04:08:50 AM »
Requested by: Mak

Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 1280
Height: 100

CSS Code:
Code: [Select]
#donor-notification {
position: absolute;
top: 0px !important;
left: 0px !important;
width: 1280px !important;
height: 50px !important;
background-repeat: no-repeat;
background-size: contain !important;
background-image: url('http://i.imgur.com/64PXfRh.png') !important;
overflow: ahidden !important;
}
#donor-notification .header {
visibility: hidden !important;
}

#donor-notification .date {
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
position: absolute;
margin-top: -5px !important;
margin-left: 520px !important;
width: 600px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 20px !important;
font-family: Segoe UI !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
#donor-notification .amount {
position: absolute;
margin-top: -30px !important;
margin-left: -500px !important;
width: 400px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 30px !important;
font-family: Segoe UI !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
#donor-notification .donor {
position: absolute;
margin-top: -30px !important;
margin-left: -590px !important;
width: 600px !important;
text-align: center !important;
font-weight: bold !important;
font-size: 30px !important;
font-family: Segoe UI !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: blue;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}

.donor:after {
content: ' - ';
}

.amount:after {
content: ' : ';
}

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

Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

ShiroKoN

  • Youngling
  • *
  • Posts: 2
  • Karma: +0/-0
    • View Profile
  • Twitch Name: ShiroKoN
Re: Custom Notification WorkShop
« Reply #260 on: March 06, 2016, 03:07:11 AM »
Follower Alert

Image Link: http://imgur.com/0z3oJb0
Font Style/Link: http://www.1001fonts.com/revolution-italic-font.html
Font Color:white
Any text fill/boarder?:none
Where do you want text located? (Follower Name):under the animation
Example (If applicable):
Anything else?:@user@ become a Pirate!

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #261 on: March 06, 2016, 03:22:45 AM »
Requested by: ShiroKoN

Follower:

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

CSS Code:
Code: [Select]
@font-face {
font-family: 'Revo';
src: url('https://fs05n4.sendspace.com/dl/5e13335a3d4bee560bd790ceba498739/56ddecb33d4f6e25/slhoil/REVOLUTIONItalic.ttf');
}

#follow-notification {
display: none;
position: absolute;
left: 100px !important;
width: 150px !important;
height: 150px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/0z3oJb0.gif') !important;
background-repeat: no-repeat;

}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 120px !important;
margin-left: -80px !important;
width: 300px !important;
font-size: 30px !important;
font-weight: italic !important;
font-family: Revo !important;
color: green !important;
text-transform: capitalize;
-webkit-text-fill-color: white;
-webkit-text-stroke-color: green;
-webkit-text-stroke-width: 0px;
text-shadow: 10px white !important;
}
 
.followname:before {
content: '' !important;
}

.followname:after {
content: ' became a Pirate!' !important;
}

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

« Last Edit: March 08, 2016, 05:04:47 AM by RepentGamingTV »
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Wolfstreet Gaming

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Wolfstreet Gaming
Re: Custom Notification WorkShop
« Reply #262 on: March 19, 2016, 05:14:15 AM »
Donation Alert:

Image Link: My logo and Overlay so you can see my color scheme Logo: http://imgur.com/LEWLOQD Overlay: http://imgur.com/9wvNDZc
Font Style/Link: something that goes with my theme preferabbly
Font Color: white/red or either/or
Any text fill/boarder?:
Currency Type: $USD
Where do you want text located? (donator name) has donated (amount)! Thank you for supporting the Wolf Pack!
Example (If applicable):
Anything else?: minimalistic

Follower Alert:

Image Link: My logo and Overlay so you can see my color scheme Logo: http://imgur.com/LEWLOQD Overlay: http://imgur.com/9wvNDZc
Font Style/Link: something that goes with my theme preferably
Font Color: white/red or either/or
Any text fill/boarder?:
Where do you want text located? (follower name) has joined the Wolf Pack!
Example (If applicable):
Anything else?: minimalistic

Thank you very much for all that you do! I looked through all of your custom notifications and they all are great! Mad respect!

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #263 on: March 20, 2016, 10:40:34 AM »
Let me know if you want anything changed. The Font I used and you need to install: http://www.dafont.com/coalition.font

Requested by: Wolfstreet Gaming

Follower:

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
left: 0px !important;
width: 250px !important;
height: 250px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url('http://i.imgur.com/dzmRup2.png') !important;
background-repeat: no-repeat;

}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 20px !important;
margin-left: 250px !important;
width: 500px !important;
font-size: 36px !important;
font-weight: normal !important;
font-family: Coalition !important;
color: green !important;
text-transform: capitalize;
-webkit-text-fill-color: white;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 10px white !important;
}
 
.followname:before {
content: '' !important;
}

.followname:after {
content: ' has joined the Wolf Pack!' !important;
}

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




Donation:

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

CSS Code:
Code: [Select]
#donor-notification {
position: absolute;
top: 0px !important;
left: 0px !important;
width: 250px !important;
height: 250px !important;
background-repeat: no-repeat;
background-size: contain !important;
background-image: url('http://i.imgur.com/dzmRup2.png') !important;
overflow: ahidden !important;
}
#donor-notification .header {
visibility: hidden !important;
}

#donor-notification .date {
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
position: absolute;
margin-top: 80px !important;
margin-left: 50px !important;
width: 500px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 30px !important;
font-family: Coalition !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 3px !important;
}
#donor-notification .donor {
position: absolute;
margin-top: 0px !important;
margin-left: 220px !important;
width: 500px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 30px !important;
font-family: Coalition !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 3px !important;
}

.donor:after {
content: ' has donated ' !important;
}

.amount:after {
content: ' ! Thank you for supporting the Wolf Pack!' !important;
}

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

« Last Edit: March 22, 2016, 07:54:24 AM by RepentGamingTV »
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Wolfstreet Gaming

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Wolfstreet Gaming
Re: Custom Notification WorkShop
« Reply #264 on: March 21, 2016, 12:26:38 AM »
Let me know if you want anything changed. The Font I used and you need to install: http://www.dafont.com/coalition.font

Requested by: Wolfstreet Gaming

Follower:

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
left: 0px !important;
width: 250px !important;
height: 250px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url('http://i.imgur.com/LEWLOQD.png') !important;
background-repeat: no-repeat;

}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 20px !important;
margin-left: 250px !important;
width: 500px !important;
font-size: 36px !important;
font-weight: normal !important;
font-family: Coalition !important;
color: green !important;
text-transform: capitalize;
-webkit-text-fill-color: white;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 10px white !important;
}
 
.followname:before {
content: '' !important;
}

.followname:after {
content: ' has joined the Wolf Pack!' !important;
}

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




Donation:

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

CSS Code:
Code: [Select]
#donor-notification {
position: absolute;
top: 0px !important;
left: 0px !important;
width: 250px !important;
height: 250px !important;
background-repeat: no-repeat;
background-size: contain !important;
background-image: url('http://i.imgur.com/LEWLOQD.png') !important;
overflow: ahidden !important;
}
#donor-notification .header {
visibility: hidden !important;
}

#donor-notification .date {
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
position: absolute;
margin-top: 80px !important;
margin-left: 50px !important;
width: 500px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 30px !important;
font-family: Coalition !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 3px !important;
}
#donor-notification .donor {
position: absolute;
margin-top: 0px !important;
margin-left: 220px !important;
width: 500px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 30px !important;
font-family: Coalition !important;
color: white !important;
text-transform: capitalize;
-webkit-text-stroke-color: red;
-webkit-text-stroke-width: 0.1px;
text-shadow: 3px !important;
}

.donor:after {
content: ' has donated ' !important;
}

.amount:after {
content: ' ! Thank you for supporting the Wolf Pack!' !important;
}

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



I should have done this prior but is there anyway to crop my logo to just the circle emblem? I really appreciate this and thank you very much!!! The font is exactly the one I use and I am stoked you found it because I could not find it on DA fonts again the other day! Awesome work:)

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Custom Notification WorkShop
« Reply #265 on: March 21, 2016, 02:14:38 AM »
I may be able to photoshop it. Do you want the background in the circle, or just WSG and the circle?
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Wolfstreet Gaming

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Wolfstreet Gaming
Re: Custom Notification WorkShop
« Reply #266 on: March 22, 2016, 12:07:49 AM »
I may be able to photoshop it. Do you want the background in the circle, or just WSG and the circle?

Still want the circle if possible just don't want the excess background around the circle. Thanks in advance!

SunshineKid

  • Youngling
  • *
  • Posts: 2
  • Karma: +0/-0
    • View Profile
  • Twitch Name: non_stop_sport
Re: Custom Notification WorkShop
« Reply #267 on: March 26, 2016, 09:48:56 AM »
Follower Alert

Image Link: https://antdagamer.files.wordpress.com/2015/06/wwe_super_card_kevin_owens.jpg
Font Style/Link: Any is fine
Font Color: Relative to whats on the Card
Any text fill/boarder?: what you think best
Where do you want text located? (Follower Name): where the name kevin owens would be a great place for follower name
Example (If applicable):
Anything else?: where say pop up powerbomb say Thank you for following. And where it says +68 power and +68 Toughness  says Non_Stop_Sport. Also under POW TGH SPD CHA Says 9,999

Wolfstreet Gaming

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Wolfstreet Gaming
Re: Custom Notification WorkShop
« Reply #268 on: March 30, 2016, 05:02:06 AM »
Donation Alert

Image Link: http://wolfstgaming.imgur.com/all/
Font Style/Link: Arial
Font Color: White
Any text fill/boarder?:with black outline (or shadowing)
Currency Type:$
Where do you want text located? Name in first black box, then amount and message in second black box
Example (If applicable): Wolfstreet, Donated $5, Thanks for Supporting the #Wolfpack!
Anything else?:


Follower Alert

Image Link: http://wolfstgaming.imgur.com/all/
Font Style/Link: Arial
Font Color: White
Any text fill/boarder?:with black outline (or shadowing)
Where do you want text located? Name in first black box, then Welcome message in 2nd box
Example (If applicable): Wolfstreet, Welcome to the #WOLFPACK!
Anything else?: Thank you!

Wolfstreet Gaming

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Wolfstreet Gaming
Re: Custom Notification WorkShop
« Reply #269 on: March 30, 2016, 05:09:14 AM »
Also can you make this slide out from left to right? Thank you