github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Add collapse state indicator.

Browse source
This commit is contained in:
Paulo Reis 2017-07-04 14:05:03 +01:00
parent 20356a3d51
commit f9ed50bcb4
2 changed files with 18 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
services/web/app/views/project/editor/review-panel.pug
View file

@ -49,6 +49,10 @@
span.review-panel-toolbar-label(ng-if="permissions.write") span.review-panel-toolbar-label(ng-if="permissions.write")
span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")} span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")}
span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")} span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")}
span.rp-tc-state-collapse(
ng-class="{ 'rp-tc-state-collapse-on': reviewPanel.fullTCStateCollapsed }"
)
i.fa.fa-angle-down
ul.rp-tc-state( ul.rp-tc-state(
review-panel-collapse-height="reviewPanel.fullTCStateCollapsed" review-panel-collapse-height="reviewPanel.fullTCStateCollapsed"
) )

22
services/web/public/stylesheets/app/editor/review-panel.less
View file

@ -57,6 +57,15 @@
} }
} }
.rp-collapse-arrow() {
display: inline-block;
transform: rotateZ(0deg);
transition: transform 0.15s ease;
&-on {
transform: rotateZ(-90deg);
}
}
.triangle(@_, @width, @height, @color) { .triangle(@_, @width, @height, @color) {
position: absolute; position: absolute;
border-color: transparent; border-color: transparent;
@ -163,6 +172,10 @@
background-color: @rp-bg-dim-blue; background-color: @rp-bg-dim-blue;
text-align: left; text-align: left;
} }
.rp-tc-state-collapse {
.rp-collapse-arrow;
margin-left: 5px;
}
.rp-tc-state-item { .rp-tc-state-item {
display: flex; display: flex;
align-items: center; align-items: center;
@ -663,16 +676,9 @@
font-size: 0.9em; font-size: 0.9em;
} }
.rp-overview-file-header-collapse { .rp-overview-file-header-collapse {
display: inline-block; .rp-collapse-arrow;
float: left; float: left;
transform: rotateZ(0deg);
transition: transform 0.15s ease
} }
.rp-overview-file-header-collapse-on {
transform: rotateZ(-90deg);
}
.rp-overview-file-entries { .rp-overview-file-entries {
overflow: hidden; overflow: hidden;
} }