summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorLuke Shumaker <shumakl@purdue.edu>2014-04-28 12:40:14 -0400
committerLuke Shumaker <shumakl@purdue.edu>2014-04-28 12:40:14 -0400
commit657d7071828e6639cc2261b80e87418efea64df6 (patch)
tree8e6b85b7d7f34d9fadca1d0f47726b47c57b0109
parent4a36940e4beff83940480352b95e8afca9676460 (diff)
go to town on the CSS
-rw-r--r--app/assets/stylesheets/alerts.css.scss3
-rw-r--r--app/assets/stylesheets/application.css2
-rw-r--r--app/assets/stylesheets/application/scaffolds.css.scss293
-rw-r--r--app/assets/stylesheets/brackets.css.scss3
-rw-r--r--app/assets/stylesheets/games.css.scss3
-rw-r--r--app/assets/stylesheets/main.css.scss1
-rw-r--r--app/assets/stylesheets/matches.css.scss31
-rw-r--r--app/assets/stylesheets/pms.css.scss11
-rw-r--r--app/assets/stylesheets/scaffolds.css.scss247
-rw-r--r--app/assets/stylesheets/search.css.scss3
-rw-r--r--app/assets/stylesheets/servers.css.scss20
-rw-r--r--app/assets/stylesheets/sessions.css.scss3
-rw-r--r--app/assets/stylesheets/teams.css.scss3
-rw-r--r--app/assets/stylesheets/tournaments.css.scss43
-rw-r--r--app/assets/stylesheets/users.css.scss41
-rw-r--r--app/views/layouts/application.html.erb20
16 files changed, 326 insertions, 401 deletions
diff --git a/app/assets/stylesheets/alerts.css.scss b/app/assets/stylesheets/alerts.css.scss
index c01a620..e69de29 100644
--- a/app/assets/stylesheets/alerts.css.scss
+++ b/app/assets/stylesheets/alerts.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the alerts controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 0a0365d..1c8b233 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -6,7 +6,7 @@
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
*= require_self
- *= require_tree .
+ *= require_tree ./application
*/
/* If you put any styles in this file directly, I will knife you. */
diff --git a/app/assets/stylesheets/application/scaffolds.css.scss b/app/assets/stylesheets/application/scaffolds.css.scss
new file mode 100644
index 0000000..28600b8
--- /dev/null
+++ b/app/assets/stylesheets/application/scaffolds.css.scss
@@ -0,0 +1,293 @@
+@import "bootstrap";
+@import "colors";
+
+/* Layout ***********************************************************/
+
+html {
+ height: 100%;
+
+ body {
+ background: asset-url("bg.png", image) repeat scroll 0 0 $page-color;
+ color: $page-color;
+ font-family: verdana, arial, helvetica, sans-serif;
+ font-size: 13px;
+ line-height: 18px;
+ height: 100%;
+ background-color: $toolbar-color;
+ border-radius: 0px 0px 5px 5px;
+ box-shadow: 0px 0px 5px black;
+
+ 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;
+ @extend .navbar-right;
+ input[type="submit"] {
+ @extend .btn-warning; margin-top: -3px; margin-right: 8px;
+ }
+ 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;
+ }
+ }
+ }
+
+ #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-top: 10px;
+ min-height: 80%;
+ height: auto !important;
+ height: 99%;
+ margin: 0 auto;
+ }
+
+
+ footer {
+ clear: both;
+ border-top: solid 1px $orange;
+ text-align: center;
+ margin: 0 auto;
+ 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;
+ }
+}
+
+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 !important;
+ background: rgba(0,0,0,0.5);
+ margin: 0 0 5px 0;
+}
+
+select {
+ background-color: #333;
+ padding: 5px;
+ border: none;
+ color: $orange !important;
+}
+
+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 {
+ div.row {
+ margin-left: 2%;
+ }
+ p.message {
+ margin-top: 10px;
+ }
+}
+
+.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/brackets.css.scss b/app/assets/stylesheets/brackets.css.scss
index 481e6e6..e69de29 100644
--- a/app/assets/stylesheets/brackets.css.scss
+++ b/app/assets/stylesheets/brackets.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the brackets controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/games.css.scss b/app/assets/stylesheets/games.css.scss
index db1b7bc..e69de29 100644
--- a/app/assets/stylesheets/games.css.scss
+++ b/app/assets/stylesheets/games.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the games controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/main.css.scss b/app/assets/stylesheets/main.css.scss
index 3859f53..15f5ac5 100644
--- a/app/assets/stylesheets/main.css.scss
+++ b/app/assets/stylesheets/main.css.scss
@@ -10,5 +10,4 @@
p {
line-height: 1.5em;
}
-
}
diff --git a/app/assets/stylesheets/matches.css.scss b/app/assets/stylesheets/matches.css.scss
index f4b31e4..e3ad6e7 100644
--- a/app/assets/stylesheets/matches.css.scss
+++ b/app/assets/stylesheets/matches.css.scss
@@ -1,8 +1,4 @@
-// Place all the styles related to the matches controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-
-#boxes li {
+#peer_review_boxes li {
cursor: move;
position: relative;
float: left;
@@ -14,7 +10,9 @@
padding-top: 10px;
background-color: rgb(238, 238, 255);
}
-#numeric li {
+
+// Nothing uses this one right now
+#peer_review_numeric li {
cursor: move;
position: relative;
float: left;
@@ -27,23 +25,6 @@
background-color: rgb(238, 238, 255);
}
-#match-stats {
- padding-bottom: 10px;
- border-bottom: thick dashed #F0AD4E;
-}
-
-#match-winner {
- margin: 0 auto;
- text-align: center;
- font-size: 2em;
-}
-
-#current-id {
- display: none;
-}
-
-
-
/**** INDEX PAGE - TABLE AND GRAPH ****/
#matches-table {
@extend .table;
@@ -53,7 +34,3 @@
color: #333;
}
}
-
-svg {
- min-width: 600px;
-}
diff --git a/app/assets/stylesheets/pms.css.scss b/app/assets/stylesheets/pms.css.scss
index a14299e..e69de29 100644
--- a/app/assets/stylesheets/pms.css.scss
+++ b/app/assets/stylesheets/pms.css.scss
@@ -1,11 +0,0 @@
-// Place all the styles related to the pms controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-
-p, li {
- color: #DD9125;
-}
-td, th {
- padding: 0px;
- color: #DD9125;
-} \ No newline at end of file
diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss
deleted file mode 100644
index d9bb164..0000000
--- a/app/assets/stylesheets/scaffolds.css.scss
+++ /dev/null
@@ -1,247 +0,0 @@
-@import "bootstrap";
-@import "colors";
-
-.tournament-listing {
- div.row {
- margin-left: 2%;
- }
- p.message {
- margin-top: 10px;
- }
-}
-
-.user-listing {
- div.row {
- margin-left: 2%;
- }
-}
-
-header > nav {
- @extend .navbar;
- @extend .navbar-inverse;
- color: white;
-
- #log-buttons {
- margin-top: 8px;
- form { display: inline; }
- }
- form.search {
- @extend .navbar-form;
- @extend .navbar-right;
- input[type="submit"] {
- @extend .btn-warning; margin-top: -3px; margin-right: 8px;
- }
- }
-}
-
-#alerts-ajax {
- display: none;
-}
-
-.btn-custom-orange {
- color: white;
- background-color: rgb(255, 69, 0);
- border-color: rgb(255, 69, 0);
-}
-.btn-custom-foxtrot {
- color: white;
- background-color: hsl(0, 69%, 22%) !important;
-}
-
-
-
-a, 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 {@extend .btn-custom-orange;}
- &.alerts { @extend .navbar-right; @extend .glyphicon; @extend .glyphicon-exclamation-sign; @extend .btn-custom-foxtrot;}
- font-weight: bold !important;
-}
-
-
-input[type="text"], input[type="password"], 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 !important;
- background: rgba(0,0,0,0.5);
- margin: 0 0 5px 0;
-}
-
-select {
- background-color: #333;
- padding: 5px;
- border: none;
- color: #DD9125 !important;
-}
-
-p.errors {
- background-color: rgba(0,0,0,0.5);;
- color: red;
- border-radius: 7px;
- padding: 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;
- }
-}
-
-// Limitation: Only one box can be expanded at a time
-.collapsible {
- .collapsed { display: block; }
- .expanded { display: none; }
- &:target {
- .collapsed { display: none; }
- .expanded { display: block; }
- }
-}
-
-pre {
- text-align: left;
-}
-
-
-#query{
- background-color: #303030;
- border: 2px solid #ED9C28;
- border-radius: 5px;
- color: #FFF;
- font-weight: bold;
- height: 30px;
- padding: 0px 5px;
-}
-
-html{
- height: 100%;
-}
-
-body {
- background: asset-url("bg.png", image) repeat scroll 0 0 $page-color;
- color: $page-color;
- font-family: verdana, arial, helvetica, sans-serif;
- font-size: 13px;
- line-height: 18px;
- height: 100%;
-}
-
-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;
-}
-
-/* NAVBAR */
-
-.navbar-brand {
- @extend .no-dec;
- a{
- color: white;
- &:hover, &:active, &:focus {
- color: white;
- font-weight: normal;
- text-decoration: none;
- }
- }
-}
-
-.navbar-inverse, header > nav {
- background-color: $toolbar-color;
- border-radius: 0px 0px 5px 5px;
- box-shadow: 0px 0px 5px black;
-}
-
-pre {
- background-color: #eee;
- padding: 10px;
- font-size: 11px;
-}
-
-a {
- color: $link-yellow;
- &:hover {
- color: white;
-
- }
-}
-
-div {
- &.field, &.actions {
- margin-bottom: 10px;
- }
-}
-
-#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;
- }
-}
-
-.field_with_errors {
- padding: 1px;
- background-color: #FF4C4C;
- box-shadow: 0px 0px 5px red;
- display: table;
-}
-
-.wrapper {
- width: 80%;
- margin-top: 10px;
- min-height: 80%;
- height: auto !important;
- height: 99%;
- margin: 0 auto;
-}
-
-button, input[type="submit"] {
- @extend .btn;
-}
-
-footer {
- clear: both;
- border-top: solid 1px $orange;
- text-align: center;
- margin: 0 auto;
- width: 90%;
-}
diff --git a/app/assets/stylesheets/search.css.scss b/app/assets/stylesheets/search.css.scss
index 22fd394..e69de29 100644
--- a/app/assets/stylesheets/search.css.scss
+++ b/app/assets/stylesheets/search.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the search controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/servers.css.scss b/app/assets/stylesheets/servers.css.scss
index fd0f61d..cd74f58 100644
--- a/app/assets/stylesheets/servers.css.scss
+++ b/app/assets/stylesheets/servers.css.scss
@@ -2,26 +2,8 @@
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
-@import "colors";
-
.edit_server {
-
- color: #FFF;
-
- fieldset {
- color: $orange;
- legend {
- color: $orange;
- border-color: $orange;
- }
- }
-
- input[type="submit"] {
- color: $page-color;
- }
-
li {
list-style: none;
}
-
-} \ No newline at end of file
+}
diff --git a/app/assets/stylesheets/sessions.css.scss b/app/assets/stylesheets/sessions.css.scss
index 7bef9cf..e69de29 100644
--- a/app/assets/stylesheets/sessions.css.scss
+++ b/app/assets/stylesheets/sessions.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the sessions controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/teams.css.scss b/app/assets/stylesheets/teams.css.scss
index 320d00d..e69de29 100644
--- a/app/assets/stylesheets/teams.css.scss
+++ b/app/assets/stylesheets/teams.css.scss
@@ -1,3 +0,0 @@
-// Place all the styles related to the teams controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
diff --git a/app/assets/stylesheets/tournaments.css.scss b/app/assets/stylesheets/tournaments.css.scss
index e62c228..498bdb3 100644
--- a/app/assets/stylesheets/tournaments.css.scss
+++ b/app/assets/stylesheets/tournaments.css.scss
@@ -4,24 +4,6 @@
@import "colors";
-.new_tournament, .edit_tournament {
- td, th {
- padding: 5px;
- }
- legend {
- color: $orange
- }
-}
-
-p.default-field {
- display: inline;
-}
-
-span.default-explanation {
- color: gray;
- font-style: italic;
-}
-
#players-needed {
text-align: center;
font-style: italic;
@@ -41,15 +23,20 @@ span.default-explanation {
}
-
-#tournament-users{
-
- li {
- color: #10A010;
- }
-
- .black {
- color: white;
+#tournament-users {
+ ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ li {
+ padding-left: 1em;
+ text-indent: -.7em;
+ &:before {
+ content: "• ";
+ color: #10A010;
+ }
+ color: white;
+ }
}
}
@@ -104,4 +91,4 @@ div.leave-buttons {
form {
display: inline;
}
-} \ No newline at end of file
+}
diff --git a/app/assets/stylesheets/users.css.scss b/app/assets/stylesheets/users.css.scss
index 5df7aee..e69de29 100644
--- a/app/assets/stylesheets/users.css.scss
+++ b/app/assets/stylesheets/users.css.scss
@@ -1,41 +0,0 @@
-// Place all the styles related to the users controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-
-
-/*** FOR NEW USER - AKA SIGN UP ***/
-.simple_captcha {
- background-color: rgba(255, 255, 255, 0.7);
- margin: 10px 0px;
-}
-
-
-div.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;
- }
-} \ No newline at end of file
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index f3535e9..af26e29 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,13 +1,17 @@
<!DOCTYPE html>
<html>
<head>
- <title>Leaguer</title>
- <%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %>
- <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
- <%= javascript_include_tag "#{params[:controller]}", "data-turbolinks-track" => true %>
- <%= javascript_include_tag "#{params[:controller]}/#{params[:action]}", "data-turbolinks-track" => true %>
- <%= csrf_meta_tags %>
- <%= yield :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 %>
+ <%= javascript_include_tag "#{params[:controller]}/#{params[:action]}", "data-turbolinks-track" => true %>
+
+ <%= csrf_meta_tags %>
+ <%= yield :head %>
</head>
<body>
<header>
@@ -48,7 +52,7 @@
<% if notice %><div id="notice"><p><%= notice %></p></div><% end %>
<div class="wrapper">
- <%= yield %>
+ <%= yield %>
</div>
<footer>