ipython notebook theme 변경

ipython notebook theme 변경

소스 :

https://github.com/dunovank/jupyter-themes 방법 :  http://seulcode.tistory.com/5 사용예 :

anaconda prompt >

pip install --upgrade jupyterthemes

jt -t monokai -cellw 1100

jt -t monokai -cellw 90%

그리고~~~~~~

jupyter 는 web이므로 js, css 변경이 가능하다.

수정파일

Anaconda3/Lib/site-packages/notebook/static/notebook/js/main.min.js

Anaconda3/Lib/site-packages/notebook/templates/notebook.html

Anaconda3/Lib/site-packages/notebook/templates/page.html

main.min.js 하단 require에 추가

	// my
	$('#myRearrange').click(function(){
		$(".container").css("margin", "0px");
		$(".output_wrapper").css("position", "absolute");
		$(".output_wrapper").css("left", "1000px");
		$(".output_wrapper").css("width", "900px");
	});
	// test...
	$('#myHideOutputAll').click(function(){
		$(".out_prompt_overlay").each(function(index){
			if($($(".out_prompt_overlay")[index]).css("display") != "none"){
				$($(".out_prompt_overlay")[index]).css("display", "none");
				$($(".output")[index]).css("display", "none");
				$($(".output_collapsed")[index]).css("display", "flex");
			}
		});
	});

	// test
	$('#myFunc2').click(function(){
		alert(2);
		$(".container").css("margin-left");			// auto
		$(".output_wrapper").css("position");	// relative
		$(".container").css("left");					// auto
		$(".container").css("width");				// 98%
		$("pre.CodeMirror-line").css("line-height");		//24.9333px
	});
	$('#myFunc3').click(function(){
		$("div.CodeMirror, div.CodeMirror pre").css("font-family", "consolas");
		$("div.CodeMirror, div.CodeMirror pre").css("font-size", "15pt");
	});

main.min.js 마지막에 추가

	var _zIndex = 10000;
	$(document).on('click', '.output_wrapper', function(){
		$(this).css("z-index", _zIndex++);
	});

notebook.html

                
My
					

						
z-index
						
changeFont
                        
myRearrange
                        
myHideOutputAll
						
reset
					
				

page.html

결과:

css를 이용해서, console 창을 오른쪽으로 배치해서 코드의 연속성을 높였다.

font-family 및 font-size 수정 후

더 할일:

console을 아예 popup으로 하고, edit의 width를 넓히면 좀더 원활한 작업이 가능할 듯 하다.