mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-10-12 10:40:12 +02:00

* 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>
88 lines
1.5 KiB
SCSS
88 lines
1.5 KiB
SCSS
.excalidraw {
|
|
.ExcalidrawLogo {
|
|
--logo-icon--mobile: 1rem;
|
|
--logo-text--mobile: 0.75rem;
|
|
|
|
--logo-icon--xs: 2rem;
|
|
--logo-text--xs: 1.5rem;
|
|
|
|
--logo-icon--small: 2.5rem;
|
|
--logo-text--small: 1.75rem;
|
|
|
|
--logo-icon--normal: 3rem;
|
|
--logo-text--normal: 2.2rem;
|
|
|
|
--logo-icon--large: 90px;
|
|
--logo-text--large: 65px;
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
svg {
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
.ExcalidrawLogo-icon {
|
|
width: auto;
|
|
color: var(--color-logo-icon);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
margin-left: 0.75rem;
|
|
width: auto;
|
|
color: var(--color-logo-text);
|
|
}
|
|
|
|
&.is-mobile {
|
|
.ExcalidrawLogo-icon {
|
|
height: var(--logo-icon--mobile);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
height: var(--logo-text--mobile);
|
|
margin-left: 0.5rem;
|
|
}
|
|
}
|
|
|
|
&.is-xs {
|
|
.ExcalidrawLogo-icon {
|
|
height: var(--logo-icon--xs);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
height: var(--logo-text--xs);
|
|
}
|
|
}
|
|
|
|
&.is-small {
|
|
.ExcalidrawLogo-icon {
|
|
height: var(--logo-icon--small);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
height: var(--logo-text--small);
|
|
}
|
|
}
|
|
|
|
&.is-normal {
|
|
.ExcalidrawLogo-icon {
|
|
height: var(--logo-icon--normal);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
height: var(--logo-text--normal);
|
|
}
|
|
}
|
|
|
|
&.is-large {
|
|
.ExcalidrawLogo-icon {
|
|
height: var(--logo-icon--large);
|
|
}
|
|
|
|
.ExcalidrawLogo-text {
|
|
height: var(--logo-text--large);
|
|
}
|
|
}
|
|
}
|
|
}
|