Layout, basic forms, css.

Author: longhotsummer

.gitignore

@@ -0,0 +1 @@
+.sass-cache

Gemfile

@@ -5,6 +5,7 @@ gem "sinatra"
 gem "haml"
 gem "sinatra-assetpack"
 gem "padrino-helpers"
+gem "sass"
 
 group :development do
   gem "shotgun"

Gemfile.lock

@@ -27,6 +27,7 @@ GEM
       rack
     rack-test (0.6.2)
       rack (>= 1.0)
+    sass (3.2.12)
     shotgun (0.9)
       rack (>= 1.0)
     sinatra (1.4.4)
@@ -49,6 +50,7 @@ PLATFORMS
 DEPENDENCIES
   haml
   padrino-helpers
+  sass
   shotgun
   sinatra
   sinatra-assetpack

app/css/app.css

@@ -0,0 +1,19 @@
+body {
+  margin-top: 50px;
+}
+
+#wrapper {
+  padding: 10px;
+}
+
+#metadata-panel {
+  border-bottom: 1px solid #ccc;
+}
+
+#text-panel {
+  margin-top: 20px;
+}
+
+#source_text {
+  width: 100%;
+}

app/css/app.scss

@@ -5,6 +5,7 @@
 class StenoApp < Sinatra::Base
   set :root, File.dirname(__FILE__)
   set :haml, format: :html5
+  set :protect_from_csrf, false
 
   register Padrino::Helpers
   register Sinatra::AssetPack

steno_app.rb

@@ -1 +1,36 @@
-%h2 The template
+- form_tag '/parse', method: 'post', class: 'form-horizontal' do
+
+  #metadata-panel
+    .row
+      .col-xs-6
+        .form-group
+          %label.col-sm-3.control-label Full title
+          .col-sm-9
+            = text_field_tag 'doc[title]', placeholder: 'eg. City of Cape Town: How to Have Fun By-law, 2012', class: 'form-control'
+        .form-group
+          %label.col-sm-3.control-label Short name
+          .col-sm-6
+            = text_field_tag 'doc[short_name]', placeholder: 'short-name', class: 'form-control'
+        .form-group
+          %label.col-sm-3.control-label Gazette
+          .col-sm-6
+            = text_field_tag 'doc[pub][name]', placeholder: 'Province of Western Cape: Provincial Gazette', class: 'form-control'
+          %label.col-sm-1.control-label no.
+          .col-sm-2
+            = text_field_tag 'doc[pub][number]', placeholder: '1234', class: 'form-control'
+      .col-xs-6
+        .form-group
+          %label.col-sm-2.control-label Locale
+          .col-sm-3
+            = text_field_tag 'doc[locale]', placeholder: 'Cape Town', class: 'form-control'
+        .form-group
+          %label.col-sm-2.control-label Published
+          .col-sm-4
+            = text_field_tag 'doc[pub][date]', type: 'date', class: 'form-control'
+
+  #text-panel
+    .row
+      .col-xs-6
+        %textarea#source_text(name="source_text")
+      .col-xs-6
+        second

views/index.haml

@@ -4,9 +4,10 @@
     %meta(charset="utf-8")
     %meta(http-equiv="X-UA-Compatible" content="IE=edge,chrome=1")
 
-    = stylesheet_link_tag '//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css', media: "screen, print"
-    = stylesheet_link_tag '//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css', media: "screen, print"
-    = css :app, media: "screen, print"
+    = stylesheet_link_tag '//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css'
+    = stylesheet_link_tag '//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap-theme.min.css'
+    = stylesheet_link_tag '//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css'
+    = css :app
   %body
     /[if lt IE 7]
       %p.chromeframe
@@ -16,21 +17,16 @@
         %a(href="http://www.google.com/chromeframe/?redirect=true") install Google Chrome Frame
         to better experience this site.
 
-    .container
-      %header#header
-        .navbar.navbar-inverse
-          .navbar-inner
-            %a.btn.btn-navbar(data-toggle="collapse" data-target=".nav-collapse")
-              %span.icon-bar
-              %span.icon-bar
-              %span.icon-bar
-
-            %a.brand(href='/')
+    %header#header
+      .navbar.navbar-inverse.navbar-fixed-top
+        .container
+          .navbar-header
+            %a.navbar-brand(href='/')
               Steno
 
-      %section#main
-        = yield
+    #wrapper
+      = yield
 
-    = javascript_include_tag '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'
-    = javascript_include_tag '//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js'
-    = js :app
+      = javascript_include_tag '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'
+      = javascript_include_tag '//netdna.bootstrapcdn.com/twitter-bootstrap/3.0.1/js/bootstrap.min.js'
+      = js :app