Author Topic: Donation banner plz  (Read 3474 times)

0 Members and 1 Guest are viewing this topic.

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Donation banner plz
« on: August 21, 2014, 09:55:56 PM »
I'm looking for a large (900x400ish) donation notification.  This is my current twitch layout and I will link the black chrome background as well.  The font is CAPTURE IT.  Can you guys help me out?

http://i.imgur.com/YER3kr0


http://imgur.com/q1V4lPk

Thanks!!

ExpertsOnline

  • Creator
  • Councilor
  • *****
  • Posts: 2656
  • Karma: +289/-24
    • View Profile
  • Twitch Name: expertsonline
Re: Donation banner plz
« Reply #1 on: August 22, 2014, 12:01:51 AM »
Could you describe how you would like it to look? appear where in that layout? what colour? with what information?

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Re: Donation banner plz
« Reply #2 on: August 22, 2014, 02:16:32 AM »


This is what my buddy made for me.  It's too big to put on Imgur, but this is the general idea.  Black chrome background, the gif of the dancing dude off to the side, with a space for the User's name, how much they donated, and space for their message.
« Last Edit: August 22, 2014, 02:26:11 AM by Gridsquare »

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Re: Donation banner plz
« Reply #3 on: August 22, 2014, 02:23:30 AM »

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Re: Donation banner plz
« Reply #4 on: August 24, 2014, 06:02:00 AM »
Anyone, please?

ExpertsOnline

  • Creator
  • Councilor
  • *****
  • Posts: 2656
  • Karma: +289/-24
    • View Profile
  • Twitch Name: expertsonline
Re: Donation banner plz
« Reply #5 on: August 24, 2014, 07:02:09 AM »
You will need to provide the final image you would like to use with the locations for the messages before I can help you create the CSS overlay to position the messages in the right location.
Have a look at some of the other threads in this forum for examples.

Regards,
Experts

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Re: Donation banner plz
« Reply #6 on: August 24, 2014, 09:02:50 AM »
HERE IT IS!  Finally got it small enough.

http://imgur.com/Itm7Hd0

Inside the box, I'd like the username.

Where the fat guy is techno dancing, above his head, centered in large font that I listed earlier, the donation amount.

The entire space below the gray username box is for the message that the user wants.

Is this sufficient?

ExpertsOnline

  • Creator
  • Councilor
  • *****
  • Posts: 2656
  • Karma: +289/-24
    • View Profile
  • Twitch Name: expertsonline
Re: Donation banner plz
« Reply #7 on: August 24, 2014, 11:16:00 AM »
Link : http://deepbot.tv/notifications/donationnotification.htm
width: 910
height: 500

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

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

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

#donor-notification .message {
position: absolute;
margin-left: 35px !important;
margin-top: 135px !important;
float: left !important;
height: 120px !important;
padding-top: 0px !important;
width: 460px !important;
line-height: 24px !important;
text-align: center !important;
vertical-align: top !important;
font-size: 22px !important;
font-family: Earth Kid, Verdana !important;
color: white !important;
}
#donor-notification .amount {
position: absolute;
margin-top: -70px !important;
margin-left: 530px !important;
width: 350px !important;
padding-top: 0px !important;
text-align: center !important;
line-height: 26px !important;
vertical-align: top !important;
font-size: 52px !important;
font-family: Algerian !important;
text-shadow: 1px 1px 1px #000 !important;
color: white !important;
}
#donor-notification .donor {
position: absolute;
margin-left: 35px !important;
padding-top: 0px !important;
margin-top: 73px !important;
width: 460px !important;
text-align: center !important;
line-height: 28px !important;
vertical-align: initial !important;
font-size: 32px !important;
font-family: Earth Kid, Algerian !important;
text-shadow: 1px 1px 1px #000 !important;
color: white !important;
}

Preview:

Gridsquare

  • Youngling
  • *
  • Posts: 8
  • Karma: +0/-0
    • View Profile
  • Twitch Name: gridsquare
Re: Donation banner plz
« Reply #8 on: August 24, 2014, 10:20:54 PM »
You magnificent bastard!  Is there nothing you can't do?  Holy crap, man, this is amazing work!  Thank you so, so much for this!!