diff --git a/site/app.class.js b/site/app.class.js index 851dc27..f69cff8 100644 --- a/site/app.class.js +++ b/site/app.class.js @@ -56,13 +56,16 @@ class App project.files.create_version( './folder-test/depth-test/test-3.js', fs.readFileSync( '../test-folder/folder-2/test-3-diff-4.js', 'utf8' ) ) project.files.create_version( './folder-test/test-1.html', fs.readFileSync( '../test-folder/test-1.html', 'utf8' ) ) project.files.create_version( './folder-test/test-2.php', fs.readFileSync( '../test-folder/test-2.php', 'utf8' ) ) - project.files.create_version( './folder-test/big-one.txt', 'content 4\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline' ) + project.files.create_version( './folder-test/big-one.txt', 'line\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline' ) + project.files.create_version( './folder-test/loooooooooooooooooooooooooooooooong-one.txt', 'abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz' ) project.files.create_version( './icons/test.js', 'Test icon' ) project.files.create_version( './icons/test.html', 'Test icon' ) project.files.create_version( './icons/test.sass', 'Test icon' ) project.files.create_version( './icons/test.scss', 'Test icon' ) project.files.create_version( './icons/test.less', 'Test icon' ) + project.files.create_version( './icons/test.stylus', 'Test icon' ) + project.files.create_version( './icons/test.styl', 'Test icon' ) project.files.create_version( './icons/test.css', 'Test icon' ) project.files.create_version( './icons/test.php', 'Test icon' ) project.files.create_version( './icons/test.json', 'Test icon' ) diff --git a/site/public/javascript/services/project.js b/site/public/javascript/services/project.js index 7ae4c98..85cb90d 100644 --- a/site/public/javascript/services/project.js +++ b/site/public/javascript/services/project.js @@ -16,6 +16,12 @@ application.factory( _version.date_formated = _version.moment_date.format( 'LTS' ); _version.time_from_now = _version.moment_date.fromNow(); + // Lines + _version.lines = []; + var length = _version.content.split(/\r\n|\r|\n/).length; + for( var i = 1; i < length + 1; i++ ) + _version.lines.push( i ); + // Differences var count = 0, modified = 0; @@ -65,6 +71,7 @@ application.factory( 'html' : [ 'html', 'htm' ], 'sass' : [ 'sass', 'scss' ], 'less' : [ 'less' ], + 'stylus' : [ 'stylus', 'styl' ], 'css' : [ 'css' ], 'php' : [ 'php' ], 'json' : [ 'json' ], diff --git a/site/public/stylesheet/style.css b/site/public/stylesheet/style.css index 48cd101..de1114c 100644 --- a/site/public/stylesheet/style.css +++ b/site/public/stylesheet/style.css @@ -1,2 +1,2 @@ -html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0;}table th{text-align:left}*,*::before,*::after,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}input,button,textarea,select{color:inherit;font-size:inherit;font-style:inherit;font-family:inherit;-webkit-border-radius:0;border-radius:0;-webkit-padding-start:0;align-items:flex-start;text-index:0;border:none;outline:none;background:none;padding:0;margin:0;width:auto;height:auto;line-height:1em}input[type=text],input[type=reset],input[type=password],input[type=search],input[type=email],input[type=tel],input[type=url],input[type=time],input[type=week],input[type=month],input[type=date],input[type=datetime],input[type=datetime-local],input[type=number],input[type=submit],input[type=color],input[type=file],button,textarea,select{height:1em;-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=color]{width:1em}input::-ms-clear{display:none}details,summary{-webkit-appearance:none;-moz-appearance:none;appearance:none}mark{background:none}hr{height:1px;margin:0;padding:0}u{text-decoration:none}a{color:inherit;outline:none}@font-face{font-family:'Stellar';src:url("../fonts/Stellar-Regular.eot");src:url("../fonts/Stellar-Regular.eot?#iefix") format('embedded-opentype'),url("../fonts/Stellar-Regular.woff2") format('woff2'),url("../fonts/Stellar-Regular.woff") format('woff'),url("../fonts/Stellar-Regular.ttf") format('truetype');font-weight:normal;font-style:normal}@font-face{font-family:'Ubuntu Mono';src:url("../fonts/UbuntuMono-Regular.eot");src:url("../fonts/UbuntuMono-Regular.eot?#iefix") format('embedded-opentype'),url("../fonts/UbuntuMono-Regular.woff2") format('woff2'),url("../fonts/UbuntuMono-Regular.woff") format('woff'),url("../fonts/UbuntuMono-Regular.ttf") format('truetype');font-weight:normal;font-style:normal}body{font-family:Helvetica,Arial;font-size:12px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}body.projects{background:#323759;color:#fff;}body.projects ::-moz-selection{background:#f1eff9}body.projects ::selection{background:#f1eff9}body.projects .gradient-backgroud{position:absolute;top:0;left:0;width:100%;height:920px;background:linear-gradient(0,#323759,#5e50c3 33%,#c9b2cd)}body.projects p,body.projects ul{font-size:14px;line-height:18px;margin-bottom:1em}body.projects code{font-family:'Ubuntu Mono'}body.projects section.landing{position:relative;margin-bottom:60px;}body.projects section.landing .logo{position:absolute;top:315px;left:50%;}body.projects section.landing .logo .disks .disk{position:absolute;border-radius:50%;background:#fff;transform:translateX(-50%) translateY(-50%);opacity:.2;}body.projects section.landing .logo .disks .disk.index-0{width:100px;height:100px;opacity:.7}body.projects section.landing .logo .disks .disk.index-1{width:200px;height:200px}body.projects section.landing .logo .disks .disk.index-2{width:300px;height:300px}body.projects section.landing .logo .disks .disk.index-3{width:400px;height:400px}body.projects section.landing .logo .disks .disk.index-4{width:500px;height:500px}body.projects section.landing .logo .title{font-size:45px;font-family:'Stellar';}body.projects section.landing .logo .title .letter{position:absolute;top:0;left:0;line-height:8px;}body.projects section.landing .logo .title .letter.index-0{left:90px}body.projects section.landing .logo .title .letter.index-1{left:140px}body.projects section.landing .logo .title .letter.index-2{left:190px}body.projects section.landing .logo .title .letter.index-3{left:240px}body.projects section.landing .logo .title .letter.index-4{left:290px}body.projects section.landing .logo .title .letter.index-5{left:340px}body.projects section.landing .logo .title .letter.index-6{left:390px}body.projects section.landing .punch-line{padding-top:600px;text-align:center;}body.projects section.landing .punch-line .text{text-transform:uppercase;font-size:18px;margin:0 0 8px 0}body.projects section.landing .punch-line .links a.link{display:inline-block;padding:5px 10px;margin:0 5px;background:rgba(255,255,255,0.2);text-decoration:none;transition:background .15s;will-change:transform;}body.projects section.landing .punch-line .links a.link:hover{background:rgba(255,255,255,0.3)}body.projects section.projects{position:relative;width:640px;margin:0 auto 90px auto;}body.projects section.projects .head{height:45px;line-height:45px;background:#333759;text-align:center;font-size:14px}body.projects section.projects .content{width:100%;}body.projects section.projects .content span.no-project{display:block;padding:17px 0;background:#eef0fa;text-align:center;color:#6c6e7c;font-size:16px;font-weight:bold;}body.projects section.projects .content span.no-project .title{opacity:.4}body.projects section.projects .content a.project{display:block;background:#eef0fa;color:#6c6e7c;border-bottom:1px solid #dadada;transition:background .15s;will-change:background;}body.projects section.projects .content a.project .title{display:inline-block;vertical-align:top;width:400px;font-size:16px;font-weight:bold;padding:17px}body.projects section.projects .content a.project .details{display:inline-block;vertical-align:top;width:240px;text-align:right;}body.projects section.projects .content a.project .details .detail{display:inline-block;padding:11px 10px;text-align:right;}body.projects section.projects .content a.project .details .detail .label{font-size:10px;opacity:.5;margin-bottom:2px}body.projects section.projects .content a.project .details .detail .value{font-weight:bold}body.projects section.projects .content a.project:last-child{border-bottom:none}body.projects section.projects .content a.project:hover{background:#f6f7fc}body.projects section.text{position:relative;width:640px;margin:0 auto 90px auto;text-align:center;}body.projects section.text .title{margin-bottom:18px;font-family:'Stellar';font-size:32px}body.projects section.text ul{display:inline-block;text-align:left}body.projects section.text pre{width:400px;margin:0 auto 2em auto;background:#282c47;padding:12px 18px;text-align:left;}body.projects section.text pre span.line:before{display:inline-block;content:'$';padding:0 8px 0 0}body.projects section.text pre .opacity-20{opacity:.2;pointer-events:none}body.project{background:#31344a;color:#fff;}body.project .label{font-size:10px;margin-bottom:2px}body.project header{position:relative;height:80px;overflow:hidden;}body.project header .logo{position:absolute;top:40px;left:-35px;}body.project header .logo .disks .disk{position:absolute;border-radius:50%;background:#fff;transform:translateX(-50%) translateY(-50%);}body.project header .logo .disks .disk.index-0{width:70px;height:70px;background:#fff}body.project header .logo .disks .disk.index-1{width:140px;height:140px;background:#666b99}body.project header .logo .disks .disk.index-2{width:210px;height:210px;background:#555980}body.project header .logo .disks .disk.index-3{width:280px;height:280px;background:#474a6b}body.project header .logo .disks .disk.index-4{width:350px;height:350px;background:#3b3e59}body.project header .logo .title{position:absolute;top:0;left:80px;line-height:4px;font-size:28px;font-family:'Stellar';text-transform:uppercase;letter-spacing:2px;text-decoration:none}body.project aside.aside{position:fixed;top:80px;left:0;bottom:0;width:240px;}body.project aside.aside header.aside-header{position:relative;width:100%;height:115px;padding:12px 20px 0 20px;border-top:1px solid #515771;border-bottom:1px solid #515771;background:rgba(0,0,0,0.2);}body.project aside.aside header.aside-header .name{position:absolute;top:15px;left:20px;font-weight:bold}body.project aside.aside header.aside-header .details{text-align:right;}body.project aside.aside header.aside-header .details .detail{margin-bottom:6px;}body.project aside.aside header.aside-header .details .detail .value{font-weight:bold}body.project aside.aside .aside-tree{position:absolute;top:115px;left:0;width:100%;bottom:110px;overflow-y:scroll;}body.project aside.aside .aside-tree nav.files-tree-nav{position:absolute;top:0;left:0;width:100%;}body.project aside.aside .aside-tree nav.files-tree-nav li{line-height:24px;font-size:12px;cursor:pointer;}body.project aside.aside .aside-tree nav.files-tree-nav li .name{position:relative;display:inline-block;padding-left:20px;padding-right:6px;-webkit-font-smoothing:auto;font-smoothing:auto;}@media only screen and (min-resolution:1.5dppx),only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:144dpi){body.project aside.aside .aside-tree nav.files-tree-nav li .name{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}}body.project aside.aside .aside-tree nav.files-tree-nav li .notif{display:inline-block;height:12px;margin:0 2px 0 3px;padding:0 4px;line-height:12px;border-radius:6px;font-size:8px;-webkit-font-smoothing:auto;font-smoothing:auto;}body.project aside.aside .aside-tree nav.files-tree-nav li .notif.new-file{background:#748bd5}body.project aside.aside .aside-tree nav.files-tree-nav li .notif.new-version{background:#ec399e;line-height:13px}body.project aside.aside .aside-tree nav.files-tree-nav li > span{display:block;padding-left:16px}body.project aside.aside .aside-tree nav.files-tree-nav li li > span{padding-left:32px}body.project aside.aside .aside-tree nav.files-tree-nav li li li > span{padding-left:48px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li > span{padding-left:64px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li > span{padding-left:80px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li > span{padding-left:96px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li > span{padding-left:112px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li li > span{padding-left:128px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li li li > span{padding-left:144px}body.project aside.aside .aside-tree nav.files-tree-nav li.active{background:#4d5b8d}body.project aside.aside .aside-tree nav.files-tree-nav i{position:absolute;top:25%;left:0;display:block;width:12px;height:50%;background:center center no-repeat;}body.project aside.aside .aside-tree nav.files-tree-nav i.folder{background-image:url("../svg/folder.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.folder-active{background-image:url("../svg/folder-active.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.js{background-image:url("../svg/js.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.html{background-image:url("../svg/html.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.sass{background-image:url("../svg/sass.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.less{background-image:url("../svg/less.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.css{background-image:url("../svg/css.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.php{background-image:url("../svg/php.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.json{background-image:url("../svg/json.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.jade{background-image:url("../svg/jade.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.md{background-image:url("../svg/md.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.sql{background-image:url("../svg/sql.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.apache{background-image:url("../svg/apache.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.yml{background-image:url("../svg/yml.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.svg{background-image:url("../svg/svg.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.font{background-image:url("../svg/font.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.image{background-image:url("../svg/image.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.video{background-image:url("../svg/video.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.audio{background-image:url("../svg/audio.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.zip{background-image:url("../svg/zip.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.txt{background-image:url("../svg/txt.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.coffee{background-image:url("../svg/coffee.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.git{background-image:url("../svg/git.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.xml{background-image:url("../svg/xml.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.twig{background-image:url("../svg/twig.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.c{background-image:url("../svg/c.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.random{background-image:url("../svg/random.svg")}body.project aside.aside footer.aside-footer{position:absolute;bottom:0;left:0;width:100%;height:110px;padding:15px 20px 0 20px;border-top:1px solid #515771;background:rgba(0,0,0,0.2);}body.project aside.aside footer.aside-footer .button-container{margin-bottom:5px}body.project aside.aside footer.aside-footer .button.switch{display:inline-block;padding:5px 10px 5px 0;text-decoration:none;}body.project aside.aside footer.aside-footer .button.switch .switch-icon{display:inline-block;position:relative;top:2px;width:22px;height:12px;margin:0 10px 0 0;}body.project aside.aside footer.aside-footer .button.switch .switch-icon .bar{position:absolute;top:2px;left:0;width:100%;height:8px;background:#404a78;border-radius:4px;transition:background .15s;will-change:background}body.project aside.aside footer.aside-footer .button.switch .switch-icon .disk{position:absolute;top:0;left:0;background:#4f547d;width:12px;height:12px;border-radius:6px;box-shadow:0 2px 2px rgba(0,0,0,0.2);transition:transform .15s;will-change:transform}body.project aside.aside footer.aside-footer .button.switch.active .switch-icon .bar{background:#5965a0}body.project aside.aside footer.aside-footer .button.switch.active .switch-icon .disk{transform:translateX(10px)}body.project aside.aside footer.aside-footer .button.default{display:inline-block;padding:5px 10px;background:rgba(128,147,232,0.2);text-decoration:none;transition:background .15s;will-change:background;}body.project aside.aside footer.aside-footer .button.default:hover{background:rgba(128,147,232,0.3)}body.project section.main{position:fixed;top:80px;left:240px;right:0;bottom:0;}body.project section.main section.no-file{position:absolute;top:0;left:0;width:100%;height:100%;border-top:1px solid #515771;border-left:1px solid #515771;}body.project section.main section.no-file .text{position:absolute;top:50%;left:0;width:100%;text-align:center;color:#c6c0d8;text-transform:uppercase;font-size:20px;opacity:.2;font-weight:bold}body.project section.main section.file{top:0;left:0;width:100%;height:100%;}body.project section.main section.file header.file-header{position:absolute;top:0;left:200px;right:0;height:30px;line-height:30px;background:#4d5b8d;text-align:center;}body.project section.main section.file header.file-header .content{display:inline-block;}body.project section.main section.file header.file-header .content .path{display:inline-block;margin-right:3px;opacity:.5}body.project section.main section.file header.file-header .content .name{display:inline-block;font-weight:bold}body.project section.main section.file nav.versions-nav{position:absolute;top:0;left:0;width:200px;bottom:0;background:#4d5b8d;overflow-y:scroll;}body.project section.main section.file nav.versions-nav a.version{display:block;position:relative;width:200px;height:55px;}body.project section.main section.file nav.versions-nav a.version .background{display:block;position:absolute;top:5px;right:5px;bottom:0;left:5px;background:#404a73;transition:background .15s;will-change:background}body.project section.main section.file nav.versions-nav a.version .content{position:absolute;top:10px;right:13px;bottom:10px;left:10px;text-align:right;}body.project section.main section.file nav.versions-nav a.version .content .date{font-weight:bold}body.project section.main section.file nav.versions-nav a.version .content .time-from-now{font-size:10px;opacity:.5}body.project section.main section.file nav.versions-nav a.version .content .differences{position:absolute;top:0;left:0;text-align:left;}body.project section.main section.file nav.versions-nav a.version .content .differences .label{margin-bottom:4px}body.project section.main section.file nav.versions-nav a.version .content .differences .bar{display:block;position:relative;width:75px;height:2px;margin-bottom:3px;background:rgba(189,202,255,0.25);transition:background .15s;will-change:background;}body.project section.main section.file nav.versions-nav a.version .content .differences .bar .fill{position:absolute;top:0;left:0;height:100%;background:#17f861}body.project section.main section.file nav.versions-nav a.version .content .differences .percent{font-size:10px;color:#17f861;white-space:nowrap;text-align:right;-webkit-font-smoothing:auto;font-smoothing:auto;}@media only screen and (min-resolution:1.5dppx),only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:144dpi){body.project section.main section.file nav.versions-nav a.version .content .differences .percent{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}}body.project section.main section.file nav.versions-nav a.version:hover .background{background:#616d9f}body.project section.main section.file nav.versions-nav a.version:hover .content .differences .bar{background:rgba(189,202,255,0.3)}body.project section.main section.file nav.versions-nav a.version.active .background{background:#7481b5}body.project section.main section.file nav.versions-nav a.version.active .content .differences .bar{background:rgba(189,202,255,0.5)}body.project section.main section.file section.code{position:absolute;top:30px;right:0;bottom:0;left:200px;overflow-y:scroll;}body.project section.main section.file section.code pre{position:relative;overflow:hidden;}body.project section.main section.file section.code pre code{line-height:20px;font-family:monospace;}body.project section.main section.file section.code pre code.lines{position:absolute;top:0;left:0;width:38px;padding:.5em;opacity:.2}body.project section.main section.file section.code pre code.hljs{margin-left:38px;background:none}body.project section.main section.file section.code pre code.differences{position:absolute;top:0;left:38px;padding:.5em;pointer-events:none;}body.project section.main section.file section.code pre code.differences .value{visibility:hidden}body.project section.main section.file section.code pre code.differences.inactive{display:none}body.project section.main section.file section.code pre code.differences span.removed{display:none;border:1px solid #f00;}body.project section.main section.file section.code pre code.differences span.removed .value{display:none}body.project section.main section.file section.code pre code.differences span.added{border:1px solid #b0ea23;background:rgba(176,234,35,0.1)} +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0;}table th{text-align:left}*,*::before,*::after,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}input,button,textarea,select{color:inherit;font-size:inherit;font-style:inherit;font-family:inherit;-webkit-border-radius:0;border-radius:0;-webkit-padding-start:0;align-items:flex-start;text-index:0;border:none;outline:none;background:none;padding:0;margin:0;width:auto;height:auto;line-height:1em}input[type=text],input[type=reset],input[type=password],input[type=search],input[type=email],input[type=tel],input[type=url],input[type=time],input[type=week],input[type=month],input[type=date],input[type=datetime],input[type=datetime-local],input[type=number],input[type=submit],input[type=color],input[type=file],button,textarea,select{height:1em;-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=color]{width:1em}input::-ms-clear{display:none}details,summary{-webkit-appearance:none;-moz-appearance:none;appearance:none}mark{background:none}hr{height:1px;margin:0;padding:0}u{text-decoration:none}a{color:inherit;outline:none}@font-face{font-family:'Stellar';src:url("../fonts/Stellar-Regular.eot");src:url("../fonts/Stellar-Regular.eot?#iefix") format('embedded-opentype'),url("../fonts/Stellar-Regular.woff2") format('woff2'),url("../fonts/Stellar-Regular.woff") format('woff'),url("../fonts/Stellar-Regular.ttf") format('truetype');font-weight:normal;font-style:normal}@font-face{font-family:'Ubuntu Mono';src:url("../fonts/UbuntuMono-Regular.eot");src:url("../fonts/UbuntuMono-Regular.eot?#iefix") format('embedded-opentype'),url("../fonts/UbuntuMono-Regular.woff2") format('woff2'),url("../fonts/UbuntuMono-Regular.woff") format('woff'),url("../fonts/UbuntuMono-Regular.ttf") format('truetype');font-weight:normal;font-style:normal}body{font-family:Helvetica,Arial;font-size:12px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}body.projects{background:#323759;color:#fff;}body.projects ::-moz-selection{background:#f1eff9}body.projects ::selection{background:#f1eff9}body.projects .gradient-backgroud{position:absolute;top:0;left:0;width:100%;height:920px;background:linear-gradient(0,#323759,#5e50c3 33%,#c9b2cd)}body.projects p,body.projects ul{font-size:14px;line-height:18px;margin-bottom:1em}body.projects code{font-family:'Ubuntu Mono'}body.projects section.landing{position:relative;margin-bottom:60px;}body.projects section.landing .logo{position:absolute;top:315px;left:50%;}body.projects section.landing .logo .disks .disk{position:absolute;border-radius:50%;background:#fff;transform:translateX(-50%) translateY(-50%);opacity:.2;}body.projects section.landing .logo .disks .disk.index-0{width:100px;height:100px;opacity:.7}body.projects section.landing .logo .disks .disk.index-1{width:200px;height:200px}body.projects section.landing .logo .disks .disk.index-2{width:300px;height:300px}body.projects section.landing .logo .disks .disk.index-3{width:400px;height:400px}body.projects section.landing .logo .disks .disk.index-4{width:500px;height:500px}body.projects section.landing .logo .title{font-size:45px;font-family:'Stellar';}body.projects section.landing .logo .title .letter{position:absolute;top:0;left:0;line-height:8px;}body.projects section.landing .logo .title .letter.index-0{left:90px}body.projects section.landing .logo .title .letter.index-1{left:140px}body.projects section.landing .logo .title .letter.index-2{left:190px}body.projects section.landing .logo .title .letter.index-3{left:240px}body.projects section.landing .logo .title .letter.index-4{left:290px}body.projects section.landing .logo .title .letter.index-5{left:340px}body.projects section.landing .logo .title .letter.index-6{left:390px}body.projects section.landing .punch-line{padding-top:600px;text-align:center;}body.projects section.landing .punch-line .text{text-transform:uppercase;font-size:18px;margin:0 0 8px 0}body.projects section.landing .punch-line .links a.link{display:inline-block;padding:5px 10px;margin:0 5px;background:rgba(255,255,255,0.2);text-decoration:none;transition:background .15s;will-change:transform;}body.projects section.landing .punch-line .links a.link:hover{background:rgba(255,255,255,0.3)}body.projects section.projects{position:relative;width:640px;margin:0 auto 90px auto;}body.projects section.projects .head{height:45px;line-height:45px;background:#333759;text-align:center;font-size:14px}body.projects section.projects .content{width:100%;}body.projects section.projects .content span.no-project{display:block;padding:17px 0;background:#eef0fa;text-align:center;color:#6c6e7c;font-size:16px;font-weight:bold;}body.projects section.projects .content span.no-project .title{opacity:.4}body.projects section.projects .content a.project{display:block;background:#eef0fa;color:#6c6e7c;border-bottom:1px solid #dadada;transition:background .15s;will-change:background;}body.projects section.projects .content a.project .title{display:inline-block;vertical-align:top;width:400px;font-size:16px;font-weight:bold;padding:17px}body.projects section.projects .content a.project .details{display:inline-block;vertical-align:top;width:240px;text-align:right;}body.projects section.projects .content a.project .details .detail{display:inline-block;padding:11px 10px;text-align:right;}body.projects section.projects .content a.project .details .detail .label{font-size:10px;opacity:.5;margin-bottom:2px}body.projects section.projects .content a.project .details .detail .value{font-weight:bold}body.projects section.projects .content a.project:last-child{border-bottom:none}body.projects section.projects .content a.project:hover{background:#f6f7fc}body.projects section.text{position:relative;width:640px;margin:0 auto 90px auto;text-align:center;}body.projects section.text .title{margin-bottom:18px;font-family:'Stellar';font-size:32px}body.projects section.text ul{display:inline-block;text-align:left}body.projects section.text pre{width:400px;margin:0 auto 2em auto;background:#282c47;padding:12px 18px;text-align:left;}body.projects section.text pre span.line:before{display:inline-block;content:'$';padding:0 8px 0 0}body.projects section.text pre .opacity-20{opacity:.2;pointer-events:none}body.project{background:#31344a;color:#fff;}body.project .label{font-size:10px;margin-bottom:2px}body.project header{position:relative;height:80px;overflow:hidden;}body.project header .logo{position:absolute;top:40px;left:-35px;}body.project header .logo .disks .disk{position:absolute;border-radius:50%;background:#fff;transform:translateX(-50%) translateY(-50%);}body.project header .logo .disks .disk.index-0{width:70px;height:70px;background:#fff}body.project header .logo .disks .disk.index-1{width:140px;height:140px;background:#666b99}body.project header .logo .disks .disk.index-2{width:210px;height:210px;background:#555980}body.project header .logo .disks .disk.index-3{width:280px;height:280px;background:#474a6b}body.project header .logo .disks .disk.index-4{width:350px;height:350px;background:#3b3e59}body.project header .logo .title{position:absolute;top:0;left:80px;line-height:4px;font-size:28px;font-family:'Stellar';text-transform:uppercase;letter-spacing:2px;text-decoration:none}body.project aside.aside{position:fixed;top:80px;left:0;bottom:0;width:240px;}body.project aside.aside header.aside-header{position:relative;width:100%;height:115px;padding:12px 20px 0 20px;border-top:1px solid #515771;border-bottom:1px solid #515771;background:#2c2f42;}body.project aside.aside header.aside-header .name{position:absolute;top:15px;left:20px;font-weight:bold}body.project aside.aside header.aside-header .details{text-align:right;}body.project aside.aside header.aside-header .details .detail{margin-bottom:6px;}body.project aside.aside header.aside-header .details .detail .value{font-weight:bold}body.project aside.aside .aside-tree{position:absolute;top:115px;left:0;bottom:95px;width:calc(100% + 15px);overflow-y:scroll;overflow-x:scroll;}body.project aside.aside .aside-tree nav.files-tree-nav{position:absolute;top:0;left:0;width:100%;}body.project aside.aside .aside-tree nav.files-tree-nav li{line-height:24px;font-size:12px;cursor:pointer;white-space:nowrap;}body.project aside.aside .aside-tree nav.files-tree-nav li .name{position:relative;display:inline-block;padding-left:20px;padding-right:6px;-webkit-font-smoothing:auto;font-smoothing:auto;}@media only screen and (min-resolution:1.5dppx),only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:144dpi){body.project aside.aside .aside-tree nav.files-tree-nav li .name{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}}body.project aside.aside .aside-tree nav.files-tree-nav li .notif{display:inline-block;height:12px;margin:0 2px 0 3px;padding:0 4px;line-height:12px;border-radius:6px;font-size:8px;-webkit-font-smoothing:auto;font-smoothing:auto;}body.project aside.aside .aside-tree nav.files-tree-nav li .notif.new-file{background:#748bd5}body.project aside.aside .aside-tree nav.files-tree-nav li .notif.new-version{background:#ec399e;line-height:13px}body.project aside.aside .aside-tree nav.files-tree-nav li > span{display:inline-block;padding-right:20px;padding-left:15px}body.project aside.aside .aside-tree nav.files-tree-nav li li > span{padding-left:30px}body.project aside.aside .aside-tree nav.files-tree-nav li li li > span{padding-left:45px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li > span{padding-left:60px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li > span{padding-left:75px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li > span{padding-left:90px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li > span{padding-left:105px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li li > span{padding-left:120px}body.project aside.aside .aside-tree nav.files-tree-nav li li li li li li li li li > span{padding-left:135px}body.project aside.aside .aside-tree nav.files-tree-nav li.active{background:#4d5b8d}body.project aside.aside .aside-tree nav.files-tree-nav i{position:absolute;top:25%;left:0;display:block;width:12px;height:50%;background:center center no-repeat;}body.project aside.aside .aside-tree nav.files-tree-nav i.folder{background-image:url("../svg/folder.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.folder-active{background-image:url("../svg/folder-active.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.js{background-image:url("../svg/js.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.html{background-image:url("../svg/html.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.sass{background-image:url("../svg/sass.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.less{background-image:url("../svg/less.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.stylus{background-image:url("../svg/stylus.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.css{background-image:url("../svg/css.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.php{background-image:url("../svg/php.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.json{background-image:url("../svg/json.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.jade{background-image:url("../svg/jade.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.md{background-image:url("../svg/md.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.sql{background-image:url("../svg/sql.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.apache{background-image:url("../svg/apache.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.yml{background-image:url("../svg/yml.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.svg{background-image:url("../svg/svg.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.font{background-image:url("../svg/font.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.image{background-image:url("../svg/image.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.video{background-image:url("../svg/video.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.audio{background-image:url("../svg/audio.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.zip{background-image:url("../svg/zip.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.txt{background-image:url("../svg/txt.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.coffee{background-image:url("../svg/coffee.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.git{background-image:url("../svg/git.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.xml{background-image:url("../svg/xml.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.twig{background-image:url("../svg/twig.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.c{background-image:url("../svg/c.svg")}body.project aside.aside .aside-tree nav.files-tree-nav i.random{background-image:url("../svg/random.svg")}body.project aside.aside footer.aside-footer{position:absolute;bottom:0;left:0;width:100%;height:110px;padding:10px 20px 0 20px;border-top:1px solid #515771;background:#2c2f42;}body.project aside.aside footer.aside-footer .button-container.switch,body.project aside.aside footer.aside-footer .button.switch{display:inline-block;padding:5px 10px 5px 0;text-decoration:none;}body.project aside.aside footer.aside-footer .button-container.switch .switch-icon,body.project aside.aside footer.aside-footer .button.switch .switch-icon{display:inline-block;position:relative;top:2px;width:22px;height:12px;margin:0 10px 0 0;}body.project aside.aside footer.aside-footer .button-container.switch .switch-icon .bar,body.project aside.aside footer.aside-footer .button.switch .switch-icon .bar{position:absolute;top:2px;left:0;width:100%;height:8px;background:#404a78;border-radius:4px;transition:background .15s;will-change:background}body.project aside.aside footer.aside-footer .button-container.switch .switch-icon .disk,body.project aside.aside footer.aside-footer .button.switch .switch-icon .disk{position:absolute;top:0;left:0;background:#4f547d;width:12px;height:12px;border-radius:6px;box-shadow:0 2px 2px rgba(0,0,0,0.2);transition:transform .15s;will-change:transform}body.project aside.aside footer.aside-footer .button-container.switch.active .switch-icon .bar,body.project aside.aside footer.aside-footer .button.switch.active .switch-icon .bar{background:#5965a0}body.project aside.aside footer.aside-footer .button-container.switch.active .switch-icon .disk,body.project aside.aside footer.aside-footer .button.switch.active .switch-icon .disk{transform:translateX(10px)}body.project aside.aside footer.aside-footer .button-container.default,body.project aside.aside footer.aside-footer .button.default{display:inline-block;margin:10px 0;padding:5px 10px;background:rgba(128,147,232,0.2);text-decoration:none;transition:background .15s;will-change:background;}body.project aside.aside footer.aside-footer .button-container.default:hover,body.project aside.aside footer.aside-footer .button.default:hover{background:rgba(128,147,232,0.3)}body.project section.main{position:fixed;top:80px;left:240px;right:0;bottom:0;background:#31344a;}body.project section.main section.no-file{position:absolute;top:0;left:0;width:100%;height:100%;border-top:1px solid #515771;border-left:1px solid #515771;}body.project section.main section.no-file .text{position:absolute;top:50%;left:0;width:100%;text-align:center;color:#c6c0d8;text-transform:uppercase;font-size:20px;opacity:.2;font-weight:bold}body.project section.main section.file{top:0;left:0;width:100%;height:100%;}body.project section.main section.file header.file-header{position:absolute;top:0;left:200px;right:0;height:30px;line-height:30px;background:#4d5b8d;text-align:center;}body.project section.main section.file header.file-header .content{display:inline-block;}body.project section.main section.file header.file-header .content .path{display:inline-block;margin-right:3px;opacity:.5}body.project section.main section.file header.file-header .content .name{display:inline-block;font-weight:bold}body.project section.main section.file nav.versions-nav{position:absolute;top:0;left:0;bottom:0;width:215px;padding-bottom:5px;background:#4d5b8d;overflow-y:scroll;overflow-x:hidden;}body.project section.main section.file nav.versions-nav a.version{display:block;position:relative;width:200px;height:55px;}body.project section.main section.file nav.versions-nav a.version .background{display:block;position:absolute;top:5px;right:5px;bottom:0;left:5px;background:#404a73;transition:background .15s;will-change:background}body.project section.main section.file nav.versions-nav a.version .content{position:absolute;top:10px;right:13px;bottom:10px;left:10px;text-align:right;}body.project section.main section.file nav.versions-nav a.version .content .date{font-weight:bold}body.project section.main section.file nav.versions-nav a.version .content .time-from-now{font-size:10px;opacity:.5}body.project section.main section.file nav.versions-nav a.version .content .differences{position:absolute;top:0;left:0;text-align:left;}body.project section.main section.file nav.versions-nav a.version .content .differences .label{margin-bottom:4px}body.project section.main section.file nav.versions-nav a.version .content .differences .bar{display:block;position:relative;width:75px;height:2px;margin-bottom:3px;background:rgba(189,202,255,0.25);transition:background .15s;will-change:background;}body.project section.main section.file nav.versions-nav a.version .content .differences .bar .fill{position:absolute;top:0;left:0;height:100%;background:#17f861}body.project section.main section.file nav.versions-nav a.version .content .differences .percent{font-size:10px;color:#17f861;white-space:nowrap;text-align:right;-webkit-font-smoothing:auto;font-smoothing:auto;}@media only screen and (min-resolution:1.5dppx),only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-resolution:144dpi){body.project section.main section.file nav.versions-nav a.version .content .differences .percent{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:antialiased}}body.project section.main section.file nav.versions-nav a.version:hover .background{background:#616d9f}body.project section.main section.file nav.versions-nav a.version:hover .content .differences .bar{background:rgba(189,202,255,0.3)}body.project section.main section.file nav.versions-nav a.version.active .background{background:#7481b5}body.project section.main section.file nav.versions-nav a.version.active .content .differences .bar{background:rgba(189,202,255,0.5)}body.project section.main section.file section.code{position:absolute;top:30px;right:-15px;bottom:-15px;left:200px;background:#31344a;overflow-y:scroll;overflow-x:scroll;}body.project section.main section.file section.code pre{position:relative;}body.project section.main section.file section.code pre code{line-height:20px;font-family:monospace}body.project section.main section.file section.code .lines{position:absolute;top:0;left:0;width:38px;padding:.5em;opacity:.2}body.project section.main section.file section.code .current pre code{display:inline-block;margin-right:15px;margin-bottom:15px;margin-left:38px;background:none}body.project section.main section.file section.code .differences{position:absolute;top:0;left:38px;padding:.5em;pointer-events:none;}body.project section.main section.file section.code .differences pre code .value{visibility:hidden}body.project section.main section.file section.code .differences pre code.inactive{display:none}body.project section.main section.file section.code .differences pre code span.removed{display:none;border:1px solid #f00;}body.project section.main section.file section.code .differences pre code span.removed .value{display:none}body.project section.main section.file section.code .differences pre code span.added{border:1px solid #b0ea23;background:rgba(176,234,35,0.1)} /*# sourceMappingURL=style.css.map */ diff --git a/site/public/stylus/pages/project.styl b/site/public/stylus/pages/project.styl index f9ee46c..e6d7a49 100644 --- a/site/public/stylus/pages/project.styl +++ b/site/public/stylus/pages/project.styl @@ -68,7 +68,7 @@ body.project padding 12px 20px 0 20px border-top 1px solid #515771 border-bottom 1px solid #515771 - background rgba(0,0,0,0.2) + background #2c2f42 .name position absolute @@ -90,9 +90,10 @@ body.project position absolute top 115px left 0 - width 100% - bottom 110px + bottom 95px + width calc(100% + 15px) overflow-y scroll + overflow-x scroll nav.files-tree-nav position absolute @@ -104,6 +105,7 @@ body.project line-height 24px font-size 12px cursor pointer + white-space nowrap .name position relative @@ -132,24 +134,25 @@ body.project line-height 13px > span - display block - padding-left 16px * 1 + display inline-block + padding-right 20px + padding-left 15px * 1 li > span - padding-left 16px * 2 + padding-left 15px * 2 li li > span - padding-left 16px * 3 + padding-left 15px * 3 li li li > span - padding-left 16px * 4 + padding-left 15px * 4 li li li li > span - padding-left 16px * 5 + padding-left 15px * 5 li li li li li > span - padding-left 16px * 6 + padding-left 15px * 6 li li li li li li > span - padding-left 16px * 7 + padding-left 15px * 7 li li li li li li li > span - padding-left 16px * 8 + padding-left 15px * 8 li li li li li li li li > span - padding-left 16px * 9 + padding-left 15px * 9 &.active background #4d5b8d @@ -175,6 +178,8 @@ body.project background-image url('../svg/sass.svg') &.less background-image url('../svg/less.svg') + &.stylus + background-image url('../svg/stylus.svg') &.css background-image url('../svg/css.svg') &.php @@ -224,12 +229,12 @@ body.project left 0 width 100% height 110px - padding 15px 20px 0 20px + padding 10px 20px 0 20px border-top 1px solid #515771 - background rgba(0,0,0,0.2) + background #2c2f42 .button-container - margin-bottom 5px + .button &.switch display inline-block @@ -277,6 +282,7 @@ body.project &.default display inline-block + margin 10px 0 padding 5px 10px background rgba(128,147,232,0.2) text-decoration none @@ -292,6 +298,7 @@ body.project left 240px right 0 bottom 0 + background #31344a section.no-file position absolute @@ -346,10 +353,12 @@ body.project position absolute top 0 left 0 - width 200px bottom 0 + width 215px + padding-bottom 5px background #4d5b8d overflow-y scroll + overflow-x hidden a.version display block @@ -436,37 +445,46 @@ body.project section.code position absolute top 30px - right 0 - bottom 0 + right -15px + bottom -15px left 200px + background #31344a overflow-y scroll + overflow-x scroll pre position relative - overflow hidden code line-height 20px font-family monospace - &.lines - position absolute - top 0 - left 0 - width 38px - padding 0.5em - opacity 0.2 + .lines + position absolute + top 0 + left 0 + width 38px + padding 0.5em + opacity 0.2 - &.hljs + .current + pre + code + display inline-block + margin-right 15px + margin-bottom 15px margin-left 38px background none - &.differences - position absolute - top 0 - left 38px - padding 0.5em - pointer-events none + .differences + position absolute + top 0 + left 38px + padding 0.5em + pointer-events none + + pre + code .value visibility hidden diff --git a/site/public/svg/stylus.svg b/site/public/svg/stylus.svg new file mode 100644 index 0000000..0d69e13 --- /dev/null +++ b/site/public/svg/stylus.svg @@ -0,0 +1,21 @@ + + + + + + + + diff --git a/site/views/pages/index/project.jade b/site/views/pages/index/project.jade index 6c22a28..cbf3d67 100644 --- a/site/views/pages/index/project.jade +++ b/site/views/pages/index/project.jade @@ -80,12 +80,6 @@ div(ng-controller="ProjectController as controller",ng-init="init('" + project_s .text | Choose a file section.file(ng-if="file") - header.file-header - .content - span.path - | {{file.path.directory}}/ - span.name - | {{file.name}} nav.versions-nav a.version(href="#",ng-repeat="_version in file.versions",ng-click="version_click(_version)",ng-class="_version.active ? 'active' : 'inactive'") .background @@ -103,18 +97,25 @@ div(ng-controller="ProjectController as controller",ng-init="init('" + project_s .fill(style="width:{{_version.diff_percent}};") .percent(style="width:{{_version.diff_percent}};") | {{_version.diff_percent}} + header.file-header + .content + span.path + | {{file.path.directory}}/ + span.name + | {{file.name}} section.code - pre - code.lines - - var line_index = 1 - while line_index < 999 - .line= line_index++ - code(hljs,hljs-source="version.content") - | {{ version.content }} - code.differences(ng-if="version.diff",ng-class="show_differences ? 'active' : 'inactive'") - span(ng-repeat="_difference in version.diff",ng-class="{removed: _difference.removed, added: _difference.added}") - span.value - | {{ _difference.value }} + .lines + pre + code + .line(ng-repeat="_line in version.lines") + | {{ _line }} + .current(hljs,hljs-source="version.content") + .differences + pre + code(ng-if="version.diff",ng-class="show_differences ? 'active' : 'inactive'") + span(ng-repeat="_difference in version.diff",ng-class="{removed: _difference.removed, added: _difference.added}") + span.value + | {{ _difference.value }} include ../../partials/footer.jade