From ffcfd428b8372b3b5fafc70acf2ecc189bd7712e Mon Sep 17 00:00:00 2001 From: FuXiaoHei Date: Sun, 2 Mar 2014 15:31:06 +0800 Subject: ui design for sign-in and sign-up page add /login and /sign-up link for user signing fix typo error --- public/css/gogs.css | 118 +++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 98 insertions(+), 20 deletions(-) (limited to 'public/css/gogs.css') diff --git a/public/css/gogs.css b/public/css/gogs.css index ff3d7a99..68c2b8a4 100755 --- a/public/css/gogs.css +++ b/public/css/gogs.css @@ -5,31 +5,109 @@ */ body { - padding-top: 70px; + background: #F6F6F6; } -.navbar { - min-height: 45px; + +/* gogits nav header */ +.gogs-masthead { + background-color: #428bca; + box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1); + min-height: 45px; + padding: 2px 16px; +} + +/* gogits nav item link */ +.gogs-nav-item { + position: relative; + display: inline-block; + padding: 10px; + font-weight: bold; + color: #EEE; + font-size: 100%; +} + +.gogs-nav-item:hover, +.gogs-nav-item:focus { + color: #fff; + text-decoration: none; +} + +.gogs-nav-item.navbar-btn { + cursor: pointer; + margin-top: 8px; + padding: 5px 15px; } -.navbar-brand { - height: 45px; - padding: 5px 10px 0px 10px; - border-left: 1px solid #e5e5e5; - border-right: 1px solid #e5e5e5; + +/* gogits nav item active status */ +.gogs-nav .active { + color: #fff; } -.navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover { - background-color: #f0f0f0; + +.gogs-nav .active:after { + position: absolute; + bottom: -2px; + left: 50%; + width: 0; + height: 0; + margin-left: -5px; + vertical-align: middle; + content: " "; + border-right: 5px solid transparent; + border-bottom: 5px solid; + border-left: 5px solid transparent; } -.navbar-brand img { - width: 32px; + +/* gogits logo */ +#gogs-logo { + width: 28px; } -.navbar-nav > li > a { - font-size: 16px; - padding-top: 13px; + +/* gogits body */ +#gogs-body { + padding-top: 30px; + padding-bottom: 60px; } -.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { - color: rgb(153, 153, 153); + +/* gogits login card */ +#gogs-login-card { + width: 600px; + margin: auto; + padding: 30px; + background: #fff; + border: 1px solid #ccc; + border-radius: 5px; + box-sizing: border-box; } -.navbar-btn, .navbar .btn { - padding: 5px 15px; - margin-top: 7px; + +#gogs-login-card h3 { + margin-top: 0; + margin-bottom: 30px; + padding-bottom: 20px; + border-bottom: 1px solid #ccc; +} + +#gogs-login-card .form-control { + padding: 6px 12px; + box-sizing: content-box; +} + +#gogs-login-card .control-label { + height: 44px; + line-height: 30px; +} + +#gogs-login-card .btn{ + cursor: pointer; + margin-right: 1.2em; +} + +#gogs-social-login{ + margin-top: 30px; + padding-top: 20px; + border-top: 1px solid #ccc; +} + +#gogs-social-login .btn{ + float: none; + margin: auto; } \ No newline at end of file -- cgit v1.2.3 From ffe0ba562c2d749ea904e7171b424ae251c1f62e Mon Sep 17 00:00:00 2001 From: FuXiaoHei Date: Sun, 2 Mar 2014 21:47:55 +0800 Subject: ui for user/profile page, only skeleton --- public/css/gogs.css | 60 +++++++++++++++++++++++++++++++++++++++++++++ public/js/app.js | 17 +++++++++++++ routers/user/user.go | 7 ++++++ templates/base/head.tmpl | 2 +- templates/user/delete.tmpl | 2 +- templates/user/profile.tmpl | 37 ++++++++++++++++++++++++++++ templates/user/signup.tmpl | 2 +- web.go | 1 + 8 files changed, 125 insertions(+), 3 deletions(-) create mode 100644 public/js/app.js create mode 100644 templates/user/profile.tmpl (limited to 'public/css/gogs.css') diff --git a/public/css/gogs.css b/public/css/gogs.css index 68c2b8a4..39796f6e 100755 --- a/public/css/gogs.css +++ b/public/css/gogs.css @@ -8,6 +8,22 @@ body { background: #F6F6F6; } +/* override bs3 */ + +.tooltip-inner{ + border-radius: 3px; + background: #333; + border: none; +} + +.tooltip-arrow{ + border-bottom-color: #333 !important; +} + +.fa{ + margin: 0 .5em; +} + /* gogits nav header */ .gogs-masthead { background-color: #428bca; @@ -110,4 +126,48 @@ body { #gogs-social-login .btn{ float: none; margin: auto; +} + +/* gogs-user-profile */ + +#gogs-user-avatar{ + width: 200px; + height: 200px; + border-radius: 6px; +} + +#gogs-user-name{ + margin-top: 20px; + font-size: 1.6em; + font-weight: bold; + margin-bottom: 20px; +} + +#gogs-user-profile .profile-info .list-group-item{ + background-color: transparent; + padding-top: 18px; + color: #666; +} + +#gogs-user-profile .profile-info .list-group-item a{ + margin: 0; + padding: 0; + display: inline; + color: #0093c4; +} + +#gogs-user-profile .profile-info .list-group{ + border-top: 1px solid #ccc; + padding-bottom: 18px; + border-bottom: 1px solid #ccc; + padding-left: 18px; + padding-right: 18px; +} + +#gogs-user-activity .tab-pane{ + padding: 20px; +} + +#gogs-user-act-tabs li.active a{ + border-bottom-color: #ddd; } \ No newline at end of file diff --git a/public/js/app.js b/public/js/app.js new file mode 100644 index 00000000..a8220f46 --- /dev/null +++ b/public/js/app.js @@ -0,0 +1,17 @@ +var Gogits = {}; + +(function($){ + Gogits.showTooltips = function(){ + $("body").tooltip({ + selector: "[data-toggle=tooltip]" + //container: "body" + }); + }; + Gogits.showTab = function (selector, index) { + if (!index) { + index = 0; + } + $(selector).tab("show"); + $(selector).find("li:eq(" + index + ") a").tab("show"); + } +})(jQuery); \ No newline at end of file diff --git a/routers/user/user.go b/routers/user/user.go index 241a9f35..7cd8bca5 100644 --- a/routers/user/user.go +++ b/routers/user/user.go @@ -16,6 +16,13 @@ import ( "github.com/gogits/gogs/utils/log" ) +func Profile(r render.Render) { + r.HTML(200, "user/profile", map[string]interface{}{ + "Title": "Username", + }) + return +} + func SignIn(req *http.Request, r render.Render) { if req.Method == "GET" { r.HTML(200, "user/signin", map[string]interface{}{ diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl index ac0b9594..4358bf02 100644 --- a/templates/base/head.tmpl +++ b/templates/base/head.tmpl @@ -15,7 +15,7 @@ - + {{.Title}} | {{AppName}} diff --git a/templates/user/delete.tmpl b/templates/user/delete.tmpl index 55993633..939048b4 100644 --- a/templates/user/delete.tmpl +++ b/templates/user/delete.tmpl @@ -1,6 +1,6 @@ {{template "base/head" .}} {{template "base/navbar" .}} -
+
diff --git a/templates/user/profile.tmpl b/templates/user/profile.tmpl new file mode 100644 index 00000000..f3260100 --- /dev/null +++ b/templates/user/profile.tmpl @@ -0,0 +1,37 @@ +{{template "base/head" .}} +{{template "base/navbar" .}} +
+
+
+ + user-avatar + + Username +
+
+ +
+
+
+ +
+
repo
+
activity
+
+
+
+ +{{template "base/footer" .}} \ No newline at end of file diff --git a/templates/user/signup.tmpl b/templates/user/signup.tmpl index 2e127a62..0bac3244 100644 --- a/templates/user/signup.tmpl +++ b/templates/user/signup.tmpl @@ -37,7 +37,7 @@
- Already have an account? Sign in now! + Already have an account? Sign in now!
diff --git a/web.go b/web.go index 71529a8e..77226f57 100644 --- a/web.go +++ b/web.go @@ -54,6 +54,7 @@ func runWeb(*cli.Context) { m.Any("/sign-up", user.SignUp) m.Any("/user/signup", user.SignUp) + m.Get("/user/profile", user.Profile) // should be /username m.Any("/user/delete", user.Delete) m.Any("/user/publickey/add", user.AddPublicKey) m.Any("/repo/create", repo.Create) -- cgit v1.2.3 From 71bae3ebd37e20130131328923dbff2de35093b6 Mon Sep 17 00:00:00 2001 From: FuXiaoHei Date: Mon, 3 Mar 2014 00:22:20 +0800 Subject: ui for repo/create page --- public/css/gogs.css | 21 ++++++++++--- public/img/checkmark.png | Bin 0 -> 169 bytes templates/repo/create.tmpl | 73 ++++++++++++++++++++++++++++++++------------- templates/user/signin.tmpl | 2 +- templates/user/signup.tmpl | 2 +- 5 files changed, 72 insertions(+), 26 deletions(-) create mode 100644 public/img/checkmark.png (limited to 'public/css/gogs.css') diff --git a/public/css/gogs.css b/public/css/gogs.css index 39796f6e..08dada04 100755 --- a/public/css/gogs.css +++ b/public/css/gogs.css @@ -85,8 +85,7 @@ body { } /* gogits login card */ -#gogs-login-card { - width: 600px; +.gogs-card{ margin: auto; padding: 30px; background: #fff; @@ -95,13 +94,17 @@ body { box-sizing: border-box; } -#gogs-login-card h3 { +.gogs-card h3 { margin-top: 0; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid #ccc; } +#gogs-login-card{ + width: 600px; +} + #gogs-login-card .form-control { padding: 6px 12px; box-sizing: content-box; @@ -112,7 +115,7 @@ body { line-height: 30px; } -#gogs-login-card .btn{ +.gogs-card .btn{ cursor: pointer; margin-right: 1.2em; } @@ -170,4 +173,14 @@ body { #gogs-user-act-tabs li.active a{ border-bottom-color: #ddd; +} + +/* gogits repo create */ + +#gogs-repo-create{ + width: 800px; +} + +#gogs-repo-create textarea[name=desc]{ + height: 8em; } \ No newline at end of file diff --git a/public/img/checkmark.png b/public/img/checkmark.png new file mode 100644 index 00000000..ad85a910 Binary files /dev/null and b/public/img/checkmark.png differ diff --git a/templates/repo/create.tmpl b/templates/repo/create.tmpl index c93f9386..a3ad06df 100644 --- a/templates/repo/create.tmpl +++ b/templates/repo/create.tmpl @@ -1,24 +1,57 @@ {{template "base/head" .}} {{template "base/navbar" .}} -
-
-
-
- Owner: lunny -
-
- repo name: -
-
- description(optional): -
-
- -
-
- -
-
-
+
+
+

Create New Repository

+
+ +
+

Owner-name

+ +
+
+
+ +
+ + Great repository names are short and memorable. +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+
+
+ +
+
+
+
+
+ + Cancel +
+
+
{{template "base/footer" .}} \ No newline at end of file diff --git a/templates/user/signin.tmpl b/templates/user/signin.tmpl index c3a3131f..856e46d9 100644 --- a/templates/user/signin.tmpl +++ b/templates/user/signin.tmpl @@ -1,7 +1,7 @@ {{template "base/head" .}} {{template "base/navbar" .}}
-
+

Log in

diff --git a/templates/user/signup.tmpl b/templates/user/signup.tmpl index 0bac3244..48e50a00 100644 --- a/templates/user/signup.tmpl +++ b/templates/user/signup.tmpl @@ -1,7 +1,7 @@ {{template "base/head" .}} {{template "base/navbar" .}}
- +

Sign Up

-- cgit v1.2.3