From df828cfa1fe2f7b899bfef7b1638c05c75c409a3 Mon Sep 17 00:00:00 2001 From: Radek Stepan Date: Fri, 29 Aug 2014 20:06:18 -0700 Subject: [PATCH] add project form --- build/app.bundle.css | 26 ++++++++--- build/app.bundle.js | 2 +- build/app.css | 26 ++++++++--- build/app.js | 2 +- src/styles/app.styl | 83 ++++++++++++++++++++++++++++++++--- src/templates/layout.mustache | 24 ++++++++++ 6 files changed, 144 insertions(+), 19 deletions(-) diff --git a/build/app.bundle.css b/build/app.bundle.css index 3cf3ae7..49f7384 100644 --- a/build/app.bundle.css +++ b/build/app.bundle.css @@ -421,7 +421,7 @@ table { .icon.down-open:before{content:'\e807'} body{color:#3e4457;font-family:'MuseoSans500Regular',sans-serif} -a{color:#aaa;text-decoration:none} +a{color:#b1b6c4;text-decoration:none} h1,h2,h3,p{margin:0} ul{list-style-type:none;margin:0;padding:0;} ul li{display:inline-block} @@ -434,25 +434,25 @@ ul li{display:inline-block} #head .q .icon{position:absolute;color:#303d4a;} #head .q .icon.search{top:8px;left:12px} #head .q .icon.down-open{top:8px;right:12px} -#head .q input{background:rgba(0,0,0,0.3);border:0;padding:10px 12px 10px 36px;font-family:'MuseoSlab500Regular',serif;font-size:14px;-webkit-border-radius:2px;border-radius:2px;color:rgba(255,255,255,0.5);width:220px} +#head .q input{background:rgba(0,0,0,0.3);border:0;padding:10px 12px 10px 36px;font-size:14px;-webkit-border-radius:2px;border-radius:2px;color:rgba(255,255,255,0.5);width:220px} #head ul{display:inline-block;} #head ul li{margin-left:30px} #head a{font-weight:bold;} #head a.active,#head a:hover{color:#dde1ed} #head .right{float:right;margin-right:20px;line-height:64px;} -#head .right a{-webkit-border-radius:2px;border-radius:2px;background:#fff;color:#00b361;padding:10px 20px} +#head .right a{-webkit-border-radius:2px;border-radius:2px;background:#fff;color:#00b361;padding:11px 20px} #title{border-bottom:3px solid #f3f4f8;} #title h2{border-bottom:3px solid #aaafbf;margin:30px 0 -3px 0;display:inline-block;padding-bottom:20px} #title .milestone{font-size:16px;font-weight:bold;margin:0 20px} -#title .description{display:inline-block;font-family:'MuseoSlab500Regular',serif;color:#aaa} +#title .description{display:inline-block;font-family:'MuseoSlab500Regular',serif;color:#b1b6c4} #content{padding:20px;margin-top:20px;} #content #hero{background:url("img/hires/2.jpg") center;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-webkit-border-radius:2px;border-radius:2px;margin-bottom:30px;} #content #hero .content{-webkit-border-radius:2px;border-radius:2px;color:#fff;padding:30px;background:rgba(0,0,0,0.3);-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);} #content #hero .content h2{margin-bottom:20px;margin-left:140px} -#content #hero .content p{font-family:'MuseoSlab500Regular',serif;font-size:18px;line-height:24px;margin-left:140px} +#content #hero .content p{font-family:'MuseoSlab500Regular',serif;font-size:18px;line-height:24px;margin-left:140px;text-align:justify;text-justify:inter-word} #content #hero .content .address{font-size:120px;float:left} #content #hero .content .cta{text-align:center;margin-top:10px;} -#content #hero .content .cta a{font-family:'MuseoSlab500Regular',serif;padding:10px 20px;-webkit-border-radius:2px;border-radius:2px;display:inline-block;margin:0 4px;} +#content #hero .content .cta a{font-family:'MuseoSlab500Regular',serif;padding:11px 20px;-webkit-border-radius:2px;border-radius:2px;display:inline-block;margin:0 4px;} #content #hero .content .cta a.primary{font-weight:bold;background:#00b361;color:#fff} #content #hero .content .cta a.secondary{background:#fff;color:#00b361} #content #repos{border:1px solid #cdcecf;-webkit-border-radius:2px;border-radius:2px;} @@ -479,4 +479,18 @@ ul li{display:inline-block} #content #repos .header a{font-family:'MuseoSlab500Regular',serif} #content #repos .footer{background:#f9fafb;color:#aaafbf;-webkit-box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);border-top:1px solid #dde1ed;text-align:right;font-family:'MuseoSlab500Regular',serif;} #content #repos .footer .icon{color:#aaafbf} +#content #add{border:1px solid #cdcecf;-webkit-border-radius:2px;border-radius:2px;width:400px;margin-top:30px;} +#content #add h2{color:#3e4457} +#content #add p{font-family:'MuseoSlab500Regular',serif;color:#b1b6c4;margin-top:10px;line-height:20px;text-align:justify;text-justify:inter-word;} +#content #add p a{color:#3e4457} +#content #add .form{padding:20px;} +#content #add .form table{width:100%;} +#content #add .form table tr td:first-child{width:100%} +#content #add .form input{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:10px;width:100%;-webkit-border-radius:2px 0 0 2px;border-radius:2px 0 0 2px;border:1px solid #dde1ed;border-right:0;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);box-shadow:inset 0 1px 2px rgba(0,0,0,0.2)} +#content #add .form a{margin-left:-2px;font-family:'MuseoSlab500Regular',serif;padding:11px 20px;-webkit-border-radius:0 2px 2px 0;border-radius:0 2px 2px 0;display:inline-block;font-weight:bold;background:#00b361;color:#fff} +#content #add .header,#content #add .footer{padding:20px 30px} +#content #add .header{-webkit-box-shadow:0 1px 2px rgba(221,225,237,0.5);box-shadow:0 1px 2px rgba(221,225,237,0.5);margin-bottom:2px;border-bottom:1px solid #dde1ed;} +#content #add .header a{font-family:'MuseoSlab500Regular',serif} +#content #add .footer{background:#f9fafb;color:#aaafbf;-webkit-box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);border-top:1px solid #dde1ed;text-align:center;font-family:'MuseoSlab500Regular',serif;} +#content #add .footer .icon{color:#aaafbf} #footer{border-top:1px solid #f3f4f8;text-align:center;padding:30px;margin-top:30px;font-family:'MuseoSlab500Regular',serif} diff --git a/build/app.bundle.js b/build/app.bundle.js index c3e2e38..d3c179a 100644 --- a/build/app.bundle.js +++ b/build/app.bundle.js @@ -29762,7 +29762,7 @@ if ( typeof window === "object" && typeof window.document === "object" ) { // layout.mustache root.require.register('burnchart/src/templates/layout.js', function(exports, require, module) { - module.exports = ["
","
"," Sign In","
","","

","","
"," "," "," ","
",""," ","
","","
","
","

Disposable Project

"," Milestone 1.0","

The one where we deliver all that we promised.

","
","
","","
","
","
"," ","

See your project progress

","

Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

","
"," Add your project"," Read the Guide","
","
","
","","
","
"," Sorted by priority","

Projects

","
",""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ","
radekstepan/disposableMilestone 1.0 ","
"," 40%"," due on Friday","
","
","
","
","
radekstepan/burnchartBeta Milestone ","
"," 100%"," due tomorrow","
","
","
","
","
intermine/intermineEmma Release 96 ","
"," 27%"," due in 2 weeks","
","
","
","
","
microsoft/windowsRC 9 ","
"," 90%"," overdue by a month","
","
","
","
","
","","
"," Edit","
","
","
","","
","
"," © 2012-2014 Radek Stepan","
","
"].join("\n"); + module.exports = ["
","
"," Sign In","
","","

","","
"," "," "," ","
",""," ","
","","
","
","

Disposable Project

"," Milestone 1.0","

The one where we deliver all that we promised.

","
","
","","
","
","
"," ","

See your project progress

","

Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

","
"," Add your project"," Read the Guide","
","
","
","","
","
"," Sorted by priority","

Projects

","
",""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ","
radekstepan/disposableMilestone 1.0 ","
"," 40%"," due on Friday","
","
","
","
","
radekstepan/burnchartBeta Milestone ","
"," 100%"," due tomorrow","
","
","
","
","
intermine/intermineEmma Release 96 ","
"," 27%"," due in 2 weeks","
","
","
","
","
microsoft/windowsRC 9 ","
"," 90%"," overdue by a month","
","
","
","
","
","","
"," Edit","
","
","","
","
","

Add a Project

","

Type in the name of the repository as you would normally. If you'd like to add a private GitHub project, Sign In first.

","
","","
"," "," "," "," "," ","
"," "," "," Add","
","
","","
"," Connecting to your repo.","
","
","
","","
","
"," © 2012-2014 Radek Stepan","
","
"].join("\n"); }); })(); diff --git a/build/app.css b/build/app.css index 6a6ff3b..33f2a65 100644 --- a/build/app.css +++ b/build/app.css @@ -14,7 +14,7 @@ .icon.down-open:before{content:'\e807'} body{color:#3e4457;font-family:'MuseoSans500Regular',sans-serif} -a{color:#aaa;text-decoration:none} +a{color:#b1b6c4;text-decoration:none} h1,h2,h3,p{margin:0} ul{list-style-type:none;margin:0;padding:0;} ul li{display:inline-block} @@ -27,25 +27,25 @@ ul li{display:inline-block} #head .q .icon{position:absolute;color:#303d4a;} #head .q .icon.search{top:8px;left:12px} #head .q .icon.down-open{top:8px;right:12px} -#head .q input{background:rgba(0,0,0,0.3);border:0;padding:10px 12px 10px 36px;font-family:'MuseoSlab500Regular',serif;font-size:14px;-webkit-border-radius:2px;border-radius:2px;color:rgba(255,255,255,0.5);width:220px} +#head .q input{background:rgba(0,0,0,0.3);border:0;padding:10px 12px 10px 36px;font-size:14px;-webkit-border-radius:2px;border-radius:2px;color:rgba(255,255,255,0.5);width:220px} #head ul{display:inline-block;} #head ul li{margin-left:30px} #head a{font-weight:bold;} #head a.active,#head a:hover{color:#dde1ed} #head .right{float:right;margin-right:20px;line-height:64px;} -#head .right a{-webkit-border-radius:2px;border-radius:2px;background:#fff;color:#00b361;padding:10px 20px} +#head .right a{-webkit-border-radius:2px;border-radius:2px;background:#fff;color:#00b361;padding:11px 20px} #title{border-bottom:3px solid #f3f4f8;} #title h2{border-bottom:3px solid #aaafbf;margin:30px 0 -3px 0;display:inline-block;padding-bottom:20px} #title .milestone{font-size:16px;font-weight:bold;margin:0 20px} -#title .description{display:inline-block;font-family:'MuseoSlab500Regular',serif;color:#aaa} +#title .description{display:inline-block;font-family:'MuseoSlab500Regular',serif;color:#b1b6c4} #content{padding:20px;margin-top:20px;} #content #hero{background:url("img/hires/2.jpg") center;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-webkit-border-radius:2px;border-radius:2px;margin-bottom:30px;} #content #hero .content{-webkit-border-radius:2px;border-radius:2px;color:#fff;padding:30px;background:rgba(0,0,0,0.3);-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);} #content #hero .content h2{margin-bottom:20px;margin-left:140px} -#content #hero .content p{font-family:'MuseoSlab500Regular',serif;font-size:18px;line-height:24px;margin-left:140px} +#content #hero .content p{font-family:'MuseoSlab500Regular',serif;font-size:18px;line-height:24px;margin-left:140px;text-align:justify;text-justify:inter-word} #content #hero .content .address{font-size:120px;float:left} #content #hero .content .cta{text-align:center;margin-top:10px;} -#content #hero .content .cta a{font-family:'MuseoSlab500Regular',serif;padding:10px 20px;-webkit-border-radius:2px;border-radius:2px;display:inline-block;margin:0 4px;} +#content #hero .content .cta a{font-family:'MuseoSlab500Regular',serif;padding:11px 20px;-webkit-border-radius:2px;border-radius:2px;display:inline-block;margin:0 4px;} #content #hero .content .cta a.primary{font-weight:bold;background:#00b361;color:#fff} #content #hero .content .cta a.secondary{background:#fff;color:#00b361} #content #repos{border:1px solid #cdcecf;-webkit-border-radius:2px;border-radius:2px;} @@ -72,4 +72,18 @@ ul li{display:inline-block} #content #repos .header a{font-family:'MuseoSlab500Regular',serif} #content #repos .footer{background:#f9fafb;color:#aaafbf;-webkit-box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);border-top:1px solid #dde1ed;text-align:right;font-family:'MuseoSlab500Regular',serif;} #content #repos .footer .icon{color:#aaafbf} +#content #add{border:1px solid #cdcecf;-webkit-border-radius:2px;border-radius:2px;width:400px;margin-top:30px;} +#content #add h2{color:#3e4457} +#content #add p{font-family:'MuseoSlab500Regular',serif;color:#b1b6c4;margin-top:10px;line-height:20px;text-align:justify;text-justify:inter-word;} +#content #add p a{color:#3e4457} +#content #add .form{padding:20px;} +#content #add .form table{width:100%;} +#content #add .form table tr td:first-child{width:100%} +#content #add .form input{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:10px;width:100%;-webkit-border-radius:2px 0 0 2px;border-radius:2px 0 0 2px;border:1px solid #dde1ed;border-right:0;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.2);box-shadow:inset 0 1px 2px rgba(0,0,0,0.2)} +#content #add .form a{margin-left:-2px;font-family:'MuseoSlab500Regular',serif;padding:11px 20px;-webkit-border-radius:0 2px 2px 0;border-radius:0 2px 2px 0;display:inline-block;font-weight:bold;background:#00b361;color:#fff} +#content #add .header,#content #add .footer{padding:20px 30px} +#content #add .header{-webkit-box-shadow:0 1px 2px rgba(221,225,237,0.5);box-shadow:0 1px 2px rgba(221,225,237,0.5);margin-bottom:2px;border-bottom:1px solid #dde1ed;} +#content #add .header a{font-family:'MuseoSlab500Regular',serif} +#content #add .footer{background:#f9fafb;color:#aaafbf;-webkit-box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);box-shadow:inset 0 1px 2px rgba(221,225,237,0.2);border-top:1px solid #dde1ed;text-align:center;font-family:'MuseoSlab500Regular',serif;} +#content #add .footer .icon{color:#aaafbf} #footer{border-top:1px solid #f3f4f8;text-align:center;padding:30px;margin-top:30px;font-family:'MuseoSlab500Regular',serif} diff --git a/build/app.js b/build/app.js index 2b7bcac..86bf26f 100644 --- a/build/app.js +++ b/build/app.js @@ -228,7 +228,7 @@ // layout.mustache root.require.register('burnchart/src/templates/layout.js', function(exports, require, module) { - module.exports = ["
","
"," Sign In","
","","

","","
"," "," "," ","
",""," ","
","","
","
","

Disposable Project

"," Milestone 1.0","

The one where we deliver all that we promised.

","
","
","","
","
","
"," ","

See your project progress

","

Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

","
"," Add your project"," Read the Guide","
","
","
","","
","
"," Sorted by priority","

Projects

","
",""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ","
radekstepan/disposableMilestone 1.0 ","
"," 40%"," due on Friday","
","
","
","
","
radekstepan/burnchartBeta Milestone ","
"," 100%"," due tomorrow","
","
","
","
","
intermine/intermineEmma Release 96 ","
"," 27%"," due in 2 weeks","
","
","
","
","
microsoft/windowsRC 9 ","
"," 90%"," overdue by a month","
","
","
","
","
","","
"," Edit","
","
","
","","
","
"," © 2012-2014 Radek Stepan","
","
"].join("\n"); + module.exports = ["
","
"," Sign In","
","","

","","
"," "," "," ","
",""," ","
","","
","
","

Disposable Project

"," Milestone 1.0","

The one where we deliver all that we promised.

","
","
","","
","
","
"," ","

See your project progress

","

Not sure where to start? Just add a demo repo to see a chart. There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

","
"," Add your project"," Read the Guide","
","
","
","","
","
"," Sorted by priority","

Projects

","
",""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ","
radekstepan/disposableMilestone 1.0 ","
"," 40%"," due on Friday","
","
","
","
","
radekstepan/burnchartBeta Milestone ","
"," 100%"," due tomorrow","
","
","
","
","
intermine/intermineEmma Release 96 ","
"," 27%"," due in 2 weeks","
","
","
","
","
microsoft/windowsRC 9 ","
"," 90%"," overdue by a month","
","
","
","
","
","","
"," Edit","
","
","","
","
","

Add a Project

","

Type in the name of the repository as you would normally. If you'd like to add a private GitHub project, Sign In first.

","
","","
"," "," "," "," "," ","
"," "," "," Add","
","
","","
"," Connecting to your repo.","
","
","
","","
","
"," © 2012-2014 Radek Stepan","
","
"].join("\n"); }); })(); diff --git a/src/styles/app.styl b/src/styles/app.styl index 4a28f04..da50911 100644 --- a/src/styles/app.styl +++ b/src/styles/app.styl @@ -8,7 +8,7 @@ body font-family: $sans_serif_font a - color: #AAAAAA + color: #B1B6C4 text-decoration: none h1, h2, h3, p @@ -68,7 +68,6 @@ ul background: rgba(#000, 30%) border: 0 padding: 10px 12px 10px 36px - font-family: $serif_font font-size: 14px border-radius: 2px color: rgba(#FFF, 50%) @@ -95,7 +94,7 @@ ul border-radius: 2px background: #FFF color: #00B361 - padding: 10px 20px + padding: 11px 20px #title border-bottom: 3px solid #F3F4F8 @@ -114,7 +113,7 @@ ul .description display: inline-block font-family: $serif_font - color: #AAAAAA + color: #B1B6C4 #content padding: 20px @@ -142,6 +141,8 @@ ul font-size: 18px line-height: 24px margin-left: 140px + text-align: justify + text-justify: inter-word .address font-size: 120px @@ -153,7 +154,7 @@ ul a font-family: $serif_font - padding: 10px 20px + padding: 11px 20px border-radius: 2px display: inline-block margin: 0 4px @@ -265,6 +266,78 @@ ul .icon color: #AAAFBF + #add + border: 1px solid #CDCECF + border-radius: 2px + width: 400px + margin-top: 30px + + h2 + color: #3E4457 + + p + font-family: $serif_font + color: #B1B6C4 + margin-top: 10px + line-height: 20px + text-align: justify + text-justify: inter-word + + a + color: #3E4457 + + .form + padding: 20px + + table + width: 100% + + tr + td + &:first-child + width: 100% + + input + box-sizing: border-box + padding: 10px + width: 100% + border-radius: 2px 0 0 2px + border: 1px solid #DDE1ED + border-right: 0 + box-shadow: inset 0 1px 2px rgba(#000, 20%) + + a + margin-left: -2px + font-family: $serif_font + padding: 11px 20px + border-radius: 0 2px 2px 0 + display: inline-block + font-weight: bold + background: #00B361 + color: #FFF + + .header, .footer + padding: 20px 30px + + .header + box-shadow: 0 1px 2px rgba(#DDE1ED, 50%) + margin-bottom: 2px + border-bottom: 1px solid #DDE1ED + + a + font-family: $serif_font + + .footer + background: #F9FAFB + color: #AAAFBF + box-shadow: inset 0 1px 2px rgba(#DDE1ED, 20%) + border-top: 1px solid #DDE1ED + text-align: center + font-family: $serif_font + + .icon + color: #AAAFBF + #footer border-top: 1px solid #F3F4F8 text-align: center diff --git a/src/templates/layout.mustache b/src/templates/layout.mustache index 8f57165..e6af466 100644 --- a/src/templates/layout.mustache +++ b/src/templates/layout.mustache @@ -103,6 +103,30 @@ Edit + +
+
+

Add a Project

+

Type in the name of the repository as you would normally. If you'd like to add a private GitHub project, Sign In first.

+
+ +
+ + + + + +
+ + + Add +
+
+ +
+ Connecting to your repo. +
+