From 9127b3aca0ea384877e05d54fd01bb1d9d3b812f Mon Sep 17 00:00:00 2001 From: amurrel Date: Fri, 5 Sep 2014 23:54:31 -0400 Subject: Converted from scss to less --- app/assets/stylesheets/application.css.less | 8 + app/assets/stylesheets/application.css.scss | 8 - app/assets/stylesheets/bootstrapify.less | 117 +++++++++++ app/assets/stylesheets/bootstrapify.scss | 116 ----------- app/assets/stylesheets/colors.less | 32 +++ app/assets/stylesheets/colors.scss | 32 --- app/assets/stylesheets/scaffolds.less | 305 ++++++++++++++++++++++++++++ app/assets/stylesheets/scaffolds.scss | 303 --------------------------- 8 files changed, 462 insertions(+), 459 deletions(-) create mode 100644 app/assets/stylesheets/application.css.less delete mode 100644 app/assets/stylesheets/application.css.scss create mode 100644 app/assets/stylesheets/bootstrapify.less delete mode 100644 app/assets/stylesheets/bootstrapify.scss create mode 100644 app/assets/stylesheets/colors.less delete mode 100644 app/assets/stylesheets/colors.scss create mode 100644 app/assets/stylesheets/scaffolds.less delete mode 100644 app/assets/stylesheets/scaffolds.scss diff --git a/app/assets/stylesheets/application.css.less b/app/assets/stylesheets/application.css.less new file mode 100644 index 0000000..c6020bd --- /dev/null +++ b/app/assets/stylesheets/application.css.less @@ -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.css.scss b/app/assets/stylesheets/application.css.scss deleted file mode 100644 index c6020bd..0000000 --- a/app/assets/stylesheets/application.css.scss +++ /dev/null @@ -1,8 +0,0 @@ -/* - * 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/bootstrapify.less b/app/assets/stylesheets/bootstrapify.less new file mode 100644 index 0000000..eb3b86b --- /dev/null +++ b/app/assets/stylesheets/bootstrapify.less @@ -0,0 +1,117 @@ +/* Copyright (C) 2014 Andrew Murrell + * Copyright (C) 2014 Davis Webb + * Copyright (C) 2014 Guntas Grewal + * Copyright (C) 2014 Luke Shumaker + * Copyright (C) 2014 Nathaniel Foy + * Copyright (C) 2014 Tomer Kimia + * + * This file is part of Leaguer. + * + * Leaguer is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * Leaguer is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the Affero GNU General Public License + * along with Leaguer. If not, see . + */ + +@import "bootstrap"; + +// Connect Bootstrap classes to reasonable defaults + +.btn { + &:extend(.btn-default); +} + +button, +*[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, +.alert-info, +.alert-warning, +.alert-danger { &:extend(.alert); } + +.panel-primary, +.panel-success, +.panel-info, +.panel-warning, +.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 { + display: inline !important; + } + } + .field_with_errors { + &:extend(.has-error); + } +} + +#error_explanation { + &:extend(.panel-danger); + &:extend(.container); + padding-left: 0; + padding-right: 0; +} diff --git a/app/assets/stylesheets/bootstrapify.scss b/app/assets/stylesheets/bootstrapify.scss deleted file mode 100644 index 316847a..0000000 --- a/app/assets/stylesheets/bootstrapify.scss +++ /dev/null @@ -1,116 +0,0 @@ -/* Copyright (C) 2014 Andrew Murrell - * Copyright (C) 2014 Davis Webb - * Copyright (C) 2014 Guntas Grewal - * Copyright (C) 2014 Luke Shumaker - * Copyright (C) 2014 Nathaniel Foy - * Copyright (C) 2014 Tomer Kimia - * - * This file is part of Leaguer. - * - * Leaguer is free software: you can redistribute it and/or modify - * it under the terms of the GNU Affero General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * Leaguer is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU Affero General Public License for more details. - * - * You should have received a copy of the Affero GNU General Public License - * along with Leaguer. If not, see . - */ - -@import "bootstrap"; - -// Connect Bootstrap classes to reasonable defaults - -.btn { - @extend .btn-default; -} - -button, -*[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 { - display: inline !important; - } - } - .field_with_errors { - @extend .has-error; - } -} - -#error_explanation { - @extend .panel-danger; - @extend .container; - padding-left: 0; - padding-right: 0; -} diff --git a/app/assets/stylesheets/colors.less b/app/assets/stylesheets/colors.less new file mode 100644 index 0000000..61e1e57 --- /dev/null +++ b/app/assets/stylesheets/colors.less @@ -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.less +// Or visit: +// 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/colors.scss b/app/assets/stylesheets/colors.scss deleted file mode 100644 index 4a5ca71..0000000 --- a/app/assets/stylesheets/colors.scss +++ /dev/null @@ -1,32 +0,0 @@ -/* -$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/scaffolds.less b/app/assets/stylesheets/scaffolds.less new file mode 100644 index 0000000..bbdd989 --- /dev/null +++ b/app/assets/stylesheets/scaffolds.less @@ -0,0 +1,305 @@ +/* Copyright (C) 2014 Andrew Murrell + * Copyright (C) 2014 Davis Webb + * Copyright (C) 2014 Guntas Grewal + * Copyright (C) 2014 Luke Shumaker + * Copyright (C) 2014 Nathaniel Foy + * Copyright (C) 2014 Tomer Kimia + * + * This file is part of Leaguer. + * + * Leaguer is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * Leaguer is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the Affero GNU General Public License + * along with Leaguer. If not, see . + */ + +/* 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; + span { + display: table-cell; + } + .btn, .form-control { + display: table-cell !important; + /* .simple-input-group .btn:not(:last-child), + * .simple-input-group .form-control:not(:last-child) { ... } */ + &:not(:last-child) { + @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-left); + div { + &:extend(.simple-input-group); + } +} + +#user-actions { + &:extend(.navbar-btn); + &:extend(.navbar-right); + &: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.button_to, form.button_to div { + display: inline; +} + +div.field span.help-block { + float: right; + margin-top: 0; + margin-bottom: 0; +} + +/* 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/scaffolds.scss b/app/assets/stylesheets/scaffolds.scss deleted file mode 100644 index a223672..0000000 --- a/app/assets/stylesheets/scaffolds.scss +++ /dev/null @@ -1,303 +0,0 @@ -/* Copyright (C) 2014 Andrew Murrell - * Copyright (C) 2014 Davis Webb - * Copyright (C) 2014 Guntas Grewal - * Copyright (C) 2014 Luke Shumaker - * Copyright (C) 2014 Nathaniel Foy - * Copyright (C) 2014 Tomer Kimia - * - * This file is part of Leaguer. - * - * Leaguer is free software: you can redistribute it and/or modify - * it under the terms of the GNU Affero General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * Leaguer is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU Affero General Public License for more details. - * - * You should have received a copy of the Affero GNU General Public License - * along with Leaguer. If not, see . - */ - -/* 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; - span { - display: table-cell; - } - .btn, .form-control { - display: table-cell !important; - &:not(:last-child) { - @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-left; - div { - @extend .simple-input-group; - } -} - -#user-actions { - @extend .navbar-btn; - @extend .navbar-right; - @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.button_to, form.button_to div { - display: inline; -} - -div.field span.help-block { - float: right; - margin-top: 0; - margin-bottom: 0; -} - -/* 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; -} -- cgit v1.1-4-g5e80