IPythonNotebook: CSS adjustment for PR #4070

.travis.yml

@@ -1,9 +1,8 @@
 language: go
-
 go:
-  - 1.5
+  - 1.5.x
-  - 1.6
+  - 1.6.x
-  - 1.7
+  - 1.7.x
 
 before_install:
   - sudo apt-get update -qq
@@ -16,14 +15,3 @@ install:
 script: 
   - go build -v -tags "pam"
   - go test -v -cover -race ./...
-
-notifications:
-  email:
-    - u@gogs.io
-  slack: gophercn:o5pSanyTeNhnfYc3QnG0X7Wx
-  webhooks:
-    urls:
-      - https://webhooks.gitter.im/e/b590f8e03882f7aedc3e
-    on_success: change 
-    on_failure: always 
-    on_start: never     

gogs.go

@@ -16,7 +16,7 @@ import (
 	"github.com/gogits/gogs/modules/setting"
 )
 
-const APP_VER = "0.9.132.0201"
+const APP_VER = "0.9.133.0207"
 
 func init() {
 	setting.AppVer = APP_VER

public/css/gogs.css

@@ -812,7 +812,7 @@ footer .ui.language .menu {
   border: solid 1px #ccc;
   border-bottom-color: #bbb;
   border-radius: 3px;
-  box-shadow: inset 0 -1px 0 #bbbbbb;
+  box-shadow: inset 0 -1px 0 #bbb;
 }
 .markdown:not(code) input[type="checkbox"] {
   vertical-align: middle !important;
@@ -883,7 +883,7 @@ footer .ui.language .menu {
 }
 .install form label {
   text-align: right;
-  width: 320px;
+  width: 320px !important;
 }
 .install form input {
   width: 35% !important;
@@ -892,7 +892,7 @@ footer .ui.language .menu {
   text-align: left;
 }
 .install form .field .help {
-  margin-left: 335px;
+  margin-left: 335px !important;
 }
 .install form .field.optional .title {
   margin-left: 38%;
@@ -928,18 +928,18 @@ footer .ui.language .menu {
   text-align: center;
 }
 #create-page-form form .header {
-  padding-left: 280px;
+  padding-left: 280px !important;
 }
 #create-page-form form .inline.field > label {
   text-align: right;
-  width: 250px;
+  width: 250px !important;
   word-wrap: break-word;
 }
 #create-page-form form .help {
-  margin-left: 265px;
+  margin-left: 265px !important;
 }
 #create-page-form form .optional .title {
-  margin-left: 250px;
+  margin-left: 250px !important;
 }
 #create-page-form form input,
 #create-page-form form textarea {
@@ -965,7 +965,7 @@ footer .ui.language .menu {
 .user.reset.password form .header,
 .user.signin form .header,
 .user.signup form .header {
-  padding-left: 280px;
+  padding-left: 280px !important;
 }
 .user.activate form .inline.field > label,
 .user.forgot.password form .inline.field > label,
@@ -973,7 +973,7 @@ footer .ui.language .menu {
 .user.signin form .inline.field > label,
 .user.signup form .inline.field > label {
   text-align: right;
-  width: 250px;
+  width: 250px !important;
   word-wrap: break-word;
 }
 .user.activate form .help,
@@ -981,14 +981,14 @@ footer .ui.language .menu {
 .user.reset.password form .help,
 .user.signin form .help,
 .user.signup form .help {
-  margin-left: 265px;
+  margin-left: 265px !important;
 }
 .user.activate form .optional .title,
 .user.forgot.password form .optional .title,
 .user.reset.password form .optional .title,
 .user.signin form .optional .title,
 .user.signup form .optional .title {
-  margin-left: 250px;
+  margin-left: 250px !important;
 }
 .user.activate form input,
 .user.forgot.password form input,
@@ -1014,14 +1014,14 @@ footer .ui.language .menu {
 .user.reset.password form .header,
 .user.signin form .header,
 .user.signup form .header {
-  padding-left: 230px;
+  padding-left: 230px !important;
 }
 .user.activate form .inline.field > label,
 .user.forgot.password form .inline.field > label,
 .user.reset.password form .inline.field > label,
 .user.signin form .inline.field > label,
 .user.signup form .inline.field > label {
-  width: 200px;
+  width: 200px !important;
 }
 .repository.new.repo form,
 .repository.new.migrate form,
@@ -1037,24 +1037,24 @@ footer .ui.language .menu {
 .repository.new.repo form .header,
 .repository.new.migrate form .header,
 .repository.new.fork form .header {
-  padding-left: 280px;
+  padding-left: 280px !important;
 }
 .repository.new.repo form .inline.field > label,
 .repository.new.migrate form .inline.field > label,
 .repository.new.fork form .inline.field > label {
   text-align: right;
-  width: 250px;
+  width: 250px !important;
   word-wrap: break-word;
 }
 .repository.new.repo form .help,
 .repository.new.migrate form .help,
 .repository.new.fork form .help {
-  margin-left: 265px;
+  margin-left: 265px !important;
 }
 .repository.new.repo form .optional .title,
 .repository.new.migrate form .optional .title,
 .repository.new.fork form .optional .title {
-  margin-left: 250px;
+  margin-left: 250px !important;
 }
 .repository.new.repo form input,
 .repository.new.migrate form input,
@@ -1083,7 +1083,7 @@ footer .ui.language .menu {
   width: 50%!important;
 }
 .repository.new.repo .ui.form #auto-init {
-  margin-left: 265px;
+  margin-left: 265px !important;
 }
 .new.webhook form .help {
   margin-left: 25px;
@@ -1307,7 +1307,8 @@ footer .ui.language .menu {
   margin-bottom: -5px;
 }
 .repository.file.list #file-content #ipython-notebook {
-  margin-left: 80px;
+  margin-left: 95px;
+  padding-top: 1px;
 }
 .repository.file.list #file-content #ipython-notebook .nb-notebook {
   line-height: 1.5;
@@ -1324,6 +1325,47 @@ footer .ui.language .menu {
 .repository.file.list #file-content #ipython-notebook .nb-cell + .nb-cell {
   margin-top: 0.5em;
 }
+.repository.file.list #file-content #ipython-notebook .nb-cell {
+  position: relative;
+}
+.repository.file.list #file-content #ipython-notebook .nb-raw-cell {
+  white-space: pre-wrap;
+  background-color: #f5f2f0;
+  font-family: Consolas, Monaco, 'Andale Mono', monospace;
+  padding: 1em;
+  margin: .5em 0;
+}
+.repository.file.list #file-content #ipython-notebook .nb-input:before,
+.repository.file.list #file-content #ipython-notebook .nb-output:before {
+  position: absolute;
+  font-family: monospace;
+  color: #999;
+  left: -7.5em;
+  width: 7em;
+  text-align: right;
+}
+.repository.file.list #file-content #ipython-notebook .nb-input:before {
+  content: "In [" attr(data-prompt-number) "]:";
+}
+.repository.file.list #file-content #ipython-notebook .nb-input pre {
+  background-color: #f7f7f7;
+  margin-right: 10px;
+  padding: 5px 10px;
+}
+.repository.file.list #file-content #ipython-notebook .nb-input pre code {
+  line-height: 18px;
+  font-size: 14px;
+}
+.repository.file.list #file-content #ipython-notebook .nb-output:before {
+  content: "Out [" attr(data-prompt-number) "]:";
+}
+.repository.file.list #file-content #ipython-notebook .nb-output pre {
+  padding: 5px 10px;
+  font-size: 14px;
+}
+.repository.file.list #file-content #ipython-notebook .nb-output img {
+  max-width: 100%;
+}
 .repository.file.list #file-content #ipython-notebook .nb-output table {
   border: 1px solid #000;
   border-collapse: collapse;
@@ -1339,40 +1381,6 @@ footer .ui.language .menu {
   vertical-align: middle;
   border-collapse: collapse;
 }
-.repository.file.list #file-content #ipython-notebook .nb-cell {
-  position: relative;
-}
-.repository.file.list #file-content #ipython-notebook .nb-raw-cell {
-  white-space: pre-wrap;
-  background-color: #f5f2f0;
-  font-family: Consolas, Monaco, 'Andale Mono', monospace;
-  padding: 1em;
-  margin: .5em 0;
-}
-.repository.file.list #file-content #ipython-notebook .nb-output {
-  min-height: 1em;
-  width: 100%;
-  overflow-x: scroll;
-  border-right: 1px dotted #CCC;
-}
-.repository.file.list #file-content #ipython-notebook .nb-output img {
-  max-width: 100%;
-}
-.repository.file.list #file-content #ipython-notebook .nb-output:before,
-.repository.file.list #file-content #ipython-notebook .nb-input:before {
-  position: absolute;
-  font-family: monospace;
-  color: #999;
-  left: -7.5em;
-  width: 7em;
-  text-align: right;
-}
-.repository.file.list #file-content #ipython-notebook .nb-input:before {
-  content: "In [" attr(data-prompt-number) "]:";
-}
-.repository.file.list #file-content #ipython-notebook .nb-output:before {
-  content: "Out [" attr(data-prompt-number) "]:";
-}
 .repository.file.list #file-content #ipython-notebook .nb-markdown-cell {
   background-color: #eee;
   margin-left: -80px;
@@ -2614,18 +2622,18 @@ footer .ui.language .menu {
   text-align: center;
 }
 .organization.new.org form .header {
-  padding-left: 280px;
+  padding-left: 280px !important;
 }
 .organization.new.org form .inline.field > label {
   text-align: right;
-  width: 250px;
+  width: 250px !important;
   word-wrap: break-word;
 }
 .organization.new.org form .help {
-  margin-left: 265px;
+  margin-left: 265px !important;
 }
 .organization.new.org form .optional .title {
-  margin-left: 250px;
+  margin-left: 250px !important;
 }
 .organization.new.org form input,
 .organization.new.org form textarea {

public/less/_repository.less

@@ -252,7 +252,8 @@
 			}
 
 			#ipython-notebook {
-				margin-left: 80px;
+				margin-left: 95px;
+				padding-top: 1px;
 
 				.nb-notebook {
 					line-height: 1.5;    
@@ -272,23 +273,6 @@
 					margin-top: 0.5em;
 				}
 
-				.nb-output table {
-					border: 1px solid #000;
-					border-collapse: collapse;
-				}
-
-				.nb-output th {
-					font-weight: bold;
-				}
-
-				.nb-output th, .nb-output td {
-					border: 1px solid #000;
-					padding: 0.25em;    
-					text-align: left;
-					vertical-align: middle;
-					border-collapse: collapse;
-				}
-
 				.nb-cell {
 					position: relative;    
 				}
@@ -301,18 +285,8 @@
 					margin: .5em 0;
 				}
 
-				.nb-output {
+				.nb-input:before, 
-					min-height: 1em;    
+				.nb-output:before {
-					width: 100%;
-					overflow-x: scroll;
-					border-right: 1px dotted #CCC;
-				}
-
-				.nb-output img {
-					max-width: 100%;    
-				}
-
-				.nb-output:before, .nb-input:before {
 					position: absolute;    
 					font-family: monospace;
 					color: #999;
@@ -320,12 +294,49 @@
 					width: 7em;
 					text-align: right;
 				}
+				.nb-input {
+					&:before {
+						content: "In [" attr(data-prompt-number) "]:";
+					}
 
-				.nb-input:before {
+					pre {
-					content: "In [" attr(data-prompt-number) "]:";
+						background-color: #f7f7f7;
+						margin-right: 10px;
+						padding: 5px 10px;
+
+						code {
+							line-height: 18px;
+							font-size: 14px;
+						}
+					}
 				}
-				.nb-output:before {
+				.nb-output{
-					content: "Out [" attr(data-prompt-number) "]:";
+					&:before {
+						content: "Out [" attr(data-prompt-number) "]:";
+					}
+					
+					pre {
+						padding: 5px 10px;
+						font-size: 14px;
+					}
+					img {
+						max-width: 100%;    
+					}
+				  table {
+						border: 1px solid #000;
+						border-collapse: collapse;
+					}
+				  th {
+						font-weight: bold;
+					}
+					th,
+					td {
+						border: 1px solid #000;
+						padding: 0.25em;    
+						text-align: left;
+						vertical-align: middle;
+						border-collapse: collapse;
+					}
 				}
 
 				.nb-markdown-cell {

routers/repo/view.go

@@ -156,7 +156,7 @@ func renderFile(ctx *context.Context, entry *git.TreeEntry, treeLink, rawLink st
 		ctx.Data["IsMarkdown"] = isMarkdown
 		ctx.Data["ReadmeExist"] = isMarkdown && markdown.IsReadmeFile(blob.Name())
 
-		ctx.Data["IsIPyNB"] = strings.HasSuffix(blob.Name(), ".ipynb")
+		ctx.Data["IsIPythonNotebook"] = strings.HasSuffix(blob.Name(), ".ipynb")
 
 		if isMarkdown {
 			ctx.Data["FileContent"] = string(markdown.Render(buf, path.Dir(treeLink), ctx.Repo.Repository.ComposeMetas()))

templates/.VERSION

@@ -1 +1 @@
-0.9.132.0201
+0.9.133.0207

templates/base/head.tmpl

@@ -22,7 +22,7 @@
 	<link rel="stylesheet" href="{{AppSubUrl}}/assets/octicons-4.3.0/octicons.min.css">
 
 	<!-- notebook.js for rendering ipython notebooks and marked.js for rendering markdown in notebooks -->
-	{{if .IsIPyNB }}
+	{{if .IsIPythonNotebook }}
 		<script src="{{AppSubUrl}}/plugins/notebookjs-0.2.6/notebook.min.js"></script>
 		<script src="{{AppSubUrl}}/plugins/marked-0.3.6/marked.min.js"></script>
 	{{end}}

templates/repo/view_file.tmpl

@@ -36,12 +36,11 @@
 		{{end}}
 	</h4>
 	<div class="ui attached table segment">
-		<div class="file-view {{if .IsMarkdown}}markdown{{else if .ReadmeInList}}plain-text{{else if .IsTextFile}}code-view{{end}} has-emoji">
+		<div id="{{if .IsIPythonNotebook}}ipython-notebook{{end}}" class="file-view {{if .IsMarkdown}}markdown{{else if .ReadmeInList}}plain-text{{else if .IsIPythonNotebook}}ipython-notebook1{{else if and .IsTextFile}}code-view{{end}} has-emoji">
 			{{if or .IsMarkdown .ReadmeInList}}
 				{{if .FileContent}}{{.FileContent | Str2html}}{{end}}
-			{{else if .IsIPyNB}}
+			{{else if .IsIPythonNotebook}}
 				{{if .FileContent}}
-					<div id="ipython-notebook"></div>
 					<script>
 						var rendered = null;
 						$.getJSON("{{.RawFileLink}}", null, function(notebook_json) {