Commit 63aa6566 authored by christianrhansen's avatar christianrhansen

mosys mobiie: handler styling

parent e3e36ea3
Pipeline #19830 passed with stage
in 9 minutes and 48 seconds
<template lang="pug">
.handler-new-cell.justify-center.row(ref="targetHandler")
q-btn.text-dark.bg-grey-3.shadow-2(@click="onDoubleTap", flat, size="sm", no-ripple, style="max-width: 100%; border-radius: .5rem;")
.handler-new-cell.justify-center.row.bg-grey-3(ref="targetHandler")
q-btn.text-dark(@click="onDoubleTap", flat, size="sm", no-ripple, style="max-width: 100%;")
slot
</template>
......@@ -61,5 +61,6 @@
.handler-new-cell
width handler-width
height handler-width
border-radius 1000px
// border-radius 1000px
border-radius .5rem
</style>
......@@ -144,7 +144,7 @@
//----------------------------------------------------------------------------------------------- move handler
//----- (main)
cell-handler-mobile.main-handler(
cell-handler-mobile.main-handler.shadow-1(
v-if="!handlerNewCell.resize.pushed",
@onIntersectionChange="intersectionChanged",
:element="'move'",
......@@ -155,7 +155,7 @@
//----- (temp)
//----- (when main move handler is outside of viewport)
cell-handler-mobile.temp-handler(
cell-handler-mobile.temp-handler.shadow-1(
v-touch-pan="handleMoveCell",
:doubleTap="{el: $el, type: 'scroll', oLeft: mobileTempCell.left}",
:class="[(!mobileTempCell.onGrid || tempHandler.move.intersectingMain || handlerNewCell.resize.pushed || handlerNewCell.move.pushed ? 'hide': 'show'), (tempHandler.move.side === 'left' ? 'left-side' : 'right-side')]",
......@@ -164,7 +164,7 @@
//--------------------------------------------------------------------------------------------- resize handler
//----- (main)
cell-handler-mobile.main-handler(
cell-handler-mobile.main-handler.shadow-1(
v-if="!handlerNewCell.move.pushed",
@onIntersectionChange="intersectionChanged",
:element="'resize'",
......@@ -175,7 +175,7 @@
//----- (temp)
//----- (when main resize handler is outside of viewport)
cell-handler-mobile.temp-handler(
cell-handler-mobile.temp-handler.shadow-1(
v-touch-pan="handleResizeCell",
:class="[(!mobileTempCell.onGrid || tempHandler.resize.intersectingMain || handlerNewCell.move.pushed || handlerNewCell.resize.pushed ? 'hide': 'show'), (tempHandler.resize.side === 'left' ? 'left-side' : 'right-side')]",
:style="{top: handlerNewCell.resize.y + 59 - 20 + 'px'}",)
......@@ -1289,7 +1289,8 @@
//************************************************** mobile: new cell
handler-width = 40px
gap = 4px
// gap = 4px
gap = 0px
.main-handler
position absolute
......@@ -1298,9 +1299,11 @@
overflow hidden
.handler-new-cell
/*
width handler-width
height handler-width
border-radius 1000px
*/
&.pushed
transition top ease 200ms, left ease 200ms
......@@ -1322,10 +1325,12 @@
&.left-side
left gap
right auto
border-radius 0 .5rem .5rem 0
&.right-side
// left 'calc(100vw - %s)' % handler-width
left auto
right gap
border-radius .5rem 0 0 .5rem
</style>
......
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