diff --git a/images/bottom_arrow.png b/images/bottom_arrow.png new file mode 100644 index 0000000..28f77c0 Binary files /dev/null and b/images/bottom_arrow.png differ diff --git a/index.html.haml b/index.html.haml index 69ef80c..bb61144 100644 --- a/index.html.haml +++ b/index.html.haml @@ -8,69 +8,72 @@ layout: base .row .home.span9 .preparation - -# ############## Background ############# - .arrow-wallpaper -# ########## header of diagram ########## - .diagram-header.hidden-phone - .span3.offset2 + .diagram-header.row.hidden-phone + .span3.offset3 %h4 Application Preparation .span3 %h4 Server Preparation -# ########## middle buttons ########## - .learn-btn - %a.btn(href="learn") - .span2 - :markdown - Learn - ----- - .span3.hidden-phone - :markdown - Learn about how applications are built using JBoss EAP. - .span3.hidden-phone - :markdown - Learn about what server capabilities are provided in EAP - .discover-btn - %a.btn(href="discover") - .span2 - :markdown - Discover - -------- - .span3.hidden-phone - :markdown - Run one of our tools to help you identify changes you need to make to your application. - .span3.hidden-phone - :markdown - Identify the JBoss EAP equivalent capabilities to support your application. - .implement-btn - %a.btn(href="implement") - .span2 - :markdown - Implement - --------- - .span3.hidden-phone - :markdown - Implement the changes to your application - .span3.hidden-phone - :markdown - Set up JBoss EAP with the capabilities needed for your application. + .learn-btn.row + %a.btn.span9(href="learn") + .row + .span3 + :markdown + Learn + ----- + .span3.hidden-phone + :markdown + Learn about how applications are built using JBoss EAP. + .span3.hidden-phone + :markdown + Learn about what server capabilities are provided in EAP + .discover-btn.row + %a.btn.span9(href="discover") + .row + .span3 + :markdown + Discover + -------- + .span3.hidden-phone + :markdown + Run one of our tools to help you identify changes you need to make to your application. + .span3.hidden-phone + :markdown + Identify the JBoss EAP equivalent capabilities to support your application. + .implement-btn.row + %a.btn.span9(href="implement") + .row + .span3 + :markdown + Implement + --------- + .span3.hidden-phone + :markdown + Implement the changes to your application + .span3.hidden-phone + :markdown + Set up JBoss EAP with the capabilities needed for your application. .deploy.hidden-phone - :markdown - Deploy - ------ - Deploy your application on EAP! + .row + .span3.offset2 + :markdown + Deploy + ------ + Deploy your application on EAP! -# Right column - .span3.secondary-buttons + .span2.offset1.secondary-buttons .row - %a.btn.btn-inverse(href="migration-drivers") + %a.btn.span2.btn-inverse(href="migration-drivers") = snippet "home/why_migrate.md" .row - %a.btn.btn-inverse(href="migration-planning") + %a.btn.span2.btn-inverse(href="migration-planning") = snippet "home/planning_sheet.md" .row - %a.btn.btn-inverse(href="http://www.redhat.com/consulting/technology-solutions/migrations/") + %a.btn.span2.btn-inverse(href="http://www.redhat.com/consulting/technology-solutions/migrations/") = snippet "home/need_more_help.md" .row - %a.btn.btn-inverse(href="http://community.jboss.org/en/migration") + %a.btn.span2.btn-inverse(href="http://community.jboss.org/en/migration") = snippet "home/discuss.md" .row .span9 diff --git a/stylesheets/_migration.scss b/stylesheets/_migration.scss index 012daf9..05fec72 100644 --- a/stylesheets/_migration.scss +++ b/stylesheets/_migration.scss @@ -44,14 +44,15 @@ $btnDiscoverBackgroundHighlight: #781f1c; } .preparation { - + min-height: 1px; + max-height: 90%; + background: url(../images/vert_arrow.png) 8em repeat-y; .wallpaper { background-image:url(/images/DeployonEAP.png); background-repeat:no-repeat; background-position: 70px 30px; height:385px; - } - + } h2 { padding-top:10px; font-size: 22px; @@ -60,12 +61,12 @@ $btnDiscoverBackgroundHighlight: #781f1c; text-align: center; text-transform: uppercase; color:#781f1c; - } - + } .btn { height:75px; text-align:left; padding-left: 0px; + margin-left: 0px; } .spacer5 { @@ -141,9 +142,10 @@ $btnDiscoverBackgroundHighlight: #781f1c; } .deploy { - text-align: center; - - h2 { + text-align: center; + background: image-url("bottom_arrow.png") 7.9em -1px no-repeat white; + padding-left: 15em; + & > h2 { padding-top: 0px; margin-top: 0px; } @@ -154,7 +156,6 @@ $btnDiscoverBackgroundHighlight: #781f1c; .secondary-buttons { .btn { - width: 100%; margin-top: 20px; h2 { @@ -325,3 +326,6 @@ $btnDiscoverBackgroundHighlight: #781f1c; border-right:#E5E5E5; } +.learn-btn, .discover-btn, .implement-btn { + margin: 1.6em 0; +}