Skip to content

Commit

Permalink
integrate the donation popup look
Browse files Browse the repository at this point in the history
  • Loading branch information
@kerphi
kerphi committed Nov 30, 2012
1 parent 9c6ca2f commit de3068b
Show file tree
Hide file tree
Showing 27 changed files with 479 additions and 12 deletions.
6 changes: 4 additions & 2 deletions client/jquery.phpfreechat.auth.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,11 +56,13 @@ var phpFreeChat = (function (pfc, $, window, undefined) {
pfc.showAuthForm = function (msg) {
pfc.modalbox.open(
'<form>'
+ ' <input type="text" name="login" placeholder="Login"/><br/>'
+ ' <div class="popup-login">'
+ ' <input type="text" name="login" placeholder="Login"/><br/>'
//+ ' <input type="text" name="password" placeholder="Password"/><br/>'
//+ ' <input type="text" name="email" placeholder="Email"/><br/>'
+ ' <input type="submit" name="submit" value="Sign in" />'
+ ' <input type="submit" name="submit" value="Sign in" />'
+ (msg ? '<p>' + msg + '</p>' : '')
+ ' </div>'
+ '</form>'
).submit(function () {
var login = $(this).find('[name=login]').attr('value');
Expand Down
10 changes: 6 additions & 4 deletions client/jquery.phpfreechat.core.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -347,11 +347,13 @@ var phpFreeChat = (function (pfc, $, window, undefined) {
function buildAndShowDonationPopup() {
// html of the popup
var box = pfc.modalbox.open(
'<form>'
'<form class="popup-donate">'
+ ' <p>phpFreeChat needs you. Please make a donation.</p>'
+ ' <label><input type="checkbox" name="skip-donate" /> skip next time</label>'
+ ' <input type="submit" name="cancel-donate" value="Cancel" />'
+ ' <input type="submit" name="ok-donate" value="Donate" />'
+ ' <div clalss="bt-validate">'
+ ' <input type="submit" name="cancel-donate" value="not now" />'
+ ' <input type="submit" name="ok-donate" value="DONATE" />'
+ ' </div>'
+ ' <span><label><input type="checkbox" name="skip-donate" /> skip next time</label></span>'
+ '</form>'
);

Expand Down
Binary file added client/themes/carbon/img/bt-donate-popup.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/carbon/img/bt-not-now.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/carbon/img/illus-donate.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
82 changes: 81 additions & 1 deletion client/themes/carbon/jquery.phpfreechat.full.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -749,9 +749,89 @@ div.pfc-content {
position: absolute;
background-color: #FFF;
z-index: 55;
padding: 20px;
padding: 10px;
.rounded-corners(5px);
.box-shadow(@modalbox-shadow-top, @modalbox-shadow-left, @modalbox-shadow-size, @modalbox-shadow-color);
.popup-login {
text-align: right;
input[type="text"] {
border: 1px solid @modalbox-popup-login-input-login-border-color;
background-color: @modalbox-popup-login-input-login-bg-color;
color: @modalbox-popup-login-input-login-font-color;
padding: 2px 5px;
margin-bottom: 10px;
}
input[type="submit"] {
border: 1px solid @modalbox-popup-login-bt-signin-border-color;
.rounded-corners(@modalbox-popup-login-bt-signin-border-radius);
color: @modalbox-popup-login-bt-signin-font-color;
padding: 2px 10px;
background-color: @modalbox-popup-login-bt-signin-bg-color;
&:hover {
border: 1px solid @modalbox-popup-login-bt-signin-border-color-hover;
color: @modalbox-popup-login-bt-signin-font-color-hover;
background-color: @modalbox-popup-login-bt-signin-bg-color-hover;
text-decoration: none;
cursor: pointer;
}
}
}
.popup-donate {
p {
position: relative;
top: 2px;
font-size: 14px;
line-height: 16px;
height: 139px;
width: 300px;
margin-bottom: 0;
padding-right: 66px;
background: url("img/illus-donate.png") right bottom no-repeat;
}
div {
input[name="cancel-donate"] {
position: relative;
top: -4px;
width: 114px;
height: 24px;
background: url("img/bt-not-now.png") top center no-repeat;
border: 0;
padding: 0 0 4px;
margin: 0 10px;
color: #9e9e9e;
font-size: 14px;
&:hover {
background-position: bottom center;
cursor: pointer;
color: #2593c5;
}
}
input[name="ok-donate"]{
width: 204px;
height:44px;
background: url("img/bt-donate-popup.png") top center no-repeat;
border: 0;
padding: 0 0 0 60px;
margin: 0 10px;
color: #fff;
font-size: 20px;
&:hover {
cursor: pointer;
background-position: bottom center;
}
}
}
span {
display: block;
margin-top: 5px;
label {
font-size: 10px;
position: relative;
top: -3px;
}
}
}

}

}
Expand Down
25 changes: 25 additions & 0 deletions client/themes/carbon/jquery.phpfreechat.responsive.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,31 @@ div.pfc-content {
display: none;
}

.pfc-modal-box{
.popup-donate {
p {
width: 140px !important;
}
div {
position: relative;
height: 70px;
input[name="cancel-donate"] {
display: block;
margin: 0 auto !important;
top: 50px !important;
}
input[name="ok-donate"] {
display: block;
margin: 0 auto !important;
position: absolute;
top: 0px;
}
}
span {
clear: both;
}
}
}

}
}
5 changes: 4 additions & 1 deletion client/themes/carbon/jquery.phpfreechat.theme.variables.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,4 +115,7 @@
@compose-shadow-top: 0;
@compose-shadow-left: 3px;
@compose-shadow-size: 10px;
@compose-shadow-color: #000;
@compose-shadow-color: #000;

/* MODALBOX */
@modalbox-popup-login-bt-signin-border-radius: 0;
10 changes: 10 additions & 0 deletions client/themes/carbon/jquery.phpfreechat.variables.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -364,6 +364,16 @@
@modalbox-shadow-left: "";
@modalbox-shadow-size: "";
@modalbox-shadow-color: "";
@modalbox-popup-login-input-login-border-color: @border-color;
@modalbox-popup-login-input-login-bg-color: @users-bg-color;
@modalbox-popup-login-input-login-font-color: @users-font-color;
@modalbox-popup-login-bt-signin-border-color: @footer-donate-border-color;
@modalbox-popup-login-bt-signin-bg-color: @footer-bg-color;
@modalbox-popup-login-bt-signin-font-color: @footer-a-font-color;
@modalbox-popup-login-bt-signin-border-radius: 5px;
@modalbox-popup-login-bt-signin-border-color-hover: @footer-donate-border-color;
@modalbox-popup-login-bt-signin-bg-color-hover: @footer-donate-bg-color-hover;
@modalbox-popup-login-bt-signin-font-color-hover: @footer-a-font-color-hover;

@import "jquery.phpfreechat.theme.variables.less";

Expand Down
Binary file added client/themes/default/img/bt-donate-popup.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/default/img/bt-not-now.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/default/img/illus-donate.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
82 changes: 81 additions & 1 deletion client/themes/default/jquery.phpfreechat.full.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -749,9 +749,89 @@ div.pfc-content {
position: absolute;
background-color: #FFF;
z-index: 55;
padding: 20px;
padding: 10px;
.rounded-corners(5px);
.box-shadow(@modalbox-shadow-top, @modalbox-shadow-left, @modalbox-shadow-size, @modalbox-shadow-color);
.popup-login {
text-align: right;
input[type="text"] {
border: 1px solid @modalbox-popup-login-input-login-border-color;
background-color: @modalbox-popup-login-input-login-bg-color;
color: @modalbox-popup-login-input-login-font-color;
padding: 2px 5px;
margin-bottom: 10px;
}
input[type="submit"] {
border: 1px solid @modalbox-popup-login-bt-signin-border-color;
.rounded-corners(@modalbox-popup-login-bt-signin-border-radius);
color: @modalbox-popup-login-bt-signin-font-color;
padding: 2px 10px;
background-color: @modalbox-popup-login-bt-signin-bg-color;
&:hover {
border: 1px solid @modalbox-popup-login-bt-signin-border-color-hover;
color: @modalbox-popup-login-bt-signin-font-color-hover;
background-color: @modalbox-popup-login-bt-signin-bg-color-hover;
text-decoration: none;
cursor: pointer;
}
}
}
.popup-donate {
p {
position: relative;
top: 2px;
font-size: 14px;
line-height: 16px;
height: 139px;
width: 300px;
margin-bottom: 0;
padding-right: 66px;
background: url("img/illus-donate.png") right bottom no-repeat;
}
div {
input[name="cancel-donate"] {
position: relative;
top: -4px;
width: 114px;
height: 24px;
background: url("img/bt-not-now.png") top center no-repeat;
border: 0;
padding: 0 0 4px;
margin: 0 10px;
color: #9e9e9e;
font-size: 14px;
&:hover {
background-position: bottom center;
cursor: pointer;
color: #2593c5;
}
}
input[name="ok-donate"]{
width: 204px;
height:44px;
background: url("img/bt-donate-popup.png") top center no-repeat;
border: 0;
padding: 0 0 0 60px;
margin: 0 10px;
color: #fff;
font-size: 20px;
&:hover {
cursor: pointer;
background-position: bottom center;
}
}
}
span {
display: block;
margin-top: 5px;
label {
font-size: 10px;
position: relative;
top: -3px;
}
}
}

}

}
Expand Down
25 changes: 25 additions & 0 deletions client/themes/default/jquery.phpfreechat.responsive.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,31 @@ div.pfc-content {
display: none;
}

.pfc-modal-box{
.popup-donate {
p {
width: 140px !important;
}
div {
position: relative;
height: 70px;
input[name="cancel-donate"] {
display: block;
margin: 0 auto !important;
top: 50px !important;
}
input[name="ok-donate"] {
display: block;
margin: 0 auto !important;
position: absolute;
top: 0px;
}
}
span {
clear: both;
}
}
}

}
}
10 changes: 10 additions & 0 deletions client/themes/default/jquery.phpfreechat.variables.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -364,6 +364,16 @@
@modalbox-shadow-left: "";
@modalbox-shadow-size: "";
@modalbox-shadow-color: "";
@modalbox-popup-login-input-login-border-color: @border-color;
@modalbox-popup-login-input-login-bg-color: @users-bg-color;
@modalbox-popup-login-input-login-font-color: @users-font-color;
@modalbox-popup-login-bt-signin-border-color: @footer-donate-border-color;
@modalbox-popup-login-bt-signin-bg-color: @footer-bg-color;
@modalbox-popup-login-bt-signin-font-color: @footer-a-font-color;
@modalbox-popup-login-bt-signin-border-radius: 5px;
@modalbox-popup-login-bt-signin-border-color-hover: @footer-donate-border-color;
@modalbox-popup-login-bt-signin-bg-color-hover: @footer-donate-bg-color-hover;
@modalbox-popup-login-bt-signin-font-color-hover: @footer-a-font-color-hover;

@import "jquery.phpfreechat.theme.variables.less";

Expand Down
Binary file added client/themes/gamer/img/bt-donate-popup.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/gamer/img/bt-not-now.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/themes/gamer/img/illus-donate.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit de3068b

Please sign in to comment.