hackathon_manager 0.4.4 → 0.5.0

data/app/assets/stylesheets/hackathon_manager/general/_button.sass

@@ -1,29 +1,33 @@
 .button, input[type=submit]
-  background: $secondary
-  border: 0
+  background: $button--background
+  border: 1px solid $button--border
   cursor: pointer
   display: inline-block
-  padding: 0.8em 1.5em !important // TODO: only for nav button... find a better fix
+  padding: 0.6em 1.3em !important
   font-size: 15px
-  border-radius: 30px
+  border-radius: 0
   text-transform: uppercase
-  color: $white_pure
+  color: $button--text
   font-weight: 600 !important
-  margin: 0.5em 0.5em 0.5em 0
   text-align: center
   text-decoration: none
   -webkit-appearance: none
-  @include transition(200ms, all, ease-in-out, 0ms)
+  @include transition(150ms, all, ease-in-out, 0ms)
+  @include box-shadow(0 2px 15px rgba($button--background, 0.3))
+  @include border-radius(3px)
+
+  &.button--with-margin
+    margin: 0.5em 0.5em 0.5em 0
 
   &.small
     font-size: 1rem
     min-width: initial
     padding: 3px 5px
   &:hover, &:focus
-    background: lighten($secondary, 15%)
-    @include box-shadow(inset 0 0 10px 3px lighten($secondary, 5%))
-    color: $white_pure
-    outline-color: $secondary
+    background: $button--background--hover
+    border-color: $button--border--hover
+    color: $button--text--hover
+    outline-color: $button--background--hover
   &:disabled
     color: lighten($secondary, 40%)
     background: transparent

data/app/assets/stylesheets/hackathon_manager/general/_header.sass

@@ -0,0 +1,67 @@
+$account-nav-spacing-horiz: 20px
+$account-nav-padding-vert: 15px
+
+.header
+  width: 100%
+  height: 80px
+  display: flex
+  flex-flow: row nowrap
+  justify-content: center
+  background: $grey-dark
+
+.header__wrapper
+  display: flex
+  flex-flow: row nowrap
+  justify-content: space-between
+
+.header-logo__image
+  height: 70px
+  width: auto
+  margin: 5px 0
+
+.header-nav
+  display: flex
+  align-items: center
+  .button
+    margin-right: 10px
+    &:last-child
+      margin-right: 0
+
+.account-nav
+  border-bottom: 1px solid $account-nav--border-color
+  width: 100%
+  display: flex
+  flex-flow: row nowrap
+  justify-content: center
+
+.account-nav__wrapper
+  width: 100%
+  max-width: 670px
+  padding: 0 5px
+  overflow: hidden
+
+.account-nav__links
+  display: flex
+  flex-flow: row wrap
+  margin-left: -1 * $account-nav-spacing-horiz
+  margin-right: -1 * $account-nav-spacing-horiz
+  @media (max-width: 700px)
+    justify-content: center
+
+.account-nav__link
+  display: flex
+  padding: $account-nav-padding-vert 2px $account-nav-padding-vert
+  margin-left: $account-nav-spacing-horiz
+  margin-right: $account-nav-spacing-horiz
+  text-transform: uppercase
+  font-weight: $font-bold
+  color: $account-nav--text
+  @media (max-width: 700px)
+    margin-left: 10px
+    margin-right: 10px
+
+.account-nav__link--active
+  color: $account-nav--text--active
+  border-bottom: 4px solid $account-nav--border-color--active
+  padding-bottom: $account-nav-padding-vert - 3px
+  margin-bottom: -1px

data/app/assets/stylesheets/hackathon_manager/general/_main.sass

@@ -1,4 +1,6 @@
 #main
   height: 100%
-  margin-left: 200px
-  @include transition(200ms, margin, ease-in-out, 0s)
+
+.session-link
+  font-weight: bold
+  text-transform: uppercase

data/app/assets/stylesheets/hackathon_manager/general/_mixins.sass

@@ -1,58 +1,64 @@
+@mixin transition($duration, $property, $function, $delay)
+  -webkit-transition: $duration $property $function $delay
+  -moz-transition-duration: $duration
+  -moz-transtition-property: $property
+  -moz-transition-timing-function: $function
+  -moz-transition-delay: $delay
+  -o-transition: $duration $property $function $delay
+  transition: $duration $property $function $delay
 
-@mixin transition ( $duration, $property, $function, $delay )
-	-webkit-transition: $duration $property $function $delay
-	-moz-transition-duration: $duration
-	-moz-transtition-property: $property
-	-moz-transition-timing-function: $function
-	-moz-transition-delay: $delay
-	-o-transition: $duration $property $function $delay
-	transition: $duration $property $function $delay
-
-@mixin border-radius ( $radius )
-	-webkit-border-radius: $radius
-	-moz-border-radius: $radius
-	-ms-border-radius: $radius
-	-o-border-radius: $radius
-	border-radius: $radius
-
-@mixin scale ( $args )
-	-webkit-transform: scale($args)
-	-o-transform: scale($args)
-	transform: scale($args)
-
-@mixin box-shadow ( $args )
-	-webkit-box-shadow: $args
-	-moz-box-shadow: $args
-	box-shadow: $args
-
-@mixin placeholder-color ($color)
-	&::-webkit-input-placeholder
-		color: $color
-	&:-moz-placeholder /* Firefox 18- */
-		color: $color
-	&::-moz-placeholder  /* Firefox 19+ */
-		color: $color
-	&:-ms-input-placeholder
-		color: $color
+@mixin border-radius($radius)
+  -webkit-border-radius: $radius
+  -moz-border-radius: $radius
+  -ms-border-radius: $radius
+  -o-border-radius: $radius
+  border-radius: $radius
+
+@mixin scale($args)
+  -webkit-transform: scale($args)
+  -o-transform: scale($args)
+  transform: scale($args)
+
+@mixin box-shadow($args)
+  -webkit-box-shadow: $args
+  -moz-box-shadow: $args
+  box-shadow: $args
+
+@mixin placeholder-color($color)
+  &::placeholder
+    color: $color
+    font-style: italic
+  &::-webkit-input-placeholder
+    color: $color
+    font-style: italic
+  &:-moz-placeholder /* Firefox 18- */
+    color: $color
+    font-style: italic
+  &::-moz-placeholder  /* Firefox 19+ */
+    color: $color
+    font-style: italic
+  &:-ms-input-placeholder
+    color: $color
+    font-style: italic
 
 @mixin box-sizing($box-model)
-	-webkit-box-sizing: $box-model
-	-moz-box-sizing: $box-model
-	box-sizing: $box-model
+  -webkit-box-sizing: $box-model
+  -moz-box-sizing: $box-model
+  box-sizing: $box-model
 
 @mixin appearance($appearance)
-	-webkit-appearance: $appearance
-	-moz-appearance: $appearance
-	appearance: $appearance
-
-@mixin background-size ($arg)
-	-webkit-background-size: $arg
-	-moz-background-size: $arg
-	-o-background-size: $arg
-	background-size: $arg
-
-@mixin translate ($x, $y)
-	transform: translate($x, $y)
-	-webkit-transform: translate($x, $y)
-	-moz-transform: translate($x, $y)
-	-o-transform: translate($x, $y)
+  -webkit-appearance: $appearance
+  -moz-appearance: $appearance
+  appearance: $appearance
+
+@mixin background-size($arg)
+  -webkit-background-size: $arg
+  -moz-background-size: $arg
+  -o-background-size: $arg
+  background-size: $arg
+
+@mixin translate($x, $y)
+  transform: translate($x, $y)
+  -webkit-transform: translate($x, $y)
+  -moz-transform: translate($x, $y)
+  -o-transform: translate($x, $y)

data/app/assets/stylesheets/hackathon_manager/mailer.sass

@@ -6,7 +6,7 @@ body
   color: #201e1f
   font-family: 'Open Sans', sans-serif
   font-size: 16px
-  font-weight: 300
+  font-weight: $font-light
   text-align: center
   margin: 0
 body *
@@ -61,7 +61,7 @@ h1
   line-height: 1.27
 
 h1, h2
-  font-weight: 300
+  font-weight: $font-light
   text-transform: uppercase
   font-size: 36px
   color: $primary
@@ -81,7 +81,7 @@ a.nodecor
   text-decoration: none
 
 p
-  font-weight: 300
+  font-weight: $font-light
   font-size: 16px
   line-height: 1.7
   text-align: justify

data/app/assets/stylesheets/variables.sass

@@ -1,6 +1,25 @@
 // TODO: automatically generate a /app/assets/stylesheets/variable-overrides.sass
 // so people know they can override them, and provide instructions to modify this file.
 
+/*
+ * Allow for overridden variables.
+ * To use, place a custom `variable-overrides.sass` in your own app, at:
+ * /app/assets/stylesheets/variable-overrides.sass
+ * with any of the variables below.
+ */
+@import variable-overrides
+
+/*
+ * hackathon_manager variables
+ *
+ * All variables defined below should have the !default flag at the end of
+ * the value. This ensures that if the variable is set in variable-overrides,
+ * the default value here won't be used.
+ */
+
+/*
+ * Colors
+ */
 $orange     : #f58625 !default
 $black      : #201e1f !default
 $grey       : #4d4d4d !default
@@ -9,29 +28,99 @@ $white      : darken(#fff, 1%) !default
 $white-grey : darken($white, 5%) !default
 $red        : #fc401c !default
 
-// site colors
+/*
+ * Standardized colors
+ */
 $primary      : $orange !default
-$secondary    : $blue !default
+$secondary    : $orange !default
 
-// general colors
+/*
+ * General colors
+ */
 $white_pure   : #FFFFFF !default
-$grey-light   : #E4E4E4 !default
+$grey-light   : #bbbbbb !default
 $grey-med     : #888888 !default
 $grey-dark    : #343434 !default
 $offwhite     : #FCF7F2 !default
 
-// fonts
+/*
+ * Fonts
+ */
 $font-body-family       : 'Open Sans', sans-serif !default
 $font-headlines-family  : 'Open Sans', sans-serif !default
 $font-bold              : 600 !default
-$font-reg               : 300 !default
-$font-light             : 200 !default
-$font-thin              : 100 !default
+$font-reg               : 400 !default
+$font-light             : 300 !default
 
-// constants
+/*
+ * Constants
+ */
 $sidebar-width: 200px !default
 
-// media
+/*
+ * Media breakpoints
+ */
 $breakpoint-tablet: 1000px !default
 
-@import variable-overrides
+/*
+ * Headings
+ */
+$section-title--text: #5d5c77
+$section-title--text--emphasized: $primary
+
+/*
+ * Links
+ */
+$link--text: $secondary !default
+$link--text--hover: lighten($secondary, 10%) !default
+
+/*
+ * Buttons
+ */
+$button--background: $primary !default
+$button--border: $primary !default
+$button--text: $white_pure !default
+
+// Hover state
+$button--background--hover: lighten($primary, 15%) !default
+$button--border--hover: lighten($primary, 15%) !default
+$button--text--hover: $white_pure !default
+
+/*
+ * Forms
+ */
+$input--border-color: #d1d3d4 !default
+$input--background: $white_pure !default
+$input--text: $grey-dark !default
+$input--text--placeholder: #d1d3d4 !default
+
+$input--hint: #d1d3d4 !default
+$input--error--background: $red !default
+$input--error--text: $white_pure !default
+$input--required-star: #bcbec0 !default
+
+// Focused state
+$input--border-color--focus: $primary !default
+$input--background--focus: $input--background !default
+$input--text--focus: $input--text !default
+
+/*
+ * Alerts
+ */
+$alert--background: $white_pure !default
+$alert--border: $grey-dark !default
+$alert--text: $grey-dark !default
+
+$alert--background--error: $red !default
+$alert--border--error: $red !default
+$alert--text--error: $white_pure !default
+
+/*
+ * Account navigation
+ */
+$account-nav--text: #888
+$account-nav--border-color: $grey-light
+
+// Active state
+$account-nav--text--active: $grey-dark
+$account-nav--border-color--active: $primary

data/app/controllers/bus_lists_controller.rb

@@ -5,7 +5,7 @@ class BusListsController < ApplicationController
   before_action :find_bus_list
   before_action :require_bus_captian
 
-  layout 'hackathon_manager'
+  layout 'hackathon_manager/application'
 
   def logged_in
     authenticate_user!

data/app/controllers/questionnaires_controller.rb

@@ -4,7 +4,7 @@ class QuestionnairesController < ApplicationController
   before_action :logged_in
   before_action :find_questionnaire, only: [:show, :update, :edit, :destroy]
 
-  layout 'hackathon_manager'
+  layout 'hackathon_manager/application'
 
   def logged_in
     authenticate_user!

data/app/controllers/rsvps_controller.rb

@@ -4,7 +4,7 @@ class RsvpsController < ApplicationController
   before_action :find_questionnaire
   before_action :require_accepted_questionnaire
 
-  layout 'hackathon_manager'
+  layout 'hackathon_manager/application'
 
   def logged_in
     authenticate_user!

data/app/controllers/users/registrations_controller.rb

@@ -2,7 +2,7 @@ class Users::RegistrationsController < Devise::RegistrationsController
   # before_action :configure_sign_up_params, only: [:create]
   # before_action :configure_account_update_params, only: [:update]
 
-  layout 'hackathon_manager'
+  layout 'hackathon_manager/application'
 
   # GET /resource/sign_up
   # def new

data/app/helpers/hackathon_manager_helper.rb

@@ -1,5 +1,6 @@
 module HackathonManagerHelper
   def title(page_title)
+    content_for(:page_title) { page_title }
     content_for(:title) { page_title + " - #{Rails.configuration.hackathon['name']}" }
     page_title
   end
@@ -25,6 +26,13 @@ module HackathonManagerHelper
     markdown.render(text).html_safe
   end
 
+  def active_link_to(name = nil, options = nil, html_options = nil, &block)
+    if current_page?(options)
+      html_options[:class] = html_options[:class] + ' ' + html_options[:active_class]
+    end
+    link_to(name, options, html_options, &block)
+  end
+
   # https://github.com/rails/sprockets-rails/issues/298#issuecomment-168927471
   def asset_available?(logical_path)
     if Rails.configuration.assets.compile