This repository has been archived by the owner on Jun 5, 2019. It is now read-only.
/
_work_package_table.sass
243 lines (209 loc) · 6.4 KB
/
_work_package_table.sass
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
//-- copyright
// OpenProject is a project management system.
// Copyright (C) 2012-2017 the OpenProject Foundation (OPF)
//
// This program is free software; you can redistribute it and/or
// modify it under the terms of the GNU General Public License version 3.
//
// OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows:
// Copyright (C) 2006-2017 Jean-Philippe Lang
// Copyright (C) 2010-2013 the ChiliProject Team
//
// This program is free software; you can redistribute it and/or
// modify it under the terms of the GNU General Public License
// as published by the Free Software Foundation; either version 2
// of the License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program; if not, write to the Free Software
// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
//
// See doc/COPYRIGHT.rdoc for more details.
//++
.controller-work_packages.action-index,
.controller-work_packages.action-show,
.controller-work_packages.full-create
@extend %absolute-layout-mode
#content
padding: 0
.in_modal &
#main
top: 12px
// Ensure correct height applied to child elements.
// The dom looks like this:
// flash (generated from rails - if it was generated when rendering the page)
// div[ui-view] (main content we want to adjust the height for)
// div style="clear:both;" (is pushed to overflow - of no relevance)
//
// This makes use of more specific rules overwriting less specific ones.
// Per default, the height is always 100%
.work-packages-page--ui-view
height: 100%
.work-packages-list-view--container
// Set minor padding on left side
padding-left: 15px
// Flexbox for the toolbar, filters and work package split view
display: flex
flex-direction: column
height: 100%
> .toolbar-container
margin-top: 0.5rem
// not flex-item
padding-right: 15px
.work-packages--filters-optional-container
// not flex-item
height: auto
flex-shrink: 0
// Filters are hidden when not expanded
// When expanded, add some padding to the table
padding-bottom: 20px
// Outer Flex container for (table+timeline)|details
.work-packages-split-view
flex: 1 1 auto
display: flex
// Required for correctly scrolling the inner containers
overflow: hidden
// Left part of the split view
// == flex container for (table|timeline)
.work-packages-split-view--tabletimeline-side
flex: 2
display: flex
flex-direction: column
// Required for any absolute positioned elements within the viewport
// (e.g., timeline controls)
position: relative
// Required for correctly scrolling the inner containers
overflow: hidden
// Content of the left side
// == flex container for (table+timeline)
.work-packages-split-view--tabletimeline-content
flex: 1
display: flex
overflow: hidden
// Footer of the left side
.work-packages-split-view--tabletimeline-footer
flex: 0 0 $footer-height
// Only add padding to lower/right corner
// to override default margins
.pagination
margin: 0
padding: 15px 10px 5px 0
.pagination--pages,
.pagination--options
margin: 0
// TABLE half of the tabletimeline flexbox
.work-packages-tabletimeline--table-side
// Same flex as timeline
flex: 1 1
// Show scrollbars for inner content
overflow: auto
// relative for loading indicator
position: relative
// Hint browser that this will inner-scroll
will-change: transform
// Hinter browser that the content of the flex is contained
contain: strict
&.-timeline-visible
// Show the horizontal scrollbar _always_ (same as timeline)
overflow-x: scroll
// Hide the vertical scrollbar
overflow-y: hidden
// TIMELINE half of the tabletimeline flexbox
.work-packages-tabletimeline--timeline-side
@include varprop(border-left, timeline--separator)
flex: 1 1
// Show the horizontal scrollbar _always_ (same as table)
overflow-x: scroll
// Show the vertical scrollbar when necessary
overflow-y: auto
// Hidden by default
display: none
// Hint browser that this will inner-scroll
will-change: transform
// Hinter browser that the content of the flex is contained
contain: strict
.edit-all-mode .work-packages--left-panel
padding-bottom: 50px
.work-package--attachments--files
margin-bottom: 1rem
> h4
margin-top: 5px
.inplace-edit--read-value
padding: 0.375rem 0.6rem
i
display: inline-block
&:before
vertical-align: middle
padding-top: 0
.work-package--attachments--filename
display: inline-block
line-height: 1.4
// FF & IE
word-break: break-all
// Chrome & Safari
word-break: break-word
width: 90%
vertical-align: middle
.work-package--attachments--drop-box
border: 2px dashed $light-gray
border-radius: 2px
text-align: center
padding: 20px
cursor: pointer
.work-package--attachments--label
color: $light-gray
text-align: center
i, p
display: inline-block
vertical-align: middle
.icon-attachment:before
color: $light-gray
font-size: 3rem
p
color: $gray-dark
font-size: 0.9rem
font-weight: bold
line-height: 1.4
margin: 0 0 0 10px
text-align: left
.work-package--attachments--hint
font-size: 85%
.controller-work_packages
#work-packages-query-selection
.select2-container
margin-left: 5px
.icon-button, .sort-header, .action-icon
cursor: pointer
select, input
&.to-validate.ng-dirty.ng-valid
border: 1px solid Green
&.to-validate.ng-dirty.ng-valid ~ span.ok
color: green
display: inline
&.to-validate.ng-dirty.ng-invalid
border: 1px solid Red
&.to-validate.ng-dirty.ng-invalid ~ span.ok
color: red
display: inline
.work_package
tr
line-height: $user-avatar-mini-width
.avatar-mini
float: left
#attributes
.form--field-container
max-width: 400px
// Workaround to make the toolbar menu accessible even on very small screens
@media screen and (max-height: 25em)
.controller-work_packages.action-show,
.controller-work_packages.action-details,
.controller-work_packages.action-index
#main
overflow: overlay
#content
overflow-y: auto