From 3fb57f372f016a795fa63fda9ed040ae7de685e4 Mon Sep 17 00:00:00 2001 From: tkimia Date: Mon, 21 Apr 2014 23:30:03 -0400 Subject: prelim style 2.0 --- app/assets/stylesheets/application.css | 6 +- app/assets/stylesheets/custom.css.scss | 19 +++++- app/assets/stylesheets/scaffolds.css.scss | 102 +++++++++++++----------------- app/assets/stylesheets/static.css.scss | 1 + 4 files changed, 64 insertions(+), 64 deletions(-) diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index ab45dd0..ebb963c 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -13,15 +13,13 @@ */ #query{ - background-color: white; + background-color: #303030; border: 2px solid #ED9C28; border-radius: 5px; color: #FFF; font-weight: bold; height: 30px; -} -.navbar{ - background-color: white; + padding: 0px 5px; } footer { diff --git a/app/assets/stylesheets/custom.css.scss b/app/assets/stylesheets/custom.css.scss index febcbb8..420bb4a 100644 --- a/app/assets/stylesheets/custom.css.scss +++ b/app/assets/stylesheets/custom.css.scss @@ -22,11 +22,28 @@ a, input[type="submit"] { @extend .btn; &.user { @extend .btn-info; } &.signup { @extend .btn-success; } - &.signin { @extend .btn-info; } + &.signin { @extend .btn-warning; } &.signout { @extend .btn-danger; } &.server { @extend .btn-danger; } } + +input[type="text"], input[type="password"]{ + border: 3px inset #A5A5A5; + -webkit-box-shadow: + inset 0 0 8px rgba(0,0,0,0.1), + 0 0 16px rgba(0,0,0,0.1); + -moz-box-shadow: + inset 0 0 8px rgba(0,0,0,0.1), + 0 0 16px rgba(0,0,0,0.1); + box-shadow: + inset 0 0 8px rgba(0,0,0,0.1), + 0 0 16px rgba(0,0,0,0.1); + padding: 10px; + background: rgba(0,0,0,0.5); + margin: 0 0 5px 0; +} + p.errors { background-color: #FCF8C7; color: red; diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss index 02b96a2..36eec30 100644 --- a/app/assets/stylesheets/scaffolds.css.scss +++ b/app/assets/stylesheets/scaffolds.css.scss @@ -2,6 +2,8 @@ $page-color: #444; $toolbar-color: black; +$orange: #DD9125; +$link-yellow: #FFC50D; html{ height: 100%; @@ -16,47 +18,34 @@ body { height: 100%; } -.wrapper { - padding-left: 5%; - padding-right: 5%; - margin: 0 auto; - background-color: #fff; - padding-top: 10px; - height: 90%; - box-shadow: 1px 1px 7px orange; - border-radius: 0px 0px 5px 5px; +h1, h2, h3, h4, h5, p{ + color: $orange; } -footer { - clear: both; - margin: 0 auto; - margin-top: 10px; - color: white; - +p, ol, ul, td { + font-family: verdana, arial, helvetica, sans-serif; + font-size: 13px; + line-height: 18px; } -@media screen and (min-width: 480px) { - .wrapper, footer { - width: 80%; - min-width: 480px; - max-width: 1024px; - } -} +/* NAVBAR */ -@media screen and (max-width: 480px) { - .wrapper, footer { - width: 100%; +.navbar-brand { + @extend .no-dec; + a{ + color: white; + &:hover, &:active, &:focus { + color: white; + font-weight: normal; + text-decoration: none; + } } } -h1, h2, h3, h4, h5{ - color: #030303; -} - -p, ol, ul, td { - font-family: verdana, arial, helvetica, sans-serif; - font-size: 13px; - line-height: 18px; +.navbar-inverse, header > nav { + background-color: $toolbar-color; + border-radius: 0px 0px 5px 5px; + box-shadow: 0px 0px 5px black; } pre { @@ -66,12 +55,9 @@ pre { } a { - color: #000; - &:visited { - color: #000; - } - &:hover { - color: green; + color: $link-yellow; + &:hover { + color: #FFEF00; text-decoration: none; } } @@ -93,6 +79,12 @@ div { display: table; } +.wrapper { + width: 80%; + margin: 0 auto; + margin-top: 10px; +} + #error_explanation { width: 450px; border: 2px solid red; @@ -117,28 +109,20 @@ div { } -/* NAVBAR */ -.navbar-brand { - @extend .no-dec; - a{ - color: white; - &:hover, &:active, &:focus { - color: white; - font-weight: normal; - text-decoration: none; - } - } -} - -.navbar-inverse, header > nav { - background-color: $toolbar-color; - border-color: #0F4070; - border-radius: 0px 0px 5px 5px; - margin-bottom: 0px; - -} button, input[type="submit"] { @extend .btn; } + + + +footer { + clear: both; + margin: 0 auto; + margin-top: 10px; + border-top: solid 1px $orange; + padding-top: 10px; + color: white; + text-align: center; +} \ No newline at end of file diff --git a/app/assets/stylesheets/static.css.scss b/app/assets/stylesheets/static.css.scss index d73e77d..14443f3 100644 --- a/app/assets/stylesheets/static.css.scss +++ b/app/assets/stylesheets/static.css.scss @@ -4,6 +4,7 @@ .jumbotron { background-color: #FFF; + box-shadow: 1px 1px 20px black; p { line-height: 1.5em; -- cgit v1.2.3-54-g00ecf From 25d8d625e79556e29f41d1d9982747716abf98e7 Mon Sep 17 00:00:00 2001 From: tkimia Date: Tue, 22 Apr 2014 00:02:35 -0400 Subject: new background texture. fixed inconsistency with login page --- app/assets/images/bg.png | Bin 0 -> 2725 bytes app/assets/stylesheets/custom.css.scss | 40 +++++++++++++++++++----------- app/assets/stylesheets/scaffolds.css.scss | 31 +++-------------------- app/views/sessions/new.html.erb | 2 +- 4 files changed, 31 insertions(+), 42 deletions(-) create mode 100644 app/assets/images/bg.png diff --git a/app/assets/images/bg.png b/app/assets/images/bg.png new file mode 100644 index 0000000..91c77c8 Binary files /dev/null and b/app/assets/images/bg.png differ diff --git a/app/assets/stylesheets/custom.css.scss b/app/assets/stylesheets/custom.css.scss index 420bb4a..1931c0d 100644 --- a/app/assets/stylesheets/custom.css.scss +++ b/app/assets/stylesheets/custom.css.scss @@ -18,6 +18,7 @@ header > nav { } } + a, input[type="submit"] { @extend .btn; &.user { @extend .btn-info; } @@ -25,6 +26,7 @@ a, input[type="submit"] { &.signin { @extend .btn-warning; } &.signout { @extend .btn-danger; } &.server { @extend .btn-danger; } + font-weight: bold; } @@ -39,32 +41,42 @@ input[type="text"], input[type="password"]{ box-shadow: inset 0 0 8px rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1); - padding: 10px; + padding: 8px; background: rgba(0,0,0,0.5); margin: 0 0 5px 0; } p.errors { - background-color: #FCF8C7; + background-color: rgba(0,0,0,0.5);; color: red; border-radius: 7px; padding: 10px; } -#errorExplanation { - h2 { - font-size: 1em; - color: red; - font-weight: bold; - } - li { - font-size: 1em; - color: red; - font-style: italic; - } - +#error_explanation { + width: 450px; + border: 2px solid red; + padding: 7px; + padding-bottom: 0; + margin-bottom: 20px; + background-color: #f0f0f0; + h2 { + text-align: left; + font-weight: bold; + padding: 5px 5px 5px 15px; + font-size: 12px; + margin: -7px; + margin-bottom: 0px; + background-color: #c00; + color: #fff; + } + ul li { + font-size: 12px; + list-style: square; + } } + #notice { text-align: center; font-weight: bold; diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss index 36eec30..dd8c80e 100644 --- a/app/assets/stylesheets/scaffolds.css.scss +++ b/app/assets/stylesheets/scaffolds.css.scss @@ -10,7 +10,7 @@ html{ } body { - background-color: $page-color; + background: asset-url("bg.png", image) repeat scroll 0 0 $page-color; color: $page-color; font-family: verdana, arial, helvetica, sans-serif; font-size: 13px; @@ -70,6 +70,9 @@ div { #notice { color: green; + background-color: rgba(0,0,0,0.5); + border-radius: 7px; + padding: 10px; } .field_with_errors { @@ -85,32 +88,6 @@ div { margin-top: 10px; } -#error_explanation { - width: 450px; - border: 2px solid red; - padding: 7px; - padding-bottom: 0; - margin-bottom: 20px; - background-color: #f0f0f0; - h2 { - text-align: left; - font-weight: bold; - padding: 5px 5px 5px 15px; - font-size: 12px; - margin: -7px; - margin-bottom: 0px; - background-color: #c00; - color: #fff; - } - ul li { - font-size: 12px; - list-style: square; - } -} - - - - button, input[type="submit"] { @extend .btn; } diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb index b4acf77..ff27762 100644 --- a/app/views/sessions/new.html.erb +++ b/app/views/sessions/new.html.erb @@ -14,7 +14,7 @@ <%= f.password_field :password %>

- <%= f.submit "Sign in", class: "btn btn-large btn-primary" %> + <%= f.submit "Log in", class: "signin" %>

<% end %> -- cgit v1.2.3-54-g00ecf From 594f1388802476b236e8eaa622fbb5aec181a0a0 Mon Sep 17 00:00:00 2001 From: tkimia Date: Tue, 22 Apr 2014 00:38:12 -0400 Subject: styled captcha and notices --- app/assets/stylesheets/custom.css.scss | 8 +------- app/assets/stylesheets/scaffolds.css.scss | 9 ++++++++- app/assets/stylesheets/users.css.scss | 7 +++++++ 3 files changed, 16 insertions(+), 8 deletions(-) diff --git a/app/assets/stylesheets/custom.css.scss b/app/assets/stylesheets/custom.css.scss index 1931c0d..d7f1698 100644 --- a/app/assets/stylesheets/custom.css.scss +++ b/app/assets/stylesheets/custom.css.scss @@ -26,7 +26,7 @@ a, input[type="submit"] { &.signin { @extend .btn-warning; } &.signout { @extend .btn-danger; } &.server { @extend .btn-danger; } - font-weight: bold; + font-weight: bold !important; } @@ -74,10 +74,4 @@ p.errors { font-size: 12px; list-style: square; } -} - - -#notice { - text-align: center; - font-weight: bold; } \ No newline at end of file diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss index dd8c80e..fd2a1fb 100644 --- a/app/assets/stylesheets/scaffolds.css.scss +++ b/app/assets/stylesheets/scaffolds.css.scss @@ -69,10 +69,17 @@ div { } #notice { - color: green; background-color: rgba(0,0,0,0.5); border-radius: 7px; padding: 10px; + width: 80%; + margin: 0px auto; + text-align: center; + + p{ + color: lightgreen !important; + font-weight: bold; + } } .field_with_errors { diff --git a/app/assets/stylesheets/users.css.scss b/app/assets/stylesheets/users.css.scss index 1efc835..3453a55 100644 --- a/app/assets/stylesheets/users.css.scss +++ b/app/assets/stylesheets/users.css.scss @@ -1,3 +1,10 @@ // Place all the styles related to the users controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/ + + +/*** FOR NEW USER - AKA SIGN UP ***/ +.simple_captcha { + background-color: rgba(255, 255, 255, 0.7); + margin: 10px 0px; +} \ No newline at end of file -- cgit v1.2.3-54-g00ecf From d75fe3934366ea5e2581df6111c6bccdb77d1e95 Mon Sep 17 00:00:00 2001 From: tkimia Date: Tue, 22 Apr 2014 01:50:18 -0400 Subject: redesign of tournaments index and matches index --- app/assets/stylesheets/matches.css.scss | 12 ++++++++++++ app/assets/stylesheets/scaffolds.css.scss | 10 ++++++++-- app/assets/stylesheets/tournaments.css.scss | 16 +++++++++------- app/views/matches/index.html.erb | 2 +- app/views/tournaments/index.html.erb | 6 +++--- 5 files changed, 33 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/matches.css.scss b/app/assets/stylesheets/matches.css.scss index 84430d6..66da68e 100644 --- a/app/assets/stylesheets/matches.css.scss +++ b/app/assets/stylesheets/matches.css.scss @@ -39,4 +39,16 @@ #current-id { display: none; +} + + + +/**** INDEX PAGE - TABLE AND GRAPH ****/ +#matches-table { + @extend .table; + color: #FFF; + + form { + color: #333; + } } \ No newline at end of file diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss index fd2a1fb..40791e8 100644 --- a/app/assets/stylesheets/scaffolds.css.scss +++ b/app/assets/stylesheets/scaffolds.css.scss @@ -3,6 +3,7 @@ $page-color: #444; $toolbar-color: black; $orange: #DD9125; +$darker-orange: #9D4102; $link-yellow: #FFC50D; html{ @@ -22,6 +23,10 @@ h1, h2, h3, h4, h5, p{ color: $orange; } +h1, h2, h3, h4, h5 { + text-shadow: 0px 0px 2px $darker-orange; +} + p, ol, ul, td { font-family: verdana, arial, helvetica, sans-serif; font-size: 13px; @@ -104,9 +109,10 @@ button, input[type="submit"] { footer { clear: both; margin: 0 auto; - margin-top: 10px; border-top: solid 1px $orange; padding-top: 10px; - color: white; text-align: center; + position:absolute; + bottom: 0; + width: 100%; } \ No newline at end of file diff --git a/app/assets/stylesheets/tournaments.css.scss b/app/assets/stylesheets/tournaments.css.scss index 2074783..41d6023 100644 --- a/app/assets/stylesheets/tournaments.css.scss +++ b/app/assets/stylesheets/tournaments.css.scss @@ -17,7 +17,7 @@ span.default-explanation { } #tournament-side-params { - background: none repeat scroll 0 0 #ADD8E6; + background: none repeat scroll 0 0 rgba(0,0,0,0.5); border-radius: 5px; float: right; font-size: 7px; @@ -33,23 +33,24 @@ span.default-explanation { #tournament-users{ li { - color: green; + color: #10A010; } .black { - color: black; + color: white; } } /* Style of a tournament listing div */ div.tournament-listing { - margin-top: 10px; + margin: 10px 0px; border-radius: 5px; - box-shadow: 2px 2px 4px #B8B8B8; - border: 2px solid #AAAAAA; + box-shadow: 0px 0px 3px #B8B8B8; + background-color: rgba(0, 0, 0, 0.6); + border: 1px solid #AAAAAA; min-height: 100px; - padding: 4px; + padding: 8px 4px; /* AKA the listing title */ h3 { @@ -65,6 +66,7 @@ div.tournament-listing { /* host of the tournament */ .host { font-weight: bold; + color: #FFF; } .col-md-8 { diff --git a/app/views/matches/index.html.erb b/app/views/matches/index.html.erb index 08d5fd6..03427d8 100644 --- a/app/views/matches/index.html.erb +++ b/app/views/matches/index.html.erb @@ -1,7 +1,7 @@

<%= @tournament.name %> - Matches

- +
diff --git a/app/views/tournaments/index.html.erb b/app/views/tournaments/index.html.erb index 7957042..eef9577 100644 --- a/app/views/tournaments/index.html.erb +++ b/app/views/tournaments/index.html.erb @@ -5,8 +5,8 @@ <%# Each tournament has a div for its listing %> <% @tournaments.each do |t| %>
-
<%= image_tag 'http://www.gravatar.com/avatar/' + Digest::MD5.hexdigest(t.hosts.first.email) + '?s=100&d=mm' %>
-
+
<%= image_tag 'http://www.gravatar.com/avatar/' + Digest::MD5.hexdigest(t.hosts.first.email) + '?s=100&d=mm' %>
+
<%# "header" %> <%= link_to(t) do %>

<%= t.name %>

<% end %>
@@ -23,7 +23,7 @@
-
+
<% if signed_in? %> <% if !t.players.include?(current_user) %> <%= form_tag(tournament_path(t), method: "put") do %> -- cgit v1.2.3-54-g00ecf
Name