diff options
author | Luke Shumaker <lukeshu@sbcglobal.net> | 2014-06-30 10:26:26 -0400 |
---|---|---|
committer | Luke Shumaker <lukeshu@sbcglobal.net> | 2014-06-30 10:26:26 -0400 |
commit | 7f6458d67fa9e7f67e18e97ac61d5575dd1ccb21 (patch) | |
tree | c3f24047853a693cf889bbc00b436758d4c154a0 | |
parent | a8617d93a18ba0f1765fc58c38c26f51e2ff975d (diff) | |
parent | e2796a3f26c200123f81a9957b84378aad6fc952 (diff) |
Merge branch 'css-rewrite'
32 files changed, 631 insertions, 639 deletions
diff --git a/app/assets/stylesheets/alerts.css.scss b/app/assets/stylesheets/alerts.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/alerts.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css deleted file mode 100644 index 1c8b233..0000000 --- a/app/assets/stylesheets/application.css +++ /dev/null @@ -1,12 +0,0 @@ -/* - * This is a manifest file that'll be compiled into application.css, which will include all the files - * listed below. - * - * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, - * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. - * - *= require_self - *= require_tree ./application - */ - -/* If you put any styles in this file directly, I will knife you. */ diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss new file mode 100644 index 0000000..c6020bd --- /dev/null +++ b/app/assets/stylesheets/application.css.scss @@ -0,0 +1,8 @@ +/* + * This is a manifest file that'll be compiled into application.css. + */ +/* If you put any styles in this file directly, I will knife you. */ + +@import "colors"; +@import "bootstrapify"; +@import "scaffolds"; diff --git a/app/assets/stylesheets/application/scaffolds.css.scss b/app/assets/stylesheets/application/scaffolds.css.scss deleted file mode 100644 index 4f0c781..0000000 --- a/app/assets/stylesheets/application/scaffolds.css.scss +++ /dev/null @@ -1,329 +0,0 @@ -@import "bootstrap"; -@import "colors"; - -/* Layout ***********************************************************/ - -html { - body { - background: asset-url("bg.png", image) repeat scroll 0 0 $toolbar-color; - color: $page-color; - font-family: verdana, arial, helvetica, sans-serif; - font-size: 13px; - line-height: 18px; - - header > nav { - @extend .navbar; - @extend .navbar-inverse; - color: white; - - .navbar-brand { - @extend .no-dec; - a{ - color: white; - &:hover, &:active, &:focus { - color: white; - font-weight: normal; - text-decoration: none; - } - } - } - - #log-buttons { - margin-top: 8px; - form { display: inline; } - #alerts-ajax { - display: none; - } - } - - form.search { - @extend .navbar-form; - float: right; - input[type="text"], input[type="search"] { - background-color: #303030; - border: 2px solid #ED9C28; - border-radius: 5px; - color: #FFF; - font-weight: bold; - height: 30px; - padding: 0px 5px; - } - input[type="submit"] { - @extend .btn-warning; - } - } - } - - #notice { - 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; - } - } - - .wrapper { - width: 80%; - margin: 10px auto 0; - } - - footer { - clear: both; - border-top: solid 1px $orange; - text-align: center; - margin: 1em auto 0; - width: 90%; - } - } -} - -/* General styles ***************************************************/ - -h1, h2, h3, h4, h5, p, li, label{ - 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; - line-height: 18px; -} - -fieldset { - border: solid 1px $orange; - border-radius: .5em; - padding: 1em; - margin: 1em 0; - legend { - color: $orange; - display: block; - margin: 0; - padding: .25em .5em; - width: auto; - border: solid 1px $orange; - border-radius: .5em; - } -} - -form ul { - list-style: none; -} - -a, button, input[type="submit"] { - @extend .btn; - &.user { @extend .btn-info; } - &.signup { @extend .btn-success; } - &.signin { @extend .btn-warning; } - &.signout { @extend .btn-danger; } - &.server { @extend .btn-warning; } - &.create-alert { - color: white; - background-color: rgb(255, 69, 0); - border-color: rgb(255, 69, 0); - } - &.alerts { - @extend .navbar-right; - @extend .glyphicon; - @extend .glyphicon-exclamation-sign; - color: white; - background-color: hsl(0, 69%, 22%) !important; - } - font-weight: bold !important; -} - -input, textarea{ - -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); - - border: 3px inset #A5A5A5; - padding: 8px; - color: $orange; - background: rgba(0,0,0,0.5); - margin: 0 0 5px 0; -} - -select { - background-color: #333; - padding: 5px; - border: none; - color: $orange; -} - -pre { - text-align: left; - background-color: #eee; - padding: 10px; - font-size: 11px; -} - -a { - color: $link-yellow; - &:hover { - color: white; - - } -} - -p, li { - color: #DD9125; -} - -td, th { - color: #DD9125; -} - -svg { - min-width: 600px; -} - -div.field, div.actions { - margin-bottom: 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; - } -} -.field_with_errors { - padding: 1px; - background-color: #FF4C4C; - box-shadow: 0px 0px 5px red; - display: table; -} -.errors { - background-color: rgba(0,0,0,0.5);; - color: red; - border-radius: 7px; - padding: 10px; -} - -/* Specific styles **************************************************/ - -.tournament-listing { - margin: 10px 0px; - border-radius: 5px; - box-shadow: 0px 0px 3px #B8B8B8; - background-color: rgba(0, 0, 0, 0.6); - border: 1px solid #AAAAAA; - min-height: 100px; - padding: 8px 4px; - - div.row { - margin-left: 2%; - } - p.message { - margin-top: 10px; - } - - /* AKA the listing title */ - h3 { - margin-top: 0px; - color: #F0AD4E; - font-weight: bold; - } - - h3:hover { - color: #D09D3E; - } - - /* host of the tournament */ - .host { - font-weight: bold; - color: #FFF; - } - - .col-md-8 { - padding: 0; - a { - padding: 5px 0 0 0; - } - } - - .t-game{ - font-weight: bold; - text-align: center; - } - - .t-image{ - display: block; - margin:auto; - } -} - - -.user-listing { - margin: 10px 0px; - border-radius: 5px; - box-shadow: 0px 0px 3px #B8B8B8; - background-color: rgba(0, 0, 0, 0.6); - border: 1px solid #AAAAAA; - min-height: 100px; - padding: 8px 4px; - display: inline-table; - - /* AKA the listing title */ - h3 { - margin-top: 0px; - color: #F0AD4E; - font-weight: bold; - } - - h3:hover { - color: #D09D3E; - } - - .things { - padding: 0px 10px; - } - - p { - margin: 0; - } - div.row { - margin-left: 2%; - } -} - -// Limitation: Only one box can be expanded at a time -.collapsible { - .collapsed { display: block; } - .expanded { display: none; } - &:target { - .collapsed { display: none; } - .expanded { display: block; } - } -} - -.simple_captcha { - background-color: rgba(255, 255, 255, 0.7); - margin: 10px 0px; -} diff --git a/app/assets/stylesheets/bootstrapify.scss b/app/assets/stylesheets/bootstrapify.scss new file mode 100644 index 0000000..08421f9 --- /dev/null +++ b/app/assets/stylesheets/bootstrapify.scss @@ -0,0 +1,91 @@ +@import "bootstrap"; + +// Connect Bootstrap classes to reasonable defaults + +.btn { + @extend .btn-default; +} + +button, +a[role="button"], +input[type="submit"], +input[type="reset"], +input[type="button"] { + @extend .btn; +} + +.navbar { + form { + @extend .navbar-form; + } + .nav { + @extend .navbar-nav; + } + ul { + @extend .nav; + } +} +form { + // This list of types is taken from the 2014-04-29 draft of + // the HTML5 spec: + // http://www.w3.org/TR/2014/CR-html5-20140429/forms.html#attr-input-type + input[type="text"], + input[type="search"], + input[type="tel"], + input[type="url"], + input[type="email"], + input[type="password"], + input[type="date"], + input[type="time"], + input[type="number"], + input[type="range"], + input[type="color"], + select, textarea { + @extend .form-control; + } + label { + @extend .control-label; + } +} + +header nav { + @extend .navbar; + @extend .navbar-default; +} + +.alert { @extend .alert-default; } +.alert-success { @extend .alert; } +.alert-info { @extend .alert; } +.alert-warning { @extend .alert; } +.alert-danger { @extend .alert; } + +.panel-primary { @extend .panel; } +.panel-success { @extend .panel; } +.panel-info { @extend .panel; } +.panel-warning { @extend .panel; } +.panel-danger { @extend .panel; } +.panel { + h1, h2, h3, h4, h5, h6 { + @extend .panel-heading; + @extend .panel-title; + } +} + +// Connect built-in Rails classes to the Bootstrap classes. + +form { + .field { + @extend .form-group; + } + .field_with_errors { + @extend .has-error; + display: inline; + } +} + +#error_explanation { + @extend .panel-danger; + @extend .container; + padding-left: 0; + padding-right: 0; +} diff --git a/app/assets/stylesheets/brackets.css.scss b/app/assets/stylesheets/brackets.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/brackets.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/colors.css.scss b/app/assets/stylesheets/colors.css.scss deleted file mode 100644 index c875caa..0000000 --- a/app/assets/stylesheets/colors.css.scss +++ /dev/null @@ -1,5 +0,0 @@ -$darker-orange: #9D4102; -$link-yellow: #FFC50D; -$orange: #DD9125; -$page-color: #444; -$toolbar-color: black; diff --git a/app/assets/stylesheets/colors.scss b/app/assets/stylesheets/colors.scss new file mode 100644 index 0000000..4a5ca71 --- /dev/null +++ b/app/assets/stylesheets/colors.scss @@ -0,0 +1,32 @@ +/* +$darker-orange: #9D4102; +$link-yellow: #FFC50D; +$orange: #DD9125; +$page-color: #444; +$toolbar-color: black; +*/ + +// See this file for a complete list of variables: +// vendor/bundle/ruby/2.0.0/gems/bootstrap-sass-3.1.1.1/vendor/assets/stylesheets/bootstrap/_variables.scss +// Or visit (replace '@' with '$'; less uses '@' for variables) +// http://getbootstrap.com/customize/#less-variables +/* +$gray-darker: +$gray-dark: +$gray: +$gray-light: +$gray-lighter: + +$brand-primary: +$brand-success: +$brand-info: +$brand-warning: +$brand-danger: +*/ + +/* +$text-color: #DD9125; +$body-bg: #333; +*/ + +$legend-border-color: #ccc; // matches the default $input-border and $btn-default-border diff --git a/app/assets/stylesheets/games.css.scss b/app/assets/stylesheets/games.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/games.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/main.css.scss b/app/assets/stylesheets/main.css.scss deleted file mode 100644 index 15f5ac5..0000000 --- a/app/assets/stylesheets/main.css.scss +++ /dev/null @@ -1,13 +0,0 @@ -// Place all the styles related to the main controller here. -// They will automatically be included in application.css. -// You can use Sass (SCSS) here: http://sass-lang.com/ - -.jumbotron { - background-color: #FFF; - box-shadow: 1px 1px 20px black; - width: 93%; - - p { - line-height: 1.5em; - } -} diff --git a/app/assets/stylesheets/matches.css.scss b/app/assets/stylesheets/matches.css.scss deleted file mode 100644 index e3ad6e7..0000000 --- a/app/assets/stylesheets/matches.css.scss +++ /dev/null @@ -1,36 +0,0 @@ -#peer_review_boxes li { - cursor: move; - position: relative; - float: left; - margin: 5px; - width: 180px; - height: 240px; - border: 1px solid rgb(0, 0, 0); - text-align: center; - padding-top: 10px; - background-color: rgb(238, 238, 255); -} - -// Nothing uses this one right now -#peer_review_numeric li { - cursor: move; - position: relative; - float: left; - margin: 5px; - width: 180px; - height: 240px; - border: 1px solid rgb(0, 0, 0); - text-align: center; - padding-top: 10px; - background-color: rgb(238, 238, 255); -} - -/**** INDEX PAGE - TABLE AND GRAPH ****/ -#matches-table { - @extend .table; - color: #FFF; - - form { - color: #333; - } -} diff --git a/app/assets/stylesheets/pms.css.scss b/app/assets/stylesheets/pms.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/pms.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/scaffolds.scss b/app/assets/stylesheets/scaffolds.scss new file mode 100644 index 0000000..8fe3cc9 --- /dev/null +++ b/app/assets/stylesheets/scaffolds.scss @@ -0,0 +1,270 @@ +/* Mixins ***********************************************************/ +/* These are just here for other things to @extend. */ +/* Ok, they're really classes, but we don't use them like it. */ + +/* More elegant version of .input-group, which is over-complicated + because it supports all kind of things we don't always need to. + This is useful because it doesn't require extra HTML elements, + where .input-group does. */ +.simple-input-group { + white-space: nowrap; + display: table; + .btn, .form-control { + display: table-cell; + &:not(:last-child) { + float: left; + @include border-right-radius(0); + } + &:not(:first-child) { + @include border-left-radius(0); + border-left: 0; + } + } +} + +/* IDs **************************************************************/ +/* Specific page elements */ + +#notice { + @extend .alert-success; + @extend .container; + text-align: center; +} + +#alerts-ajax { + display: none; +} + + +form#search { + @extend .navbar-right; + @extend .simple-input-group; +} + +#user-actions { + @extend .navbar-btn; + @extend .navbar-left; + @extend .simple-input-group; + span { + padding-right: .25em; + } +} + +#error_explanation ul { + list-style: disc outside none; +} + +#players-needed { + text-align: center; + font-style: italic; +} + +#tournament-side-params { + background: none repeat scroll 0 0 rgba(0,0,0,0.5); + border-radius: 5px; + float: right; + font-size: 7px; + padding: 10px; + + p { + font-size: 10px; + margin-bottom: 5px; + } + +} + +#peer_review_boxes li { + cursor: move; + position: relative; + float: left; + margin: 5px; + width: 180px; + height: 240px; + border: 1px solid rgb(0, 0, 0); + text-align: center; + padding-top: 10px; + background-color: rgb(238, 238, 255); +} + +// Nothing uses this one right now +#peer_review_numeric li { + cursor: move; + position: relative; + float: left; + margin: 5px; + width: 180px; + height: 240px; + border: 1px solid rgb(0, 0, 0); + text-align: center; + padding-top: 10px; + background-color: rgb(238, 238, 255); +} + +/**** INDEX PAGE - TABLE AND GRAPH ****/ +#matches-table { + @extend .table; + color: #FFF; + + form { + color: #333; + } +} + +/* Classes **********************************************************/ + +/* +.btn { + &.user { @extend .btn-info; } + &.signup { @extend .btn-success; } + &.signin { @extend .btn-warning; } + &.signout { @extend .btn-danger; } + &.server { @extend .btn-warning; } + &.create-alert { + color: white; + background-color: rgb(255, 69, 0); + border-color: rgb(255, 69, 0); + } + &.alerts { + color: white; + background-color: hsl(0, 69%, 22%); + } +} +*/ + +form[role="button"] { + display: inline; +} + +/* Elements *********************************************************/ + +footer { + @extend .container; + margin-top: 1em; + border-top: solid 1px $hr-border; + text-align: center; +} + +fieldset { + border: solid 1px $legend-border-color; + border-radius: .5em; + padding: 1em; + margin: 1em 0; + legend { + display: block; + margin: 0; + padding: .25em .5em; + width: auto; + border: solid 1px $legend-border-color; + border-radius: .5em; + } +} + +form ul { + list-style: none; +} + +pre { + text-align: left; +} + +/* Misc *************************************************************/ + +.tournament-listing { + margin: 10px 0px; + border-radius: 5px; + box-shadow: 0px 0px 3px #B8B8B8; + background-color: rgba(0, 0, 0, 0.6); + border: 1px solid #AAAAAA; + min-height: 100px; + padding: 8px 4px; + + div.row { + margin-left: 2%; + } + p.message { + margin-top: 10px; + } + + /* AKA the listing title */ + h3 { + margin-top: 0px; + color: #F0AD4E; + font-weight: bold; + } + + h3:hover { + color: #D09D3E; + } + + /* host of the tournament */ + .host { + font-weight: bold; + color: #FFF; + } + + .col-md-8 { + padding: 0; + a { + padding: 5px 0 0 0; + } + } + + .t-game{ + font-weight: bold; + text-align: center; + } + + .t-image{ + display: block; + margin:auto; + } +} + + +.user-listing { + margin: 10px 0px; + border-radius: 5px; + box-shadow: 0px 0px 3px #B8B8B8; + background-color: rgba(0, 0, 0, 0.6); + border: 1px solid #AAAAAA; + min-height: 100px; + padding: 8px 4px; + display: inline-table; + + /* AKA the listing title */ + h3 { + margin-top: 0px; + color: #F0AD4E; + font-weight: bold; + } + + h3:hover { + color: #D09D3E; + } + + .things { + padding: 0px 10px; + } + + p { + margin: 0; + } + div.row { + margin-left: 2%; + } +} + +// Limitation: Only one box can be expanded at a time +.collapsible { + .collapsed { display: block; } + .expanded { display: none; } + &:target { + .collapsed { display: none; } + .expanded { display: block; } + } +} + +.simple_captcha { + background-color: rgba(255, 255, 255, 0.7); + margin: 10px 0px; +} diff --git a/app/assets/stylesheets/search.css.scss b/app/assets/stylesheets/search.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/search.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/servers.css.scss b/app/assets/stylesheets/servers.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/servers.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/sessions.css.scss b/app/assets/stylesheets/sessions.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/sessions.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/teams.css.scss b/app/assets/stylesheets/teams.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/teams.css.scss +++ /dev/null diff --git a/app/assets/stylesheets/tournaments.css.scss b/app/assets/stylesheets/tournaments.css.scss deleted file mode 100644 index 0b8aa99..0000000 --- a/app/assets/stylesheets/tournaments.css.scss +++ /dev/null @@ -1,47 +0,0 @@ -// Place all the styles related to the tournaments controller here. -// They will automatically be included in application.css. -// You can use Sass (SCSS) here: http://sass-lang.com/ - -@import "colors"; - -#players-needed { - text-align: center; - font-style: italic; -} - -#tournament-side-params { - background: none repeat scroll 0 0 rgba(0,0,0,0.5); - border-radius: 5px; - float: right; - font-size: 7px; - padding: 10px; - - p { - font-size: 10px; - margin-bottom: 5px; - } - -} - -ul#tournament-users { - list-style: none; - padding: 0; - margin: 0; - li { - // Make the bullet green, but the text white - padding-left: 1em; - text-indent: -.7em; - &:before { - content: "• "; - color: #10A010; - } - color: white; - } -} - -div.leave-buttons { - margin-top: 50px; - form { - display: inline; - } -} diff --git a/app/assets/stylesheets/users.css.scss b/app/assets/stylesheets/users.css.scss deleted file mode 100644 index e69de29..0000000 --- a/app/assets/stylesheets/users.css.scss +++ /dev/null diff --git a/app/controllers/servers_controller.rb b/app/controllers/servers_controller.rb index 83a9f31..6ae879f 100644 --- a/app/controllers/servers_controller.rb +++ b/app/controllers/servers_controller.rb @@ -13,7 +13,7 @@ class ServersController < ApplicationController def update respond_to do |format| if @server.update(server_params) - format.html { redirect_to @server, notice: 'Server was successfully updated.' } + format.html { redirect_to edit_server_url, notice: 'Server was successfully updated.' } format.json { head :no_content } else format.html { render action: 'edit' } diff --git a/app/views/common/_show_tournament.html.erb b/app/views/common/_show_tournament.html.erb index c0237b1..87a4f5b 100644 --- a/app/views/common/_show_tournament.html.erb +++ b/app/views/common/_show_tournament.html.erb @@ -24,22 +24,20 @@ <div class="col-md-2 col-sm-2 col-xs-2"> <% if signed_in? %> <% if !target.players.include?(current_user) && target.status == 0 %> - <%= form_tag(tournament_path(target), method: "put") do %> - <p> + <%= form_tag(tournament_path(target), method: "put", role: :button) do %> <input type="hidden" name="update_action" value="join"> <%= submit_tag("Join")%> - <% end %> - </p> + <% end %> <% elsif target.players.include?(current_user)%> <p class="message">You've signed up for this tournament!</p> <% end %> <% @user_bracket = target.brackets.find_by(user: current_user) %> <% if target.status == 1 && target.stages.order(:id).first.scheduling_method == "elimination" && target.stages.order(:id).first.matches.order(:id).first.status < 2 && !@user_bracket %> - <%= form_tag(tournament_brackets_path(target), method: "post") do %> + <%= form_tag(tournament_brackets_path(target), method: "post", role: :button) do %> <%= submit_tag("Make Bracket") %> <% end %> <% elsif @user_bracket && target.status == 4 %> - <%= form_tag(tournament_bracket_path(@tournament, @bracket), method: 'put') do %> + <%= form_tag(tournament_bracket_path(@tournament, @bracket), method: 'put', role: :button) do %> <input type="hidden" name="update_action" value="results"> <%= submit_tag("Bracket Results") %> <% end %> diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index af26e29..92ca6ad 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -1,10 +1,9 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> <title>Leaguer</title> <%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %> - <%= stylesheet_link_tag "#{params[:controller]}", media: "all", "data-turbolinks-track" => true %> <%= javascript_include_tag "application", "data-turbolinks-track" => true %> <%= javascript_include_tag "#{params[:controller]}", "data-turbolinks-track" => true %> @@ -16,42 +15,51 @@ <body> <header> <nav> - <%# This is the logo %> - <div class="navbar-brand"><%= link_to('Leaguer', root_path) %></div> - - <%# This is the search bar #%> - <div> - <%= form_tag("/search", method: "get", :class => "search") do %> - <%= text_field_tag(:query, params[:query], type: "search") %> - <%= submit_tag("Search", :name=>nil) %> - <% end %> - </div> - - <%# these are the log in buttons #%> - <div id="log-buttons"> - <% if signed_in? %> - <%= link_to current_user.user_name, current_user, :class => "user" %> - <%= link_to "Messages", pms_path, :class => "signup" %> - <% if current_user.can? :edit_server %> - <%= link_to "Server settings", edit_server_path, :class => "server" %> - <% end %> - <% if current_user.can? :create_alert %> - <%= link_to "Create Alert", new_alert_path, :class => "create-alert" %> - <% end %> - <%= link_to "Sign out", session_path("current"), method: "delete", :class => "signout" %> - <%# if there is an unread alert then I wanna be able to show the notification icon by saying :style => display:inline. This will be Done by Guntas once he figures out how to get unread alerts. Psuedo if alerts.unread > 0 then display else don't.%> - <%= link_to "", alerts_path, :class => "alerts", :id => "alerts-ajax"%> - <% else %> - <%= link_to "Log in", new_session_path, :class => "signin" %> - <%= link_to "Sign up", new_user_path, :class => "signup" %> - <% end %> - </div> + <div class="container-fluid"> + <div class="navbar-header"> + <%= link_to('Leaguer', root_path, class: "navbar-brand") %> + </div> + <div class="navbar-collapse"> + <div id="user-actions"> + <span> + <% if signed_in? %> + <%= link_to current_user.user_name, current_user, :class => "user", :role => :button %> + <%= link_to "Sign out", session_path("current"), method: "delete", :class => "signout", :role => :button %> + <% else %> + <%= link_to "Log in", new_session_path, :class => "signin", :role => :button %> + <%= link_to "Sign up", new_user_path, :class => "signup", :role => :button %> + <% end %> + </span> + <% if current_user.can? :create_alert %> + <span><%= link_to "Create Alert", new_alert_path, :class => "create-alert", :role => :button %></span> + <% end %> + </div> + <% if signed_in? %> + <ul> + <li><%= link_to "Messages", pms_path %></li> + <% if current_user.can? :edit_server %> + <li><%= link_to "Server settings", edit_server_path, :class => "server" %></li> + <% end %> + </ul> + <%# If there is an unread alert then I want to be able + to show the notification icon by saying :style => + display:inline. This will be Done by Guntas once + he figures out how to get unread alerts. Psuedo if + alerts.unread > 0 then display else don't.%> + <%= link_to "", alerts_path, :class => "alerts", :id => "alerts-ajax"%> + <% end %> + <%= form_tag("/search", method: :get, :id => "search") do %><div> + <%= text_field_tag(:query, params[:query], type: :search) %> + <%= submit_tag "Search" %> + </div><% end %> + </div> + </div> </nav> </header> <% if notice %><div id="notice"><p><%= notice %></p></div><% end %> -<div class="wrapper"> +<div class="container"> <%= yield %> </div> diff --git a/app/views/main/homepage.html.erb b/app/views/main/homepage.html.erb index 3ca8176..5acd4ae 100644 --- a/app/views/main/homepage.html.erb +++ b/app/views/main/homepage.html.erb @@ -1,18 +1,13 @@ -<div role="main" class="container theme-showcase"> - - <div class="jumbotron"> - <h1>Welcome to Leaguer</h1> - <p>This is a tournment management system designed to be used for any team sport. Our peer review system ensures that the best players move on to the next round! Try creating a new tournament and having people sign up for it. </p> - <p id="jumbo-buttons"> - <% if !signed_in? %> - <%= link_to 'Log In', new_session_path, :class => "btn btn-warning btn-lg", :role => "button" %> - <%= link_to 'Sign Up', new_user_path, :class => "btn btn-warning btn-lg", :role => "button" %> - <% else %> - <%= link_to 'Start a Tournament', new_tournament_path, :class => "btn btn-warning btn-lg", :role => "button" %> - <% end %> - <%= link_to 'See Ongoing Tournaments', tournaments_path, :class => "btn btn-warning btn-lg", :role => "button" %> - - </p> - </div> - - </div> +<div class="jumbotron"> + <h1>Welcome to Leaguer</h1> + <p>This is a tournment management system designed to be used for any team sport. Our peer review system ensures that the best players move on to the next round! Try creating a new tournament and having people sign up for it. </p> + <p id="jumbo-buttons"> + <% if !signed_in? %> + <%= link_to 'Log In', new_session_path, :class => "signin", :role => "button" %> + <%= link_to 'Sign Up', new_user_path, :class => "signup", :role => "button" %> + <% else %> + <%= link_to 'Start a Tournament', new_tournament_path, :role => "button" %> + <% end %> + <%= link_to 'See Ongoing Tournaments', tournaments_path, :role => "button" %> + </p> +</div> diff --git a/app/views/pms/show.html.erb b/app/views/pms/show.html.erb index 2c93102..35deaa9 100644 --- a/app/views/pms/show.html.erb +++ b/app/views/pms/show.html.erb @@ -1,48 +1,46 @@ -<p> - <strong>Participants:</strong> - <% receps = @pm.conversation.participants %> - <% receps.each do |recep| %> - <% #unless recep == @pm.conversation.last_sender %> - <%= recep.user_name %> - <%= "," %> - <% #end %> - <% end %> - <%= "and the NSA" %> -</p> - -<p> - <strong>Subject:</strong> - <%= @pm.conversation.subject %> -</p> +<%= link_to '« Back to all private messages', pms_path, class: :breadcrumb %> + +<div> + <p> + <strong>Participants:</strong> + <% receps = @pm.conversation.participants %> + <% receps.each do |recep| %> + <% #unless recep == @pm.conversation.last_sender %> + <%= recep.user_name %>, + <% #end %> + <% end %> + <%= "and the NSA" %> + </p> + + <p> + <strong>Subject:</strong> + <%= @pm.conversation.subject %> + </p> +</div> <% receipts = @pm.conversation.receipts_for current_user %> <% receipts.each do |receipt| %> - <% message = receipt.message %> - - <p> ________________________________________________ </p> - - <p> - <b><%= message.sender.user_name %></b> - <%= ":" %> - <%= message.body %> - </p> - + <% message = receipt.message %> + <hr> + <p> + <strong><%= message.sender.user_name %>:</strong> + <%= message.body %> + </p> <% end %> -<p> ________________________________________________ </p> -<p> - <% @pm.message = "" %> - <%= form_for(@pm) do |f| %> - <div class="field"> - <%= f.text_area :message %> - </div> +<hr> - <div class="actions"> - <%= submit_tag("Reply", :class => "signup") %> - </div> +<div> + <% @pm.message = "" %> + <%= form_for(@pm) do |f| %> + <div class="field"> + <%= f.text_area :message %> + </div> - <% end %> -</p> + <div class="actions"> + <%= submit_tag("Reply", :class => "signup") %> + </div> + <% end %> +</div> <% @pm.conversation.mark_as_read(current_user) %> -<%= link_to 'Back', pms_path %> diff --git a/app/views/servers/_form.html.erb b/app/views/servers/_form.html.erb index fd887f3..22e3e82 100644 --- a/app/views/servers/_form.html.erb +++ b/app/views/servers/_form.html.erb @@ -6,7 +6,7 @@ <legend>Default permissions for new users</legend> <ul> <% @server.default_user_abilities.keys.each do |ability| %> - <li><label><%= a.check_box(ability) %> <%= ability.to_s.humanize %></label></li> + <li><%= a.check_box(ability) %> <%= a.label(ability) %></li> <% end %> </ul> </fieldset> diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb index 97f09b6..1b60ca7 100644 --- a/app/views/sessions/new.html.erb +++ b/app/views/sessions/new.html.erb @@ -3,23 +3,23 @@ <div> <%= form_tag(sessions_path, method: :post, id: :new_session) do %> <% if params[:action] == "create" %> - <div id="error_explanation"> + <div class="alert-danger"> <p>The username/password pair you entered did not match our records. Check your typing and try again.</p> </div> <% end %> - <p> + <div class="field"> <%= label_tag(:username_or_email, "Username/Email") %><br/> <%= text_field_tag(:username_or_email) %> - </p> - <p> + </div> + <div class="field"> <%= label_tag(:password) %><br/> <%= password_field_tag(:password) %> - </p> - <p> + </div> + <div class="field"> <%= submit_tag("Log in", class: :signin) %> - </p> + </div> <% end %> <p>New user? <%= link_to("Sign up now!", new_user_path) %></p> diff --git a/app/views/tournaments/_form.html.erb b/app/views/tournaments/_form.html.erb index f53927d..72e0886 100644 --- a/app/views/tournaments/_form.html.erb +++ b/app/views/tournaments/_form.html.erb @@ -1,12 +1,20 @@ <%= render "common/error_messages", :target => @tournament %> <fieldset> - <legend>Game Type</legend> + <legend>Basic information</legend> <%= form_for(@tournament, url: new_tournament_path, method: "get") do |f| %> - <p> + <div class="field"> <%= f.label :game_id, "Select a Game Type" %> <%= f.select(:game_id, Game.all.map{|game| [game.name, game.id]}) %> - <%= f.submit("Select") %> - </p> + </div> + <div class="field"> + <label for="num_stages">Number of Tournament Stages</label> + <input type="number" id="num_stages" name="num_stages" min="1" value="<%= params[:num_stages].to_i %>"> + </div> + <% if @tournament.game %> + <%= f.submit("Update (Will reset the rest of the form)", class: "btn-danger") %> + <% else %> + <%= f.submit("Submit") %> + <% end %> <% end %> </fieldset> @@ -16,10 +24,10 @@ <legend>Attributes</legend> <%= f.hidden_field(:game_id) %> - <p> + <div class="field"> <%= f.label :name %> <%= f.text_field :name %> - </p> + </div> <table> <tbody> @@ -41,17 +49,17 @@ </tbody> </table> - <p> + <div class="field"> <%= f.label :scoring_method, :scoring_method.to_s.titleize %> <%= f.select(:scoring_method, @tournament.scoring_methods.map{|method| [method.humanize.titleize, method]}) %> - </p> + </div> </fieldset> <fieldset> <legend>Settings</legend> <%= f.fields_for :settings do |setting_fields| %> <% @tournament.tournament_settings.each do |setting| %> - <p> + <div class="field"> <%= setting_fields.label setting.name, setting.name.to_s.titleize %> <br> <% case setting.vartype %> @@ -77,7 +85,7 @@ <% when 5 %> <%= setting_fields.select( setting.name, setting.type_opt.split(',').collect {|opt| opt.humanize.titleize} ) %> <% end %> - </p> + </div> <% end %> <% end %> </fieldset> @@ -85,17 +93,18 @@ <%= f.fields_for :stages do |stages_fields| %> <fieldset> <legend>Stages</legend> - <label for="num_stages">Number of Tournament Stages</label> - <input type="number" name="num_stages" min="1" value="<%= params[:num_stages].to_i %>"> - <%# stage_fields.submit("Set Stages") %> <% for i in 1..(params[:num_stages].to_i) do %> <%= stages_fields.fields_for i.to_s do |stage_fields| %> <fieldset> <legend>Stage <%= i %></legend> - <%= stage_fields.label :scheduling_method, :scheduling_method.to_s.titleize %> - <%= stage_fields.select(:scheduling_method, @tournament.scheduling_methods.map{|method| [method.humanize.titleize, method]}) %> - <%= stage_fields.label :seeding_method, :seeding_method.to_s.titleize %> - <%= stage_fields.select(:seeding_method, @tournament.seeding_methods.map{|method| [method.humanize.titleize, method]}) %> + <div class="field"> + <%= stage_fields.label :scheduling_method, :scheduling_method.to_s.titleize %> + <%= stage_fields.select(:scheduling_method, @tournament.scheduling_methods.map{|method| [method.humanize.titleize, method]}) %> + </div> + <div class="field"> + <%= stage_fields.label :seeding_method, :seeding_method.to_s.titleize %> + <%= stage_fields.select(:seeding_method, @tournament.seeding_methods.map{|method| [method.humanize.titleize, method]}) %> + </div> </fieldset> <% end %> <% end %> diff --git a/app/views/tournaments/show.html.erb b/app/views/tournaments/show.html.erb index 7e3fbae..07c1c6b 100644 --- a/app/views/tournaments/show.html.erb +++ b/app/views/tournaments/show.html.erb @@ -1,3 +1,5 @@ +<%= link_to '« Back to all tournaments', tournaments_path, class: :breadcrumb %> + <h2 id="tournament-name"> <%= @tournament.name %> </h2> @@ -72,33 +74,26 @@ <% end %> </div> -<div class="leave-buttons"> - <%# If user can join, and user hasn't joined already, show the join tournment tag %> +<div class="actions"> + <%# If user can join, and user hasn't joined already, show a join tournment button %> <% if @tournament.joinable_by?(current_user) && !@tournament.players.include?(current_user) %> - <%= form_tag(tournament_path(@tournament), method: "put") do %> + <%= form_tag(tournament_path(@tournament), method: "put", role: :button) do %> <input type="hidden" name="update_action" value="join"> <%= submit_tag("Join Tournament") %> <% end %> <% elsif @tournament.players.include?(current_user) %> - <%= form_tag(tournament_path(@tournament), method: "put") do %> + <%= form_tag(tournament_path(@tournament), method: "put", role: :button) do %> <input type="hidden" name="update_action" value="leave"> <%= submit_tag("Leave Tournament") %> <% end %> <% end %> - <%# If user is the host, let them start the tournment %> - <% if @tournament.hosts.include?(current_user) %> - <%= form_tag(tournament_path(@tournament), method: "put") do %> + <% if @tournament.check_permission(current_user, :edit) %> + <%= form_tag(tournament_path(@tournament), method: "put", role: :button) do %> <input type="hidden" name="update_action" value="start"> - <% if @tournament.players.count >= @tournament.min_players_per_team * @tournament.min_teams_per_match %> - <%= submit_tag("Start Tournament") %> - <% else %> - <%= submit_tag("Start Tournament", disabled: true) %> - <% end %> + <%= submit_tag("Start Tournament", disabled: (@tournament.players.count < @tournament.min_players_per_team * @tournament.min_teams_per_match)) %> <% end %> - <%= link_to 'Edit', edit_tournament_path(@tournament) %> | - <%= link_to 'Cancel Tournament', @tournament, method: :delete, data: { confirm: 'Are you sure?' } %> + <%= link_to 'Edit Tournament', edit_tournament_path(@tournament), role: :button %> + <%= link_to 'Cancel Tournament', @tournament, method: :delete, data: { confirm: 'Are you sure?' }, role: :button %> <% end %> </div> - -<%= link_to 'Back', tournaments_path %> diff --git a/app/views/users/_form.html.erb b/app/views/users/_form.html.erb index 1feebf8..23f8977 100644 --- a/app/views/users/_form.html.erb +++ b/app/views/users/_form.html.erb @@ -31,7 +31,7 @@ <ul> <%= fields_for "user[abilities]", @user.abilities do |abilities_fields| %> <% @user.abilities.keys.each do |ability| %> - <li><label><%= abilities_fields.check_box(ability) %> <%= ability.to_s.humanize %></label></li> + <li><%= abilities_fields.check_box(ability) %> <%= abilities_fields.label(ability) %></li> <% end %> <% end %> </ul> diff --git a/app/views/users/new.html.erb b/app/views/users/new.html.erb index 5c88945..95b56a9 100644 --- a/app/views/users/new.html.erb +++ b/app/views/users/new.html.erb @@ -1,34 +1,34 @@ <h1> Sign Up </h1> <%= form_for @user do |f| %> - <%= render "common/error_messages", :target => @user %> - <p> - <%= f.label :name %><br> - <%= f.text_field :name %> - </p> - <p> - <%= f.label :email %><br> - <%= f.text_field(:email, type: "email") %> - </p> - <p> - <%= f.label :user_name %><br> - <%= f.text_field :user_name %> - </p> - <p> - <%= f.label :password %><br> - <%= f.password_field :password %> - </p> - <p> - <%= f.label(:password_confirmation, "Confirm Password") %><br> - <%= f.password_field :password_confirmation %> - </p> - <p> - <%= show_simple_captcha %> - - <%= f.submit("Be a Leaguer", :class => "signup") %> - </p> + <%= render "common/error_messages", :target => @user %> + <div class="field"> + <%= f.label :name %><br> + <%= f.text_field :name %> + </div> + <div class="field"> + <%= f.label :email %><br> + <%= f.text_field(:email, type: "email") %> + </div> + <div class="field"> + <%= f.label :user_name %><br> + <%= f.text_field :user_name %> + </div> + <div class="field"> + <%= f.label :password %><br> + <%= f.password_field :password %> + </div> + <div class="field"> + <%= f.label(:password_confirmation, "Confirm Password") %><br> + <%= f.password_field :password_confirmation %> + </div> + <div class="field"> + <%= show_simple_captcha %> + </div> + <div class="actions"> + <%= f.submit("Be a Leaguer", :class => "signup") %> + </div> <% end %> - <%= link_to 'Already Have an Account? Log in', new_session_path, :class => "signin" %> diff --git a/app/views/users/show.html.erb b/app/views/users/show.html.erb index b247b7d..cd232a3 100644 --- a/app/views/users/show.html.erb +++ b/app/views/users/show.html.erb @@ -2,56 +2,55 @@ <h1> <%= @user.user_name %>'s Profile </h1> <p> - <%= image_tag 'http://www.gravatar.com/avatar/' + Digest::MD5.hexdigest(@user.email) + '?s=100&d=identicon' %> + <%= image_tag 'http://www.gravatar.com/avatar/' + Digest::MD5.hexdigest(@user.email) + '?s=100&d=identicon' %> </p> <p> - <strong>Email:</strong> - <%= @user.email %> -</p> - + <strong>Name:</strong> + <%= @user.name %> <p> - <strong>Preferred name:</strong> - <%= @user.user_name %> -</p> <p> - <strong>Relationship Status:</strong> - too single + <strong>Alias:</strong> + <%= @user.user_name %> +<p> + <strong>Email:</strong> + <%= @user.email %> </p> - -<p> -<% if @user.remote_usernames[0].nil? %> +<% if @user.remote_usernames.empty? and @user.check_permission(current_user, :edit) %> <%= form_for @user do |f| %> - <label>Have a League of Legends Account? - <input type=text name="user[remote_usernames][League of Legends]"> - </label> - <%= f.submit "Add Username", :class => 'signup' %> + <div class="field"> + <label for="summoner_name">Have a League of Legends Account?</label> + <div class="simple-input-group"> + <input type="text" id="summoner_name" name="user[remote_usernames][League of Legends]"> + <%= f.submit "Add Username", :class => 'signup' %> + </div> + </div> <% end %> <% end %> -</p> - <div class="row"> <div class="col-md-6"> - <h3> Recent Tournaments Played </h3> + <h3>Recent Tournaments Played</h3> <ul> <% @user.tournaments_played.each do |t| %> <li><%= t.name %></li> <% end %> </ul> - </div> - <div class="col-md-6"> - <h3> Recent Tournaments Hosted </h3> - <% if @user.tournaments_hosted.count == 0 %> <p> <%= @user.user_name %> has never hosted a tournament </p> <%end %> - <ul> - <% @user.tournaments_hosted.each do |t| %> - <li><%= t.name %></li> - <% end %> - </ul> + </div> + <div class="col-md-6"> + <h3>Recent Tournaments Hosted</h3> + <% if @user.tournaments_hosted.empty? %> + <p><%= @user.user_name %> has never hosted a tournament.</p> + <% else %> + <ul> + <% @user.tournaments_hosted.each do |t| %> + <li><%= t.name %></li> + <% end %> + </ul> + <% end %> </div> </div> -<%= link_to 'Edit', edit_user_path(@user) %> | -<%= link_to 'All Users', users_path %> +<%= link_to 'Edit', edit_user_path(@user), role: :button %> diff --git a/config/initializers/form_improvements.rb b/config/initializers/form_improvements.rb new file mode 100644 index 0000000..c91dce8 --- /dev/null +++ b/config/initializers/form_improvements.rb @@ -0,0 +1,31 @@ +# -*- ruby-indent-level: 2; indent-tabs-mode: nil -*- +module ActionView + module Helpers + module FormTagHelper + + # This is modified from actionpack-4.0.2/lib/action_view/helpers/form_tag_helper.rb#submit_tag + def submit_tag(value = "Save changes", options = {}) + options = options.stringify_keys + + if disable_with = options.delete("disable_with") + message = ":disable_with option is deprecated and will be removed from Rails 4.1. " \ + "Use 'data: { disable_with: \'Text\' }' instead." + ActiveSupport::Deprecation.warn message + + options["data-disable-with"] = disable_with + end + + if confirm = options.delete("confirm") + message = ":confirm option is deprecated and will be removed from Rails 4.1. " \ + "Use 'data: { confirm: \'Text\' }' instead'." + ActiveSupport::Deprecation.warn message + + options["data-confirm"] = confirm + end + + content_tag(:button, value, { "type" => "submit", "name" => "commit", "value" => value }.update(options)) + end + + end + end +end |