Skip to content
This repository has been archived by the owner on Feb 18, 2018. It is now read-only.

Commit

Permalink
Styled the login page
Browse files Browse the repository at this point in the history
  • Loading branch information
@mads-hartmann
mads-hartmann committed Oct 16, 2011
1 parent 10f5ba8 commit 0023dc5
Show file tree
Hide file tree
Showing 10 changed files with 227 additions and 147 deletions.
Binary file added resources/board-bg_old.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/button_sprite_left.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/button_sprite_right.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/input_field_left.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/input_field_right.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/login_box_bg.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/menu_box_background.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
206 changes: 123 additions & 83 deletions resources/style.css
View file
Expand Up @@ -122,49 +122,127 @@ body {
position: absolute;
}
/* line 71, ../sass/style.scss */
.container .content {
overflow: hidden;
*zoom: 1;
background: #e0e0e0;
border-radius: 10px;
padding: 20px;
box-shadow: 0px 0px 5px black;
.container#login {
width: 325px;
left: 50%;
margin-left: 325px/2;
}
/* line 77, ../sass/style.scss */
.container #login_box {
background: url("/resources/login_box_bg.png");
width: 233px;
height: 190px;
padding-top: 100px;
padding: 100px 46px 0px 46px;
}
/* line 87, ../sass/style.scss */
.container #login_box .text input {
width: 221px;
}
/* line 91, ../sass/style.scss */
.container #login_box .button {
float: right;
}
/* line 93, ../sass/style.scss */
.container #login_box .button .inner {
width: 80px;
}
/* line 98, ../sass/style.scss */
.container #login_box ul {
margin-top: 10px;
}
/* line 100, ../sass/style.scss */
.container #login_box ul li {
margin-bottom: 5px;
}
/* line 106, ../sass/style.scss */
.container .text {
background: url("/resources/input_field_left.png") top left no-repeat;
padding-left: 6px;
display: block;
height: 50px;
}
/* line 114, ../sass/style.scss */
.container .text input {
background: url("/resources/input_field_right.png") top right no-repeat;
padding: 0px 0px 0px 6px;
height: 50px;
outline: none;
border: 0px;
color: #8e6c40;
font-size: 13px;
line-height: 13px;
font-weight: bold;
}
/* line 126, ../sass/style.scss */
.container .text input::-webkit-input-placeholder {
color: #8e6c40;
}
/* line 129, ../sass/style.scss */
.container .text input:-moz-placeholder {
color: #8e6c40;
}
/* line 134, ../sass/style.scss */
.container .button {
background: url("/resources/button_sprite_left.png") top left no-repeat;
height: 50px;
padding: 0px 0px 0px 6px;
display: block;
}
/* line 142, ../sass/style.scss */
.container .button .inner {
background: url("/resources/button_sprite_right.png") top right no-repeat;
height: 50px;
padding: 0px 6px 0px 0px;
margin: 0px 0px 0px 0px;
border: none;
float: none;
color: #940000;
font-weight: bold;
font-size: 14px;
text-shadow: white 1px 1px 1px;
}
/* line 154, ../sass/style.scss */
.container .button:hover {
background-position: 0px -50px;
}
/* line 156, ../sass/style.scss */
.container .button:hover .inner {
background-position: 100% -50px;
}
/* line 160, ../sass/style.scss */
.container .button:active {
background-position: 0px -100px;
}
/* line 162, ../sass/style.scss */
.container .button:active .inner {
background-position: 100% -100px;
}
/* line 79, ../sass/style.scss */
/* line 168, ../sass/style.scss */
.container ul {
text-align: left;
}
/* line 83, ../sass/style.scss */
/* line 172, ../sass/style.scss */
.container input[type=submit] {
float: right;
margin-top: 20px;
}
/* line 88, ../sass/style.scss */
.container#login {
width: 262px;
left: 50%;
margin-left: -131px;
}
/* line 95, ../sass/style.scss */
/* line 180, ../sass/style.scss */
.container#lobby input[type=submit] {
float: none;
margin-top: 0px;
width: 260px;
}
/* line 104, ../sass/style.scss */
.container#create .button {
margin-left: 10px;
}
/* line 108, ../sass/style.scss */
/* line 188, ../sass/style.scss */
.container#create label {
width: 100px;
display: inline-block;
}
/* line 113, ../sass/style.scss */
/* line 193, ../sass/style.scss */
.container#create input {
width: 300px;
}
/* line 121, ../sass/style.scss */
/* line 201, ../sass/style.scss */
.container#lobby #main ul#menu {
margin: 0;
padding: 0;
Expand Down Expand Up @@ -195,23 +273,19 @@ body {
.container#lobby #main ul#menu li.last {
padding-right: 0;
}
/* line 124, ../sass/style.scss */
/* line 204, ../sass/style.scss */
.container#lobby #main ul#menu li {
margin: 10px 0px;
text-align: center;
}
/* line 128, ../sass/style.scss */
.container#lobby #main ul#menu li .button {
width: 199px;
}
/* line 135, ../sass/style.scss */
/* line 211, ../sass/style.scss */
.container#lobby .back {
display: inline-block;
margin: 0px 0px 10px 0px;
color: #000;
text-decoration: none;
}
/* line 143, ../sass/style.scss */
/* line 219, ../sass/style.scss */
.container #chat_messages {
padding: 9px;
border: solid 1px #E5E5E5;
Expand All @@ -228,19 +302,19 @@ body {
clear: both;
margin-bottom: 10px;
}
/* line 148, ../sass/style.scss */
/* line 224, ../sass/style.scss */
.container #chat_messages .user {
font-weight: bold;
}

/* line 154, ../sass/style.scss */
/* line 230, ../sass/style.scss */
#status {
height: 45px;
padding-bottom: 30px;
text-align: center;
color: #fff;
}
/* line 160, ../sass/style.scss */
/* line 236, ../sass/style.scss */
#status ul {
margin: 0;
padding: 0;
Expand Down Expand Up @@ -277,20 +351,20 @@ body {
#status ul li.last {
padding-right: 0;
}
/* line 169, ../sass/style.scss */
/* line 245, ../sass/style.scss */
#status ul li {
margin-left: 50px;
float: right;
}
/* line 174, ../sass/style.scss */
/* line 250, ../sass/style.scss */
#status ul span {
color: #fff;
}

/*
The game view
*/
/* line 188, ../sass/style.scss */
/* line 264, ../sass/style.scss */
.game .chat {
position: absolute;
left: 0px;
Expand All @@ -300,20 +374,20 @@ body {
width: 300px;
height: 100%;
}
/* line 197, ../sass/style.scss */
/* line 273, ../sass/style.scss */
.game .chat .input {
position: absolute;
bottom: 10px;
}
/* line 203, ../sass/style.scss */
/* line 279, ../sass/style.scss */
.game #board {
position: absolute;
left: 300px;
height: 100%;
top: 0%;
right: 0%;
}
/* line 210, ../sass/style.scss */
/* line 286, ../sass/style.scss */
.game #board .wood {
position: relative;
left: 50%;
Expand All @@ -323,7 +397,7 @@ body {
padding: 30px;
background: url("/resources/board-bg.png") 0px 0px no-repeat;
}
/* line 221, ../sass/style.scss */
/* line 297, ../sass/style.scss */
.game #waiting {
z-index: 1;
position: absolute;
Expand All @@ -332,7 +406,7 @@ body {
top: 0px;
background: rgba(0, 0, 0, 0.5);
}
/* line 229, ../sass/style.scss */
/* line 305, ../sass/style.scss */
.game #waiting h1 {
text-align: center;
color: #fff;
Expand All @@ -349,86 +423,52 @@ body {
/*
End of game view
*/
/* line 248, ../sass/style.scss */
/* line 324, ../sass/style.scss */
td, th {
text-align: center;
width: 75px;
height: 75px;
}

/* line 254, ../sass/style.scss */
/* line 330, ../sass/style.scss */
.selected {
background: green;
}

/* line 258, ../sass/style.scss */
/* line 334, ../sass/style.scss */
.movable {
background: orange;
}

/* line 263, ../sass/style.scss */
/* line 339, ../sass/style.scss */
.hidden {
display: none;
}

/*
forms
*/
/* line 271, ../sass/style.scss */
/* line 347, ../sass/style.scss */
.error_container {
background: #b30a0a;
margin: 20px 0px;
padding: 10px;
border: 2px solid black;
color: white;
}
/* line 278, ../sass/style.scss */
/* line 354, ../sass/style.scss */
.error_container ul {
text-align: left;
padding-left: 20px;
list-style: disc;
}

/* line 285, ../sass/style.scss */
/* line 361, ../sass/style.scss */
.no_errors {
display: none;
}

/* line 289, ../sass/style.scss */
/* line 365, ../sass/style.scss */
.has_errors {
display: block;
}

/* line 293, ../sass/style.scss */
.button, input[type=submit] {
width: auto;
padding: 9px 15px;
background: #617798;
border: 0;
font-size: 14px;
color: #FFFFFF;
text-decoration: none;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}
/* line 303, ../sass/style.scss */
.button:hover, input[type=submit]:hover {
background: #617794;
}
/* line 307, ../sass/style.scss */
.button:active, input[type=submit]:active {
background: #6177CD;
}

/* line 312, ../sass/style.scss */
.button {
display: inline-block;
}

/*
iPhone styles
*/

0 comments on commit 0023dc5

Please sign in to comment.