RumbleTalk CSS Documentation

RumbleTalk CSS Documentation

Dialog Box (Donate)


.donate-dialog { display: none; position: absolute; z-index: 13; right: 0; background-color: #fff; bottom: 43px; padding: 10px; width: 310px; font-family: Arial, serif; }

.donate-dialog .user-preview

.donate-dialog .user-preview { position: relative; color: #fff; border-radius: 3px; padding: 10px; box-shadow: 0 1px 1px #666; }

.donate-dialog .user-preview .close-button

It refers to the close button (X) located at the upper-right corner of the dialog box.

.donate-dialog .user-preview .close-button { filter: brightness(0) invert(1); }


.donate-dialog .user-preview img { border-radius: 50%; max-width: 40px; max-height: 40px; vertical-align: middle; margin-right: 5px; border: 1px solid #fff; }


It refers to the username of the donator.

.donate-dialog .user-preview .donate-username { vertical-align: middle; max-width: 215px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block; }


.donate-dialog .donate-message { width: 100%; padding: 5px; border: 0; border-bottom: 2px solid #999; outline: none; background-color: transparent; margin-top: 10px; color: #fff; }


.donate-dialog .amount-section { text-align: center; margin: 20px 0; }

.amount-section input:placeholder-shown

.donate-dialog .amount-section input:placeholder-shown { text-align: left; }


.donate-dialog .amount-options { text-align: center; margin: 20px 0; }


.donation-basic { background-color: #648f19 !important; }


.donation-novice { background-color: #3ac7e5 !important; }


.donation-expert { background-color: #c9ca38 !important; }


.donation-master { background-color: #9e2abe !important; }


.donation-grand-master { background-color: #b92727 !important; }

.donate-dialog button

.donate-dialog button { width: 100%; background-color: #648f19; font-style: italic; border-radius: 3px; }