Deep Bot - Twitch Streamer Assistant

Deep Bot => Custom Notifications => Topic started by: helltaker666 on April 04, 2017, 06:05:35 PM

Title: i need help creating a follow notification
Post by: helltaker666 on April 04, 2017, 06:05:35 PM
ok so im currently using http://i.imgur.com/A9waiZn.png as my follow notification and would like to add https://gyazo.com/6d11f497ddfe2157c0cd57425599b2f7 to it either to the left or right of it, can anyone help make this happen?
Title: Re: i need help creating a follow notification
Post by: m4ntis87 on April 06, 2017, 10:54:28 AM
I had a few minutes to spare, so I ran them both through photoshop and created this. The quality on the follow notification is lower due to becoming a gif, it's limited to 256 colors.

http://imgur.com/a/ce5BQ

--

Edit: My method for the additional transparent space to the right is to center the original follow notification, this is how I got around using the text with sites like streamlabs, opposed to custom CSS. The extra unused space could be removed if you were to use custom css.
Title: Re: i need help creating a follow notification
Post by: helltaker666 on April 07, 2017, 10:29:49 AM
ok well ima noob when it comes to css, i can move things like the txt around but it seems just replacing the old img link with that 1 doesnt work :P

Here is my current css

body {
  background-color: rgba(0, 0, 0, 0);
  margin: 0px auto;
  overflow: hidden;
}
#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
}

Edit: but yes that is what i want with the trans background, thanks :)
Title: Re: i need help creating a follow notification
Post by: TheNumbLock on April 07, 2017, 09:29:14 PM
ok well ima noob when it comes to css, i can move things like the txt around but it seems just replacing the old img link with that 1 doesnt work :P

Here is my current css

body {
  background-color: rgba(0, 0, 0, 0);
  margin: 0px auto;
  overflow: hidden;
}
#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
}

Edit: but yes that is what i want with the trans background, thanks :)

You have to use the direct image link: http://i.imgur.com/2vuUvLA.mp4 (May have to adjust width and height right above it in the CSS if it looks off. Usually you just change the dimensions to what the image is itself. Then may need to adjust the dimensions on the General Tab of the CLR Browser.)
Title: Re: i need help creating a follow notification
Post by: helltaker666 on April 08, 2017, 04:22:44 AM
tried just changing the link and im getting no image show up atall :( so i dont know what needs changing to get the image to show
Title: Re: i need help creating a follow notification
Post by: TheNumbLock on April 08, 2017, 04:26:09 AM
tried just changing the link and im getting no image show up atall :( so i dont know what needs changing to get the image to show

I will test it when I get home. But what URL are you using for the follower notification itself?
Title: Re: i need help creating a follow notification
Post by: helltaker666 on April 08, 2017, 08:10:44 AM
http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Title: Re: i need help creating a follow notification
Post by: TheNumbLock on April 08, 2017, 09:54:58 PM
http://deepbot.tv/notifications/follownotification1.htm?dur=10000

Try this CSS:

Code: [Select]
#follow-notification {
display: none;
position: absolute;
top: 0px !important;
left: 0px !important;
width: 1149px !important;
height: 212px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url(http://i.imgur.com/2vuUvLA.gif) !important;
background-repeat: no-repeat;
}

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

#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 80px !important;
margin-left: 450px !important;
width: 300px !important;
font-size: 38px !important;
font-weight: bold !important;
font-family: Verdana !important;
color: #FF0000 !important;
text-transform: capitalize;
-webkit-text-stroke-color: #000;
-webkit-text-stroke-width: 1px;
}

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

.followname:after {
content: '' !important;
}
Title: Re: i need help creating a follow notification
Post by: helltaker666 on April 09, 2017, 01:05:17 AM
that is just giving me the xbox controler loading with the name of the follower :/
Title: Re: i need help creating a follow notification
Post by: TheNumbLock on April 09, 2017, 10:12:30 AM
that is just giving me the xbox controler loading with the name of the follower :/

o.o What streaming software are you using?

Try this URL: http://deepbot.tv/notifications/follownotification1.htm?dur=10000
Title: Re: i need help creating a follow notification
Post by: helltaker666 on April 09, 2017, 10:51:31 AM
wow, that worked.... but arnt they the same link?

Try this URL: http://deepbot.tv/notifications/follownotification1.htm?dur=10000

http://deepbot.tv/notifications/follownotification1.htm?dur=10000

either way its working purrrrrfect, many thanks :)