[update] Improve scrolls + Add stylus file support
This commit is contained in:
brunosimon
+4
-1
@@ -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' )
|
||||
|
||||
@@ -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' ],
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -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
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="38.8 33.4 138.5 141.4" enable-background="new 38.8 33.4 138.5 141.4" xml:space="preserve">
|
||||
<g>
|
||||
<path fill="#B3D107" d="M170.8,33.4c1.6,0,3,0.4,4,1.2c1,0.8,1.7,1.9,2.1,3.3c0.4,1.4,0.4,2.9,0.2,4.7c-0.3,1.8-0.9,3.5-1.9,5.2
|
||||
c-0.2,0.2-0.5,0.2-0.8,0c-0.3-0.2-0.5-0.5-0.7-0.8c0.2-1.3-0.2-2.4-1.4-3.3c-1.1-0.9-2.9-1.3-5.3-1.3c-4.5,0-9,1.7-13.5,5
|
||||
c-4.5,3.3-8.9,7.7-13.2,13.2c-4.3,5.5-8.3,11.8-12,18.9c-3.7,7.1-6.9,14.4-9.7,22c-2.7,7.5-4.9,15-6.5,22.5
|
||||
c-1.6,7.4-2.4,14.2-2.4,20.3c0,3.3,0.9,4.9,2.8,4.9c1.3,0,2.6-0.5,3.9-1.6c1.3-1.1,2.7-2.7,4.3-4.9c0.3-0.2,0.6-0.2,0.9,0.1
|
||||
c0.3,0.3,0.4,0.6,0.2,1.1c-2.2,3.3-4.8,6-7.7,8.2c-2.9,2.2-5.6,3.3-8,3.3c-2.1,0-3.5-0.6-4.3-1.8c-0.8-1.2-1.2-2.7-1.2-4.6
|
||||
c0-5.1,1.1-11.6,3.3-19.3c2.2-7.7,5.1-15.8,8.8-24.4c3.7-8.6,7.9-17.1,12.7-25.7c4.8-8.5,9.8-16.2,15-23
|
||||
c5.2-6.8,10.4-12.4,15.7-16.6C161.3,35.6,166.2,33.4,170.8,33.4z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path fill="#B3D107" d="M45.3,174.9c-1.6,0-3-0.4-4-1.2c-1-0.8-1.7-1.9-2.1-3.3c-0.4-1.4-0.4-2.9-0.2-4.7c0.3-1.8,0.9-3.5,1.9-5.2
|
||||
c0.2-0.2,0.5-0.2,0.8,0c0.3,0.2,0.5,0.5,0.7,0.8c-0.2,1.3,0.2,2.4,1.4,3.3c1.1,0.9,2.9,1.3,5.3,1.3c4.5,0,9-1.7,13.5-5
|
||||
c4.5-3.3,8.9-7.7,13.2-13.2c4.3-5.5,8.3-11.7,12-18.9c3.7-7.1,6.9-14.4,9.7-22c2.7-7.5,4.9-15,6.5-22.5c1.6-7.4,2.4-14.2,2.4-20.3
|
||||
c0-3.3-0.9-4.9-2.8-4.9c-1.3,0-2.6,0.5-3.9,1.6c-1.3,1.1-2.7,2.7-4.3,4.9c-0.3,0.2-0.6,0.2-0.9-0.1c-0.3-0.3-0.4-0.6-0.2-1.1
|
||||
c2.2-3.3,4.8-6,7.7-8.2c2.9-2.2,5.6-3.3,8-3.3c2.1,0,3.5,0.6,4.3,1.8s1.2,2.7,1.2,4.6c0,5.1-1.1,11.6-3.3,19.3
|
||||
c-2.2,7.7-5.1,15.8-8.8,24.4c-3.7,8.6-7.9,17.1-12.7,25.7c-4.8,8.5-9.8,16.2-15,23c-5.2,6.8-10.4,12.4-15.7,16.6
|
||||
C54.8,172.7,49.9,174.9,45.3,174.9z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user