Fix splash layouts, other ui fixes

2026-05-08 15:44:07 -04:00 · 2014-08-01 12:23:33 +05:30
parent a2089a09fa
commit ddfe8e5227
10 changed files with 245 additions and 254 deletions
--- a/app/assets/stylesheets/splash.css.scss
+++ b/app/assets/stylesheets/splash.css.scss
@@ -67,206 +67,197 @@
  src: local('Coustard-Black'), url("fonts/Coustard-Black.woff") format('woff');
 }

-body {
+.splash {
  background-color: #f2f2f2;
  font-family: 'Lato';
  font-weight: 300;
  font-size: 16px;
  color: #555;
+  margin-top: -10px;

  -webkit-font-smoothing: antialiased;
  /*-webkit-overflow-scrolling: touch;*/
-}

-/* Titles */
-h1, h2, h3, h4, h5, h6 {
-  font-family: "Raleway";
-  font-weight: 300;
-  color: #333;
-}

-/* Paragraph & Typographic */
-p {
-    line-height: 28px;
-    margin-bottom: 25px;
-    font-size: 18px;
-}
-
-.centered {
-    text-align: center;
-}
-
-/* Links */
-a {
-    color: #f85c37;
-    word-wrap: break-word;
-
-    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
-    transition: color 0.1s ease-in, background 0.1s ease-in;
-}
-
-a:hover,
-a:focus {
-    color: #7b7b7b;
-    text-decoration: none;
-    outline: 0;
-}
-
-a:before,
-a:after {
-    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
-    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
-    transition: color 0.1s ease-in, background 0.1s ease-in;
-}
-
- hr {
-    display: block;
-    height: 1px;
-    border: 0;
-    border-top: 1px solid #ccc;
-    margin: 1em 0;
-    padding: 0;
-}
-/* ==========================================================================
-   Wrap Sections
-   ========================================================================== */
-
-#splash-banner{
-  h1, h3{
-    color:#3399CC;
-  }
-  h3{
-    font-family: 'Coustard', serif;
-    font-weight: 600;
-    text-shadow: 0.2em 0.2em 0 #4A4F6A;
-  }
-  h1{
-    font-size: 200px;
-    font-weight: 700;
-    text-shadow:0.04em 0.04em 0 black;
-  }
-  p {
-    color: #fff;
-    font-weight: 500;
-  }
-}
-
-#program{
-  .tracks:hover{
-    background-color: white;
-  }
-}
-
-#callforpapers{
-  .timer-box{
-    width: 130px;
-    margin: 35px 24px 20px 0;
-    border-radius: 50%;
-    border:4px solid #989797;
-  }
-  #cfp-date{
-    font-size: 40px;
-    font-family: 'Coustard', serif;
-    color: #ff6633;
-  }
-}
-
-#registration{
-  background-color: #e0e0e0;
-}
-
-#sponsors{
-  h2,h3,h4{
-    color: #fff;
-    font-weight: 400;
-  }
-
-  color: #fff;
-  background-color: #343b3d;
-}
-
-#social-media{
-  i{
-    color: #4a4a4a;
-  }
-  i:hover{
-    color: #16a085;
-  }
-}
-
-#location{
-
-  h1,h2,p{
-    color: #fff;
-  }
-  h1,h2,li,p{
-    text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
-    font-weight: 400;
-  }
-}
-#gallery{
-  min-height: 600px;
-  .item{
-    img {
-      height: 600px;
-      background-repeat: no-repeat;
-      background-position: center center;
-      width: 100%;
-      background-size: cover;
-      -webkit-background-size:cover;
-    }
-  }
-  .modal-body{
-    i{
-      margin-top: 35%;
-    }
-  }
-  #carousel-example-generic{
-    visibility: hidden;
-  }
-}
-
-.scroll-top-wrapper {
-  position: fixed;
-  opacity: 0;
-  visibility: hidden;
-  overflow: hidden;
-  text-align: center;
-  z-index: 99999999;
-  background-color: #424242;
-  width: 50px;
-  height: 48px;
-  line-height: 48px;
-  right: 30px;
-  bottom: 30px;
-  padding-top: 2px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  -webkit-transition: all 0.5s ease-in-out;
-  -moz-transition: all 0.5s ease-in-out;
-  -ms-transition: all 0.5s ease-in-out;
-  -o-transition: all 0.5s ease-in-out;
-  transition: all 0.5s ease-in-out;
-
-  i.fa {
-    line-height: inherit;
-  }
-
-  &.show {
-    visibility:visible;
-    cursor:pointer;
-    opacity: 1.0;
+  /* Titles */
+  h1, h2, h3, h4, h5, h6 {
+    font-family: "Raleway";
+    font-weight: 300;
+    color: #333;
  }

+  /* Links */
  a {
-    color: white;
+      color: #f85c37;
+      word-wrap: break-word;
+
+      -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -o-transition: color 0.1s ease-in, background 0.1s ease-in;
+      transition: color 0.1s ease-in, background 0.1s ease-in;
+  }
+
+  a:hover,
+  a:focus {
+      color: #7b7b7b;
+      text-decoration: none;
+      outline: 0;
+  }
+
+  a:before,
+  a:after {
+      -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
+      -o-transition: color 0.1s ease-in, background 0.1s ease-in;
+      transition: color 0.1s ease-in, background 0.1s ease-in;
+  }
+
+   hr {
+      display: block;
+      height: 1px;
+      border: 0;
+      border-top: 1px solid #ccc;
+      margin: 1em 0;
+      padding: 0;
+  }
+  /* ==========================================================================
+     Wrap Sections
+     ========================================================================== */
+
+  #splash-banner{
+    h1, h3{
+      color:#3399CC;
+    }
+    h3{
+      font-family: 'Coustard', serif;
+      font-weight: 600;
+      text-shadow: 0.2em 0.2em 0 #4A4F6A;
+    }
+    h1{
+      font-size: 5em;
+      font-weight: 700;
+      text-shadow:0.04em 0.04em 0 black;
+    }
+    p {
+      color: #fff;
+      font-weight: 500;
+    }
+  }
+
+  #program{
+    .tracks:hover{
+      background-color: white;
+    }
+  }
+
+  #callforpapers{
+    .timer-box{
+      width: 130px;
+      margin: 35px 24px 20px 0;
+      border-radius: 50%;
+      border:4px solid #989797;
+    }
+    #cfp-date{
+      font-size: 40px;
+      font-family: 'Coustard', serif;
+      color: #ff6633;
+    }
+  }
+
+  #registration{
+    background-color: #e0e0e0;
+  }
+
+  #sponsors{
+    h2,h3,h4{
+      color: #fff;
+      font-weight: 400;
+    }
+
+    color: #fff;
+    background-color: #343b3d;
+  }
+
+  #social-media{
+    i{
+      color: #4a4a4a;
+    }
+    i:hover{
+      color: #16a085;
+    }
+  }
+
+  #location{
+
+    h1,h2,p{
+      color: #fff;
+    }
+    h1,h2,li,p{
+      text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
+      font-weight: 400;
+    }
+  }
+  #gallery{
+    min-height: 600px;
+    .item{
+      img {
+        height: 600px;
+        background-repeat: no-repeat;
+        background-position: center center;
+        width: 100%;
+        background-size: cover;
+        -webkit-background-size:cover;
+      }
+    }
+    .modal-body{
+      i{
+        margin-top: 35%;
+      }
+    }
+    #carousel-example-generic{
+      visibility: hidden;
+    }
+  }
+
+  .scroll-top-wrapper {
+    position: fixed;
+    opacity: 0;
+    visibility: hidden;
+    overflow: hidden;
+    text-align: center;
+    z-index: 99999999;
+    background-color: #424242;
+    width: 50px;
+    height: 48px;
+    line-height: 48px;
+    right: 30px;
+    bottom: 30px;
+    padding-top: 2px;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+    border-bottom-right-radius: 10px;
+    border-bottom-left-radius: 10px;
+    -webkit-transition: all 0.5s ease-in-out;
+    -moz-transition: all 0.5s ease-in-out;
+    -ms-transition: all 0.5s ease-in-out;
+    -o-transition: all 0.5s ease-in-out;
+    transition: all 0.5s ease-in-out;
+
+    i.fa {
+      line-height: inherit;
+    }
+
+    &.show {
+      visibility:visible;
+      cursor:pointer;
+      opacity: 1.0;
+    }
+
+    a {
+      color: white;
+    }
  }
 }

--- a/app/views/admin/tracks/_track_fields.html.erb
+++ b/app/views/admin/tracks/_track_fields.html.erb
@@ -6,4 +6,4 @@
        <%= remove_association_link :track, f %>
    <% end %>
 </div>
-data: { provide: "markdown-editable" }
+
--- a/app/views/conference/_call_for_papers.html.haml
+++ b/app/views/conference/_call_for_papers.html.haml
@@ -8,32 +8,32 @@
      %h1
        Call For Papers
      - if !@conference.call_for_papers.description.blank?
-        %p
+        .lead
          = markdown(@conference.call_for_papers.description)
      - if !@conference.call_for_papers.start_date.blank? && !@conference.call_for_papers.end_date.blank?
-        %p.lead Proposals will be accepted between
+        .lead Proposals will be accepted between
        #cfp-date
          = date_string(@conference.call_for_papers.start_date, @conference.call_for_papers.end_date)
    - if @conference.cfp_open?
      - if @conference.call_for_papers.end_date.to_time < Time.now
-        %p Today is the last day. Hurry Up!
+        .lead Today is the last day. Hurry Up!
      - else
        .row
          .col-md-8.col-md-offset-3
            %div.col-md-2.timer-box
              %h2#days
-              %p Days
+              .lead Days
            %div.col-md-2.timer-box
              %h2#hours
-              %p Hours
+              .lead Hours
            %div.col-md-2.timer-box
              %h2#minutes
-              %p Minutes
+              .lead Minutes
            %div.col-md-2.timer-box
              %h2#seconds
-              %p Seconds
+              .lead Seconds
      .row
-        %p
+        .lead
          = link_to "Submit Your Proposals Today", conference_proposal_index_path(@conference.short_title), class: 'btn btn-info', target: '_blank'
    -else
      %h3 Deadline has ended
--- a/app/views/conference/_gallery_photo.html.haml
+++ b/app/views/conference/_gallery_photo.html.haml
@@ -3,5 +3,5 @@
    = image_tag(photo.picture(:banner))
    - unless photo.description.blank?
      %div.carousel-caption
-        %p.lead
+        .lead
          = photo.description
--- a/app/views/conference/_location.html.haml
+++ b/app/views/conference/_location.html.haml
@@ -13,7 +13,7 @@
        %h2
          %strong #{ @conference.venue.address }
      - unless @conference.venue.description.blank?
-        %p
+        .lead
          = markdown(@conference.venue.description)
      %ul.location-links
        - unless @conference.venue.address.blank?
--- a/app/views/conference/_lodging.html.haml
+++ b/app/views/conference/_lodging.html.haml
@@ -1,7 +1,7 @@
 %div.container.text-center
  %h2 Lodgings
  -unless @conference.lodging_description.blank?
-    %p.lead
+    .lead
      = markdown(@conference.lodging_description)

  %div.row.text-center
@@ -13,7 +13,7 @@
          -unless r.name.blank?
            %h4.text-center #{ r.name }
          -unless r.description.blank?
-            %p.text-left #{ markdown(r.description) }
+            .lead.text-left #{ markdown(r.description) }
          - unless r.website_link.blank?
            .text-center
              = link_to 'Go to Website', r.website_link
--- a/app/views/conference/_registration.html.haml
+++ b/app/views/conference/_registration.html.haml
@@ -5,7 +5,7 @@
  %div.row
    %h1 Registration
  - if !@conference.registration_description.blank?
-    %p
+    .lead
      = markdown(@conference.registration_description)
  - if @conference.registration_dates_given?
    -if @conference.registration_end_date >= Date.today
--- a/app/views/conference/_sponsor.html.haml
+++ b/app/views/conference/_sponsor.html.haml
@@ -6,7 +6,7 @@
    %div.col-md-12
      %h2 Sponsors
      -if !@conference.sponsor_description.blank?
-        %p
+        .lead
        = markdown(@conference.sponsor_description)
      -if !@conference.sponsor_email.blank?
        %h3= mail_to "#{ @conference.sponsor_email }", 'Become a Sponsor'
--- a/app/views/conference/_tickets.html.haml
+++ b/app/views/conference/_tickets.html.haml
@@ -1,14 +1,14 @@
 %div.row
  %h3 Tickets
  -if !@conference.ticket_description.blank?
-    %p
+    .lead
      = markdown(@conference.ticket_description)
    - @conference.supporter_levels.each do |s|
      %div.col-md-6
        - if !s.title.blank?
          %h4 #{ s.title }
        -if !s.description.blank?
-          %p #{ s.description }
+          .lead #{ s.description }
        - if !s.url.blank?
          %div.btn-group
            = link_to "Buy Ticket", s.url, class: 'btn btn-success', target: '_blank'
--- a/app/views/conference/show.html.haml
+++ b/app/views/conference/show.html.haml
@@ -1,61 +1,61 @@
 = content_for :brand do
-  = link_to @conference.title, conference_url(@conference.short_title), class: 'navbar-brand'
+  = link_to @conference.short_title, conference_url(@conference.short_title), class: 'navbar-brand'
 = content_for :splash do
-  - if @conference.include_banner_in_splash?
-    %section{ id: 'splash-banner' }
-      %div.banner-disp{ style: ("background-image: url(#{@conference.banner_photo})" unless @conference.banner_photo.blank?), class:('with-background' unless @conference.banner_photo.blank?) }
-        %div.container.text-center.banner-text
-          .row
-            %h1
-              = @conference.short_title
-          - if @conference.start_date && @conference.end_date
+  .splash
+    - if @conference.include_banner_in_splash?
+      %section{ id: 'splash-banner' }
+        %div.banner-disp{ style: ("background-image: url(#{@conference.banner_photo})" unless @conference.banner_photo.blank?), class:('with-background' unless @conference.banner_photo.blank?) }
+          %div.container.text-center.banner-text
            .row
-              %h3
-                = date_string(@conference.start_date, @conference.end_date)
+              %h1
+                = @conference.title
+            - if @conference.start_date && @conference.end_date
+              .row
+                %h3
+                  = date_string(@conference.start_date, @conference.end_date)

-          - unless @conference.description.blank?
-            .row-fluid
-              .col-md-12.lead
-                %p
-                  = markdown(@conference.description)
-          -unless @conference.photos.blank?
-            = link_to 'Gallery', gallery_photos_conference_path(@conference.short_title), class: 'btn btn-primary btn-lg', id: 'gallery-btn', remote: true
-            = render 'gallery'
-  - if @conference.include_program_in_splash?
-    %section{ id: 'program' }
-      .pad
-        = render 'program'
-
-  - if @conference.include_registrations_in_splash?
-    %section{ id: 'registration' }
-      .pad
-        = render 'registration'
-
-
-  -unless @conference.call_for_papers.blank?
-    - if @conference.call_for_papers.include_cfp_in_splash?
-      %section{ id:'callforpapers' }
+            - unless @conference.description.blank?
+              .row-fluid
+                .col-md-12.lead
+                  .lead
+                    = markdown(@conference.description)
+            -unless @conference.photos.blank?
+              = link_to 'Gallery', gallery_photos_conference_path(@conference.short_title), class: 'btn btn-primary btn-lg', id: 'gallery-btn', remote: true
+              = render 'gallery'
+    - if @conference.include_program_in_splash?
+      %section{ id: 'program' }
        .pad
-          = render 'call_for_papers'
+          = render 'program'

-  -unless @conference.venue.blank?
-    - if @conference.venue.include_venue_in_splash?
-      %section{ id: 'location' }
+    - if @conference.include_registrations_in_splash?
+      %section{ id: 'registration' }
        .pad
-          = render 'location'
-      - unless @conference.venue.lodgings.empty?
-        - if @conference.venue.include_lodgings_in_splash?
-          = render 'lodging'
+          = render 'registration'

-  - if @conference.include_sponsors_in_splash?
-    %section{ id: 'sponsors' }
-      .pad
-        = render 'sponsor'

-  - if @conference.contact.public?
-    %section{ id: 'social-media' }
-      .pad
-        = render 'social_media'
+    -unless @conference.call_for_papers.blank?
+      - if @conference.call_for_papers.include_cfp_in_splash?
+        %section{ id:'callforpapers' }
+          .pad
+            = render 'call_for_papers'

-  = render 'footer'
+    -unless @conference.venue.blank?
+      - if @conference.venue.include_venue_in_splash?
+        %section{ id: 'location' }
+          .pad
+            = render 'location'
+        - unless @conference.venue.lodgings.empty?
+          - if @conference.venue.include_lodgings_in_splash?
+            = render 'lodging'

+    - if @conference.include_sponsors_in_splash?
+      %section{ id: 'sponsors' }
+        .pad
+          = render 'sponsor'
+
+    - if @conference.contact.public?
+      %section{ id: 'social-media' }
+        .pad
+          = render 'social_media'
+
+    = render 'footer'