Ryan Di
416e8b3e42
* compact bottom toolbar * put menu trigger to top left * add popup to switch between grouped tool types * add a dedicated mobile toolbar * update position for mobile * fix active tool type * add mobile mode as well * mobile actions * remove refactored popups * excali logo mobile * include mobile * update mobile menu layout * move selection and deletion back to right * do not fill eraser * fix styling * fix active styling * bigger buttons, smaller gaps * fix other tools not opened * fix: Style panel persistence and restore Signed-off-by: Mark Tolmacs <mark@lazycat.hu> * move hidden action btns to extra popover * fix dropdown overlapping with welcome screen * replace custom popup with popover * improve button styles * swapping redo and delete * always show undo & redo and improve styling * change background * toolbar styles * no any * persist perferred selection tool and align tablet as well * add a renderTopLeftUI to props * tweak border and bg * show combined properties only when using suitable tools * fix preferred tool * new stroke icon * hide color picker hot keys * init preferred tool based on device * fix main menu sizing * fix welcome screen offset * put text before image * disable call highlight on buttons * fix renderTopLeftUI --------- Signed-off-by: Mark Tolmacs <mark@lazycat.hu> Co-authored-by: Mark Tolmacs <mark@lazycat.hu> Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
65 lines
1.2 KiB
SCSS
65 lines
1.2 KiB
SCSS
@import "open-color/open-color.scss";
|
|
@import "../css/variables.module.scss";
|
|
|
|
.excalidraw {
|
|
.App-toolbar {
|
|
&.zen-mode {
|
|
.ToolIcon__keybinding,
|
|
.HintViewer {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
&--compact {
|
|
.ToolIcon__keybinding {
|
|
display: none;
|
|
}
|
|
|
|
.App-toolbar__divider {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
&__divider {
|
|
width: 1px;
|
|
height: 1.5rem;
|
|
align-self: center;
|
|
background-color: var(--default-border-color);
|
|
margin: 0 0.25rem;
|
|
|
|
@include isMobile {
|
|
margin: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.App-toolbar__extra-tools-trigger {
|
|
box-shadow: none;
|
|
border: 0;
|
|
background-color: transparent;
|
|
|
|
&:active {
|
|
background-color: var(--button-hover-bg);
|
|
box-shadow: 0 0 0 1px
|
|
var(--button-active-border, var(--color-primary-darkest)) inset;
|
|
}
|
|
|
|
&:hover {
|
|
background-color: transparent;
|
|
}
|
|
|
|
&--selected,
|
|
&--selected:hover {
|
|
background: var(--color-primary-light);
|
|
color: var(--color-primary);
|
|
}
|
|
}
|
|
|
|
.App-toolbar__extra-tools-dropdown {
|
|
margin-top: 0.375rem;
|
|
right: 0;
|
|
min-width: 11.875rem;
|
|
z-index: 1;
|
|
}
|
|
}
|