Commit ef65adbd authored by christianrhansen's avatar christianrhansen

css clean-up

parent b50ab8d6
Pipeline #51078 passed with stage
in 5 minutes and 14 seconds
......@@ -168,7 +168,7 @@
// ---------------------------------------------------------------------------------------------------------------
template(v-else)
.cell-item(:style="getCellStyle({x:0,y:0,width:1,height:1})", key="cell-grid-resizer")
div.cell-handler-desktop.resize.cell-item-resize-handle(
div.cell-handler.resize(
draggable="true",
@dragstart="event => {handleGridResizerDragStart(event)}",
@dragend="event => {handleGridResizerDragEnd(event)}",
......@@ -1236,31 +1236,21 @@
<style scoped lang="stylus">
@import '~variables'
border-radius-cell = .25rem
// border-radius-handler = border-radius-cell / 1.75
border-radius-handler = 100vw
handler-height-desktop = 30px
.opacity-25
opacity .25
.q-popover
border 0
.clear-button
border-radius border-radius-cell
width 42px
border 1px solid rgba(255, 255, 255, .3)
//--------------------------------------------------------------------------------------------------------------- grid
.cell-grid
display grid
//--------------------------------------------------------------------------------------------------------------- cell
.cell-item
&
border-radius border-radius-cell
// background-color rgba(200, 200, 200, .75)
background-color rgba(200, 200, 200, .15)
// border 1px solid rgba(0, 0, 0, .2)
border 1px solid rgba(255, 255, 255, .2)
margin 4px
box-sizing border-box
......@@ -1273,39 +1263,18 @@
transition background ease 150ms, margin ease 150ms
&.editing
/*
background rgba(255, 150, 150, .8)
border 1px solid rgba(255,110,110,1) */
// background rgba(185, 80, 80, .5)
background rgba(255, 255, 255, .8)
// border 1px solid rgba(225,80,80,.8)
border 1px solid rgba(225, 255, 255, 1)
&:hover
&.hover
/*
background rgba(185, 80, 80, .5)
border 1px solid rgba(225,80,80,.8)
*/
background rgba(255, 255, 255, .5)
.edit-button
display: block
&.edit
display block
&.selected
background-color lightpink
.edit-button
display: none
.cell-item-inner
width 100%
height 100%
.cell-handler-desktop
//----------------------------------------------------------------------------------------------------- cell handler
.cell-handler
color $dark
background-color rgba(255, 255, 255, 1)
border-radius border-radius-handler
......@@ -1317,30 +1286,17 @@
&.resize
opacity 0
.cell-item-resize-handle
// color rgba(0, 0, 0, .2)
// background-color rgba(255, 255, 255, 1)
// color $dark
// border-radius border-radius-handler
&:hover
&.hover
// background rgba(0, 0, 0, .35)
background rgba(20, 20, 20, .8)
// border 1px solid rgba(0, 0, 0, .2)
// border 1px solid black
margin 2px
/* .edit-button
display block */
.cell-handler-desktop.move
.cell-handler-desktop.edit
.cell-handler-desktop.resize
.cell-handler.move
.cell-handler.edit
.cell-handler.resize
opacity 1
//--------------------------------------------------------------------------------------------------------------------
//------------------------------------------------------------------------------------------------------- grid handler
.grid-handler
cursor pointer
opacity 0
......@@ -1350,13 +1306,9 @@
z-index 999
&.add-row
// border-radius 100vw
// border 1px solid $positive
background-color rgba(33, 186, 69, .15)
grid-column-start 1
transform translateY(-50%)
// &:nth-of-type(1)
// &:first-of-type
&.first
height calc(100% / 2)
transform translateY(0px)!important
......@@ -1378,13 +1330,12 @@
&.remove-row
background-color rgba(219, 40, 41, .2)
grid-column-start 1
// border 1px solid $negative
&.remove-column
background-color rgba(219, 40, 41, .2)
grid-row-start 1
// border 1px solid $negative
//--------------------------------------------------------------------------------------------------------------------
//------------------------------------------------------------------------------------------------------------ headers
#new-cell-header
#cached-cell-header
#edit-cell-header
......@@ -1397,11 +1348,12 @@
&.width-75
width 75%
//---------------------------------------------------------------------------------------------------------- temp cell
.temp-cell
background-color rgba(115, 170, 255, .75)
border 1px solid rgba(110, 150, 255, 1)
&.edit
border 1px solid red
border 1px dashed white
background-color transparent
//************************************************** mobile: new cell
......@@ -1445,7 +1397,7 @@
right gap
&.desktop
right calc(100vw / 4)
// border-right 1px solid #eee
</style>
<style lang="stylus">
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment