suzanne.soy/travis-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

"fix" column heights, probably need a different approach to the 3-colum layout

Browse Source
This commit is contained in:
Sven Fuchs 2012-09-22 13:49:38 +02:00
parent c8f43f5d13
commit cb6edc5b45
7 changed files with 124 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
assets/javascripts/app/templates/layouts/home.hbs
View File

@ -2,14 +2,16 @@
{{outlet top}} {{outlet top}}
</div> </div>
<div id="left"> <div id="page">
{{outlet left}} <div id="left">
</div> {{outlet left}}
</div>
<div id="main"> <div id="main">
{{outlet main}} {{outlet main}}
</div> </div>
<div id="right"> <div id="right">
{{outlet right}} {{outlet right}}
</div>
</div> </div>

52
assets/javascripts/app/templates/layouts/profile.hbs
View File

@ -2,32 +2,34 @@
{{outlet top}} {{outlet top}}
</div> </div>
<div id="left"> <div id="page">
{{outlet left}} <div id="left">
</div> {{outlet left}}
<div id="main">
{{outlet main}}
</div>
<div id="right">
<div id="slider" {{action toggleSidebar target="Travis.app"}}>
<div class='icon'></div>&nbsp;
</div> </div>
<div class="box"> <div id="main">
<h4>Getting started?</h4> {{outlet main}}
<p> </div>
Please read our <a href="http://about.travis-ci.org/docs/user/getting-started">guide</a>.
It will only take a few minutes :) <div id="right">
</p> <div id="slider" {{action toggleSidebar target="Travis.app"}}>
<p> <div class='icon'></div>&nbsp;
You can find detailled docs on our <a href="http://about.travis-ci.org/">about</a> site. </div>
</p>
<p> <div class="box">
If you need help please don't hesitate to join <h4>Getting started?</h4>
<a href="irc://irc.freenode.net#travis">#travis</a> on irc.freenode.net <p>
or our <a href="http://groups.google.com/group/travis-ci">mailinglist</a>. Please read our <a href="http://about.travis-ci.org/docs/user/getting-started">guide</a>.
</p> It will only take a few minutes :)
</p>
<p>
You can find detailled docs on our <a href="http://about.travis-ci.org/">about</a> site.
</p>
<p>
If you need help please don't hesitate to join
<a href="irc://irc.freenode.net#travis">#travis</a> on irc.freenode.net
or our <a href="http://groups.google.com/group/travis-ci">mailinglist</a>.
</p>
</div>
</div> </div>
</div> </div>

8
assets/stylesheets/layout.sass
View File

@ -1,11 +1,17 @@
@import "_mixins/all" @import "_mixins/all"
body > div body > div
overflow-x: hidden
// ouch ...
#ember360, #ember393, #ember490, #ember860
height: 100%
#page
display: table display: table
table-layout: fixed table-layout: fixed
width: 100% width: 100%
height: 100% height: 100%
overflow: hidden
#left, #main, #right #left, #main, #right
display: table-cell display: table-cell

3
public/index.html
View File

@ -20,7 +20,6 @@
}); });
</script> </script>
</head> </head>
<body> <body></body>
</body>
</html> </html>

2
public/javascripts/application.js
View File

File diff suppressed because one or more lines are too long

40
public/layout.html Normal file
View File

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html>
<head>
<!--style>
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
body > div {
display: table;
width: 100%;
height: 100%;
}
#top {
display: table-row;
}
#left, #main, #right {
display: table-cell;
height: 100%;
border: 1px solid #ddd;
}
#left, #right {
width: 400px;
background-color: #eee;
}
</style-->
<link rel="stylesheet" href="/stylesheets/application.css">
</head>
<body>
<div>
<div id="top">top</div>
<div id="left">left</div>
<div id="main">main</div>
<div id="right">right</div>
</div>
</body>
</html>

67
public/stylesheets/application.css
View File

@ -1775,21 +1775,30 @@ span.loading {
/* line 3, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 3, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
body > div { body > div {
overflow-x: hidden;
}
/* line 7, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#ember360, #ember393, #ember490, #ember860 {
height: 100%;
}
/* line 10, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#page {
display: table; display: table;
table-layout: fixed; table-layout: fixed;
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden;
} }
/* line 10, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 16, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left, #main, #right { #left, #main, #right {
display: table-cell; display: table-cell;
position: relative; position: relative;
height: 100%; height: 100%;
} }
/* line 15, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 21, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
width: 350px; width: 350px;
min-width: 350px; min-width: 350px;
@ -1798,18 +1807,18 @@ body > div {
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAAFCAMAAACKJ3hCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjkxQTBDNjlGQTA4MTFFMThBMjVCOTE4RjhGRDQ1RUEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjkxQTBDNkFGQTA4MTFFMThBMjVCOTE4RjhGRDQ1RUEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpCOTFBMEM2N0ZBMDgxMUUxOEEyNUI5MThGOEZENDVFQSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpCOTFBMEM2OEZBMDgxMUUxOEEyNUI5MThGOEZENDVFQSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PkxtmEIAAAAeUExUReXo7v////7+/vj4+Nra2srKyvHx8f39/ejo6Pz8/K+NVjwAAAAxSURBVHja7NO5EQAgDMCwhC+w/8L0DEAljeA7RwCPOfbqp1qmFmAQMAgYBH4OcgUYALTwAOeh7Y3cAAAAAElFTkSuQmCC') repeat-y right top; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAAFCAMAAACKJ3hCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjkxQTBDNjlGQTA4MTFFMThBMjVCOTE4RjhGRDQ1RUEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjkxQTBDNkFGQTA4MTFFMThBMjVCOTE4RjhGRDQ1RUEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpCOTFBMEM2N0ZBMDgxMUUxOEEyNUI5MThGOEZENDVFQSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpCOTFBMEM2OEZBMDgxMUUxOEEyNUI5MThGOEZENDVFQSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PkxtmEIAAAAeUExUReXo7v////7+/vj4+Nra2srKyvHx8f39/ejo6Pz8/K+NVjwAAAAxSURBVHja7NO5EQAgDMCwhC+w/8L0DEAljeA7RwCPOfbqp1qmFmAQMAgYBH4OcgUYALTwAOeh7Y3cAAAAAElFTkSuQmCC') repeat-y right top;
} }
/* line 22, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 28, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#main { #main {
width: 100%; width: 100%;
min-width: 650px; min-width: 650px;
padding: 20px 48px 40px 32px; padding: 20px 48px 40px 32px;
} }
/* line 26, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 32, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#main.maximized { #main.maximized {
padding: 60px 100px 30px 440px; padding: 60px 100px 30px 440px;
} }
/* line 29, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 35, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#right { #right {
width: 205px; width: 205px;
min-width: 205px; min-width: 205px;
@ -1818,7 +1827,7 @@ body > div {
border-bottom: 1px solid #dddddd; border-bottom: 1px solid #dddddd;
} }
/* line 38, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 44, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
.duration_label { .duration_label {
display: inline-block; display: inline-block;
width: 12px; width: 12px;
@ -1829,133 +1838,133 @@ body > div {
} }
@media screen { @media screen {
/* line 47, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 53, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 300px; min-width: 300px;
} }
/* line 49, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 55, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#main { #main {
padding-left: 22px; padding-left: 22px;
padding-right: 38px; padding-right: 38px;
} }
} }
@media screen and (min-width: 1340px) { @media screen and (min-width: 1340px) {
/* line 55, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 61, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 305px; min-width: 305px;
} }
} }
@media screen and (min-width: 1350px) { @media screen and (min-width: 1350px) {
/* line 59, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 65, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 310px; min-width: 310px;
} }
} }
@media screen and (min-width: 1360px) { @media screen and (min-width: 1360px) {
/* line 63, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 69, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 315px; min-width: 315px;
} }
} }
@media screen and (min-width: 1370px) { @media screen and (min-width: 1370px) {
/* line 67, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 73, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 320px; min-width: 320px;
} }
} }
@media screen and (min-width: 1380px) { @media screen and (min-width: 1380px) {
/* line 71, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 77, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 325px; min-width: 325px;
} }
} }
@media screen and (min-width: 1390px) { @media screen and (min-width: 1390px) {
/* line 75, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 81, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 330px; min-width: 330px;
} }
} }
@media screen and (min-width: 1400px) { @media screen and (min-width: 1400px) {
/* line 79, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 85, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 345px; min-width: 345px;
} }
} }
@media screen and (min-width: 1410px) { @media screen and (min-width: 1410px) {
/* line 83, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 89, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 350px; min-width: 350px;
} }
} }
@media screen and (min-width: 1420px) { @media screen and (min-width: 1420px) {
/* line 87, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 93, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 355px; min-width: 355px;
} }
} }
@media screen and (min-width: 1430px) { @media screen and (min-width: 1430px) {
/* line 91, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 97, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 360px; min-width: 360px;
} }
} }
@media screen and (min-width: 1440px) { @media screen and (min-width: 1440px) {
/* line 95, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 101, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
.duration_label { .duration_label {
display: inline; display: inline;
background: none; background: none;
} }
/* line 98, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 104, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 365px; min-width: 365px;
} }
/* line 100, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 106, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#main { #main {
padding-left: 32px; padding-left: 32px;
padding-right: 48px; padding-right: 48px;
} }
} }
@media screen and (min-width: 1450px) { @media screen and (min-width: 1450px) {
/* line 106, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 112, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 370px; min-width: 370px;
} }
} }
@media screen and (min-width: 1455px) { @media screen and (min-width: 1455px) {
/* line 110, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 116, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 375px; min-width: 375px;
} }
} }
@media screen and (min-width: 1460px) { @media screen and (min-width: 1460px) {
/* line 114, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 120, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 380px; min-width: 380px;
} }
} }
@media screen and (min-width: 1465px) { @media screen and (min-width: 1465px) {
/* line 118, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 124, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 385px; min-width: 385px;
} }
} }
@media screen and (min-width: 1470px) { @media screen and (min-width: 1470px) {
/* line 122, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 128, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 390px; min-width: 390px;
} }
} }
@media screen and (min-width: 1475px) { @media screen and (min-width: 1475px) {
/* line 126, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 132, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 395px; min-width: 395px;
} }
} }
@media screen and (min-width: 1480px) { @media screen and (min-width: 1480px) {
/* line 130, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */ /* line 136, /Users/sven/Development/projects/travis/travis-ember/assets/stylesheets/layout.sass */
#left { #left {
min-width: 400px; min-width: 400px;
} }