531 lines
14 KiB
CSS
531 lines
14 KiB
CSS
.tv-floating-toolbar {
|
|
display: flex;
|
|
position: absolute !important;
|
|
align-items: stretch;
|
|
flex-direction: column;
|
|
opacity: 1;
|
|
transition: transform 0.2625s cubic-bezier(0.215, 0.61, 0.355, 1),
|
|
opacity 0.2625s cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
border-radius: 3px;
|
|
background-color: #fff;
|
|
box-shadow: 0 2px 4px 0 rgba(107, 121, 136, 0.4);
|
|
border-radius: 4px;
|
|
border: 1px solid;
|
|
border-color: #e6eaef;
|
|
}
|
|
html.theme-dark .tv-floating-toolbar {
|
|
border-color: #363c4e;
|
|
background-color: #1e222d;
|
|
box-shadow: 0 2px 4px 0 #000;
|
|
}
|
|
.tv-floating-toolbar.i-closed {
|
|
transform: scale(0.925);
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.tv-floating-toolbar.i-vertical {
|
|
height: auto;
|
|
min-width: 37px;
|
|
}
|
|
.tv-floating-toolbar__widget-wrapper {
|
|
display: flex;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__widget-wrapper {
|
|
flex-direction: column;
|
|
}
|
|
.tv-floating-toolbar__drag {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-shrink: 0;
|
|
cursor: url(grab.bc156522a6b55a60be9fae15c14b66c5.cur), move;
|
|
cursor: grab;
|
|
width: 14px;
|
|
}
|
|
.feature-mobiletouch .tv-floating-toolbar__drag {
|
|
width: 20px;
|
|
}
|
|
.tv-floating-toolbar__drag svg {
|
|
width: 6px;
|
|
height: 12px;
|
|
fill: #dadde0;
|
|
}
|
|
.tv-floating-toolbar.ui-draggable-dragging .tv-floating-toolbar__drag {
|
|
cursor: url(grabbing.1c0862a8a8c0fb02885557bc97fdafe7.cur), move;
|
|
cursor: grabbing;
|
|
}
|
|
.tv-floating-toolbar__drag-ext {
|
|
height: 100%;
|
|
width: 14px;
|
|
position: absolute;
|
|
padding: 4px 0 0 4px;
|
|
left: -4px;
|
|
top: -4px;
|
|
}
|
|
.feature-mobiletouch .tv-floating-toolbar__drag-ext {
|
|
width: 20px;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__drag-ext {
|
|
width: 100%;
|
|
height: 14px;
|
|
}
|
|
.feature-mobiletouch
|
|
.tv-floating-toolbar.i-vertical
|
|
.tv-floating-toolbar__drag-ext {
|
|
height: 20px;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__drag {
|
|
width: 100%;
|
|
height: 14px;
|
|
}
|
|
.feature-mobiletouch
|
|
.tv-floating-toolbar.i-vertical
|
|
.tv-floating-toolbar__drag {
|
|
height: 20px;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__drag svg {
|
|
transform: rotate(90deg);
|
|
}
|
|
.tv-floating-toolbar__content {
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
overflow: hidden;
|
|
border-top-right-radius: 4px;
|
|
border-bottom-right-radius: 4px;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__content {
|
|
flex-direction: column;
|
|
border-top-right-radius: 0;
|
|
border-bottom-left-radius: 4px;
|
|
}
|
|
.tv-floating-toolbar .ui-sortable-placeholder {
|
|
border-left: 1px solid #e6eaef;
|
|
}
|
|
html.theme-dark .tv-floating-toolbar .ui-sortable-placeholder {
|
|
border-left: 1px solid #363c4e;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .ui-sortable-placeholder {
|
|
border-left: none;
|
|
border-top: 1px solid #e6eaef;
|
|
}
|
|
html.theme-dark .tv-floating-toolbar.i-vertical .ui-sortable-placeholder {
|
|
border-top: 1px solid #363c4e;
|
|
}
|
|
.tv-floating-toolbar__widget {
|
|
display: flex;
|
|
align-items: stretch;
|
|
border-left: 1px solid;
|
|
border-left-color: #e6eaef;
|
|
}
|
|
html.theme-dark .tv-floating-toolbar__widget {
|
|
border-left-color: #363c4e;
|
|
}
|
|
.tv-floating-toolbar__widget.ui-sortable-placeholder {
|
|
visibility: visible !important;
|
|
}
|
|
.tv-floating-toolbar__widget.ui-sortable-helper {
|
|
border-left-color: transparent;
|
|
}
|
|
.tv-floating-toolbar.i-vertical .tv-floating-toolbar__widget {
|
|
border-left: none;
|
|
border-top: 1px solid;
|
|
border-top-color: #eceff2;
|
|
}
|
|
html.theme-dark .tv-floating-toolbar.i-vertical .tv-floating-toolbar__widget {
|
|
border-top-color: #363c4e;
|
|
}
|
|
.tv-floating-toolbar.i-vertical
|
|
.tv-floating-toolbar__widget.ui-sortable-helper {
|
|
border-top-color: transparent;
|
|
}
|
|
.tv-caret {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 0;
|
|
height: 0;
|
|
border-style: solid;
|
|
border-width: 4px 4px 0;
|
|
border-color: currentColor transparent transparent;
|
|
margin-left: 5px;
|
|
vertical-align: middle;
|
|
transition: transform 0.35s ease;
|
|
}
|
|
.active .tv-caret,
|
|
.i-dropped .tv-caret:not(.tv-caret--strict),
|
|
.tv-caret--strict.i-dropped {
|
|
transform: rotate(-180deg);
|
|
will-change: transform;
|
|
transition-duration: 0.33;
|
|
}
|
|
.tv-caret--small {
|
|
margin-left: 3px;
|
|
margin-right: -1px;
|
|
border-top-width: 3px;
|
|
border-right-width: 3px;
|
|
border-left-width: 3px;
|
|
}
|
|
.tv-caret--colored {
|
|
transition: transform 0.35s ease, color 0.35s ease;
|
|
}
|
|
.tv-caret--no-margin {
|
|
margin-left: 0;
|
|
}
|
|
.tv-grouped-floating-toolbar {
|
|
color: #4a4a4a;
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar {
|
|
color: #c5cbce;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup {
|
|
display: flex;
|
|
position: absolute;
|
|
top: 100%;
|
|
opacity: 0;
|
|
border-radius: 0 0 1px 1px;
|
|
border-radius: 3px;
|
|
background-color: #fff;
|
|
box-shadow: 0 2px 4px 0 rgba(107, 121, 136, 0.4);
|
|
transition: opacity 0.35s ease;
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar__popup {
|
|
background-color: #1e222d;
|
|
box-shadow: 0 2px 4px 0 #000;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup.i-opened {
|
|
opacity: 1;
|
|
transition-duration: 0.11666667s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-top {
|
|
top: calc(-100% - 2px);
|
|
border-radius: 1px 1px 0 0;
|
|
box-shadow: 0 -5px 10px -5px rgba(0, 0, 0, 0.15);
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left {
|
|
left: 0;
|
|
border-radius: 1px 0 0 1px;
|
|
transform: translateX(-100%);
|
|
}
|
|
.tv-grouped-floating-toolbar.i-vertical
|
|
.tv-grouped-floating-toolbar__popup:not(.tv-grouped-floating-toolbar__popup--at-left) {
|
|
left: 100%;
|
|
border-radius: 0 1px 1px 0;
|
|
}
|
|
.tv-grouped-floating-toolbar__sub-widget {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
transition: background-color 0.35s ease, opacity 0.35s ease;
|
|
}
|
|
.tv-grouped-floating-toolbar__sub-widget--current {
|
|
background-color: #f1f3f6;
|
|
transition-duration: 0.06s;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-grouped-floating-toolbar__sub-widget:hover {
|
|
background-color: #f1f3f6;
|
|
transition-duration: 0.06s;
|
|
}
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar__sub-widget--current {
|
|
background-color: #2f3241;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
html.theme-dark .tv-grouped-floating-toolbar__sub-widget:hover {
|
|
background-color: #2f3241;
|
|
}
|
|
}
|
|
.tv-grouped-floating-toolbar__sub-widget:active {
|
|
background-color: #eaecef;
|
|
transition-duration: 0.06s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-9,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-9 {
|
|
transition-delay: 0s, 0.2422s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-8,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-8 {
|
|
transition-delay: 0s, 0.20055s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-7,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-7 {
|
|
transition-delay: 0s, 0.1638s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-6,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-6 {
|
|
transition-delay: 0s, 0.13195s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-5,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-5 {
|
|
transition-delay: 0s, 0.105s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-4,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-4 {
|
|
transition-delay: 0s, 0.08295s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-3,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-3 {
|
|
transition-delay: 0s, 0.0658s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-2,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-2 {
|
|
transition-delay: 0s, 0.05355s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-1,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-1 {
|
|
transition-delay: 0s, 0.0462s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup--at-left
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-left-0,
|
|
.tv-grouped-floating-toolbar__sub-widget--slide-right-0 {
|
|
transition-delay: 0s, 0.04375s;
|
|
}
|
|
.tv-grouped-floating-toolbar__popup.i-opened
|
|
.tv-grouped-floating-toolbar__sub-widget {
|
|
opacity: 1;
|
|
}
|
|
.tv-grouped-floating-toolbar__sub-widget:not(:first-child) {
|
|
border-left: 1px solid;
|
|
border-left-color: #dadde0;
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar__sub-widget:not(:first-child) {
|
|
border-left-color: #363c4e;
|
|
}
|
|
.tv-grouped-floating-toolbar__widget-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-grow: 1;
|
|
cursor: pointer;
|
|
background-color: #fff;
|
|
transition: background-color 0.35s ease;
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar__widget-wrapper {
|
|
background-color: #1e222d;
|
|
}
|
|
.tv-grouped-floating-toolbar__widget-wrapper.i-dropped {
|
|
background-color: #f1f3f6;
|
|
transition-duration: 0.06s;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-grouped-floating-toolbar__widget-wrapper:hover {
|
|
background-color: #f1f3f6;
|
|
transition-duration: 0.06s;
|
|
}
|
|
}
|
|
html.theme-dark .tv-grouped-floating-toolbar__widget-wrapper.i-dropped {
|
|
background-color: #2f3241;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
html.theme-dark .tv-grouped-floating-toolbar__widget-wrapper:hover {
|
|
background-color: #2f3241;
|
|
}
|
|
}
|
|
.tv-grouped-floating-toolbar__widget-wrapper.i-disabled {
|
|
cursor: default;
|
|
color: #adaeb0;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-grouped-floating-toolbar__widget-wrapper.i-disabled:hover {
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
.tv-grouped-floating-toolbar__widget-wrapper:active {
|
|
background-color: #eaecef;
|
|
transition-duration: 0.06s;
|
|
}
|
|
.tv-linetool-properties-toolbar__button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-grow: 1;
|
|
cursor: pointer;
|
|
transition: background-color 0.35s ease;
|
|
}
|
|
.tv-linetool-properties-toolbar__button.i-dropped {
|
|
background-color: #f1f3f6;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-linetool-properties-toolbar__button:hover {
|
|
background-color: #f1f3f6;
|
|
}
|
|
}
|
|
html.theme-dark .tv-linetool-properties-toolbar__button.i-dropped {
|
|
background-color: #2f3241;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
html.theme-dark .tv-linetool-properties-toolbar__button:hover {
|
|
background-color: #2f3241;
|
|
}
|
|
}
|
|
.tv-linetool-properties-toolbar__button:active {
|
|
background-color: #eaecef;
|
|
}
|
|
html.theme-dark .tv-linetool-properties-toolbar__button:active {
|
|
background-color: #2f3241;
|
|
}
|
|
.tv-linetool-properties-toolbar__button:active {
|
|
transition-duration: 0.06s;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-linetool-properties-toolbar__button:hover {
|
|
transition-duration: 0.06s;
|
|
}
|
|
}
|
|
.tv-linetool-properties-toolbar__button.i-active {
|
|
background-color: #f1f3f6;
|
|
}
|
|
html.theme-dark .tv-linetool-properties-toolbar__button.i-active {
|
|
background-color: #262b3e;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-linetool-properties-toolbar__button.i-active:hover {
|
|
background-color: #e8ebf0;
|
|
}
|
|
}
|
|
.tv-linetool-properties-toolbar__button.i-active:active {
|
|
background-color: #dee3ea;
|
|
}
|
|
.tv-linetool-properties-toolbar__button,
|
|
.tv-linetool-properties-toolbar__grouped-button,
|
|
.tv-linetool-properties-toolbar__sub-widget {
|
|
min-width: 38px;
|
|
min-height: 38px;
|
|
}
|
|
.tv-linetool-properties-toolbar__text {
|
|
transition: color 0.35s ease;
|
|
}
|
|
.tv-linetool-properties-toolbar__icon {
|
|
display: flex;
|
|
}
|
|
.tv-linetool-properties-toolbar__icon svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
fill: #758696;
|
|
transition: fill 0.35s ease, stroke 0.35s ease;
|
|
}
|
|
.i-active .tv-linetool-properties-toolbar__icon svg {
|
|
fill: #2196f3;
|
|
}
|
|
.tv-linetool-properties-toolbar__icon--line-props svg {
|
|
width: 22px;
|
|
height: 6px;
|
|
}
|
|
.tv-linetool-properties-toolbar__button:active
|
|
.tv-linetool-properties-toolbar__icon
|
|
svg {
|
|
transition-duration: 0.06s;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-linetool-properties-toolbar__button:hover
|
|
.tv-linetool-properties-toolbar__icon
|
|
svg {
|
|
transition-duration: 0.06s;
|
|
}
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker {
|
|
height: 38px !important;
|
|
width: 38px !important;
|
|
cursor: pointer;
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker .tvcolorpicker-transparency {
|
|
width: 38px !important;
|
|
height: 4px !important;
|
|
bottom: 5px;
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker .colorpicker-widget {
|
|
border-color: #c9cbcd;
|
|
border: 0 !important;
|
|
width: 34px;
|
|
height: 34px;
|
|
padding: 2px;
|
|
z-index: 10;
|
|
position: relative !important;
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker .colorpicker-widget + svg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 38px;
|
|
height: 38px;
|
|
z-index: 40;
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker .colorpicker-widget + svg .bg {
|
|
fill: #fff;
|
|
transition: fill 0.35s ease;
|
|
}
|
|
html.theme-dark
|
|
.tv-linetool-properties-toolbar__color-picker
|
|
.colorpicker-widget
|
|
+ svg
|
|
.bg {
|
|
fill: #1e222d;
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker .colorpicker-widget + svg .icon {
|
|
fill: #758696;
|
|
transition: fill 0.35s ease;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-linetool-properties-toolbar__color-picker
|
|
.colorpicker-widget
|
|
+ svg:hover
|
|
.bg {
|
|
fill: #f1f3f6;
|
|
}
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
html.theme-dark
|
|
.tv-linetool-properties-toolbar__color-picker
|
|
.colorpicker-widget
|
|
+ svg:hover
|
|
.bg {
|
|
fill: #2f3241;
|
|
}
|
|
}
|
|
.tv-linetool-properties-toolbar__color-picker
|
|
.colorpicker-widget.i-active
|
|
+ svg
|
|
.bg {
|
|
fill: #f1f3f6;
|
|
}
|
|
.tv-favorited-drawings-toolbar__widget {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-grow: 1;
|
|
min-width: 38px;
|
|
min-height: 38px;
|
|
cursor: pointer;
|
|
transition: color 0.35s ease;
|
|
color: #4c525e;
|
|
}
|
|
html.theme-dark .tv-favorited-drawings-toolbar__widget {
|
|
color: #758696;
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
.tv-favorited-drawings-toolbar__widget:hover {
|
|
color: #131722;
|
|
}
|
|
}
|
|
@media (any-hover: hover), (min--moz-device-pixel-ratio: 0) {
|
|
html.theme-dark .tv-favorited-drawings-toolbar__widget:hover {
|
|
color: #9db2bd;
|
|
}
|
|
}
|
|
.tv-favorited-drawings-toolbar__widget.i-active {
|
|
color: #1592e6;
|
|
}
|
|
html.theme-dark .tv-favorited-drawings-toolbar__widget.i-active {
|
|
color: #2196f3;
|
|
}
|