github-mirrors/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2025-04-22 04:57:07 -04:00
Code Issues Projects Releases Packages Wiki Activity

Card Details, maximize and minimize of card works now

Browse source
This commit is contained in:
Martin Filser 2021-06-14 10:47:05 +02:00
parent 7238a65a6f
commit 92122e1fdd
2 changed files with 48 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/components/cards/cardDetails.jade
View file

@ -1,5 +1,5 @@
template(name="cardDetails")
section.card-details.js-card-details: .card-details-canvas
section.card-details.js-card-details(class='{{#if cardMaximized}}card-details-maximized{{/if}}'): .card-details-canvas
.card-details-header(class='{{#if colorClass}}card-details-{{colorClass}}{{/if}}')
+inlinedForm(classNames="js-card-details-title")
+editCardTitleForm

98
client/components/cards/cardDetails.styl
View file

@ -86,62 +86,58 @@ avatar-radius = 50%
// Other card details
unless isMiniScreen
if cardMaximized
.card-details
padding: 0
flex-shrink: 0
flex-basis: calc(100% - 20px)
will-change: flex-basis
overflow-y: scroll
overflow-x: scroll
background: darken(white, 3%)
border-radius: bottom 3px
z-index: 1000 !important
animation: flexGrowIn 0.1s
box-shadow: 0 0 7px 0 darken(white, 30%)
transition: flex-basis 0.1s
box-sizing: border-box
position: absolute
top: 0
left: 0
height: calc(100% - 20px)
width: calc(100% - 20px)
float: left
.card-details-maximized
padding: 0
flex-shrink: 0
flex-basis: calc(100% - 20px)
will-change: flex-basis
overflow-y: scroll
overflow-x: scroll
background: darken(white, 3%)
border-radius: bottom 3px
z-index: 1000 !important
animation: flexGrowIn 0.1s
box-shadow: 0 0 7px 0 darken(white, 30%)
transition: flex-basis 0.1s
box-sizing: border-box
position: absolute
top: 0
left: 0
height: calc(100% - 20px)
width: calc(100% - 20px)
float: left
.card-details-left
position: absolute
float: left
top: 60px
left: 20px
width: 47%
.card-details-left
position: absolute
float: left
top: 60px
left: 20px
width: 47%
.card-details-right
position: absolute
float: right
top: 20px
left: 50%
.card-details-right
position: absolute
float: right
top: 20px
left: 50%
.card-details-header
width: 47%
if isMiniScreen
.card-details
padding: 0
flex-shrink: 0
flex-basis: 600px
will-change: flex-basis
overflow-y: scroll
overflow-x: hidden
background: darken(white, 3%)
border-radius: bottom 3px
z-index: 20 !important
animation: flexGrowIn 0.1s
box-shadow: 0 0 7px 0 darken(white, 30%)
transition: flex-basis 0.1s
box-sizing: border-box
.card-details-header
width: 47%
.card-details
padding: 0
flex-shrink: 0
flex-basis: 600px
will-change: flex-basis
overflow-y: scroll
overflow-x: hidden
background: darken(white, 3%)
border-radius: bottom 3px
z-index: 20 !important
animation: flexGrowIn 0.1s
box-shadow: 0 0 7px 0 darken(white, 30%)
transition: flex-basis 0.1s
box-sizing: border-box
.mCustomScrollBox
padding-left: 0