Author Topic: Can anyone do CSS for these images?  (Read 1398 times)

0 Members and 1 Guest are viewing this topic.

Spektral50

  • Youngling
  • *
  • Posts: 9
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Spektral50
Can anyone do CSS for these images?
« on: September 25, 2015, 10:04:06 AM »
Really want to use these images but need CSS work

Image named-Prinny_dood for Host
Image named-Final_form_03 for new follower notification
Image named-D1_Laharl_05 for Donation notification

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: Can anyone do CSS for these images?
« Reply #1 on: September 25, 2015, 02:13:45 PM »
Requested by: Spektral50

Host:

Link: http://deepbot.tv/notifications/hostnotification.htm
Width: 900
Height: 1100

CSS Code:
Code: [Select]
body {
background-color: transparent;
color: white;
}

#host-notification {
top: 0px;
left: 0px;
width: 800px !important;
height: 1000px !important;
border-radius: 10px;
background-image: url('http://i.imgur.com/vsAaej9.png') !important;
background-repeat: no-repeat;
overflow: hidden;
}

#host-notification .hostname {
margin-top: 10px !important;
  margin-left: 200px !important;
text-align: center;
width: 500px !important;
font-size: 40px !important;
font-family: Verdana;
text-shadow: 2px 2px 1px #000;
color: #ffffff;
}

.hostdiv {
visibility: hidden !important;
}

.hostnumber {
visibility: hidden !important;
}

#host-notification .header {
text-align: center;
width: 500;
vertical-align: top;
font-size: 26px;
line-height: 26px;
font-family: Algerian;
text-shadow: 1px 1px 1px #97A02A;
text-decoration: underline;
color: red;
visibility: hidden;
padding-top: -50px;
}

.hostname:after {
content: ' is now hosting the Stream!' !important;
}

.hostnum:after {
content: '' !important;
}

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



Follower:

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

CSS Code:
Code: [Select]
#follow-notification {
display: none;
position: absolute;
width: 800px !important;
height: 800px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/U4Clp6k.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 0px !important;
margin-left: 240px !important;
width: 300px !important;
font-size: 40px !important;
font-weight: normal !important;
font-family: Impact !important;
color: #ffffff !important;
text-transform: capitalize;
-webkit-text-fill-color: White;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
}

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

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




Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 860
Height: 1000

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

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

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

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

#donor-notification .message {
position: absolute !important;
margin-top: 80px !important;
margin-left: 50px !important;
width: 700px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: Impact !important;
text-transform: capitalize;
color: #C0C0C0 !important;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
}
#donor-notification .amount {
position: absolute !important;
margin-top: -10px !important;
margin-left: -170px !important;
width: 300px !important;
font-size: 36px !important;
font-weight: normal !important;
font-family: Impact !important;
text-transform: capitalize;
color: white !important;
-webkit-text-stroke-color: white;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
}
#donor-notification .donor {
position: absolute !important;
margin-top: -10px !important;
margin-left: -130px !important;
width: 300px !important;
font-size: 36px !important;
font-weight: normal !important;
font-family: Impact !important;
text-transform: capitalize;
color: white !important;
-webkit-text-stroke-color: white;
-webkit-text-stroke-width: 0px;
-webkit-text-fill-color: white;
}

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