smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Initial support for mobile devices (#787)

Browse source 
* Initial support for mobile devices

No editing yet, but UI looks nice and you can open the canvas menu

* Add support for editing shape color, etc

* Allow the mobile menus to cover the shape selector

* Hopefully fix test error

* Fix touch on canvas

* Fix safe area handling & remove unused Island
This commit is contained in:
Jed Fox 2020-02-20 18:44:38 -05:00 • committed by GitHub
parent 9439908b92
commit 7a7a73b78d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 358 additions and 125 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/ToolIcon.scss
View file

@ -1,13 +1,13 @@
.ToolIcon {
display: inline-block;
display: inline-flex;
align-items: center;
position: relative;
font-family: Cascadia;
cursor: pointer;
background-color: #e9ecef;
}
.ToolIcon__icon {
background-color: #e9ecef;
width: 2.5rem;
height: 2.5rem;
@ -23,6 +23,10 @@
}
}
.ToolIcon__label {
font-family: var(--ui-font);
}
.ToolIcon_size_s .ToolIcon__icon {
width: 1.4rem;
height: 1.4rem;
@ -35,13 +39,13 @@
margin: 0;
font-size: inherit;
&:hover .ToolIcon__icon {
&:hover {
background-color: #e9ecef;
}
&:active .ToolIcon__icon {
&:active {
background-color: #ced4da;
}
&:focus .ToolIcon__icon {
&:focus {
box-shadow: 0 0 0 2px #a5d8ff;
}
}
@ -70,19 +74,19 @@
align-items: center;
justify-content: center;
margin-left: 0.1rem;
background-color: transparent;
.ToolIcon__icon {
background-color: transparent;
width: 2rem;
height: 2em;
}
&:hover .ToolIcon__icon {
&:hover {
background-color: transparent;
}
&:active .ToolIcon__icon {
&:active {
background-color: transparent;
}
&:focus .ToolIcon__icon {
&:focus {
box-shadow: none;
}
}
@ -93,6 +97,6 @@
right: 3px;
font-size: 0.5em;
color: #adb5bd; // OC GRAY 5
font-family: Arial, Helvetica, sans-serif;
font-family: var(--ui-font);
user-select: none;
}