18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
28 |
29 |
30 |
33 |
34 |
63 |
64 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
58 |
59 |
62 |
65 |
66 | 
67 |
68 |
69 |
70 |
71 |
--------------------------------------------------------------------------------
/client/src/static/main.sass:
--------------------------------------------------------------------------------
1 | @mixin circle($size)
2 | border-radius: 50%
3 | width: $size
4 | height: $size
5 |
6 | @mixin button($size)
7 | @include circle($size)
8 | background-color: white
9 | padding: 0
10 | border: none
11 | filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2))
12 |
13 | @mixin img-fill
14 | height: 100%
15 | width: 100%
16 | padding: 8px
17 |
18 | @mixin vertical-list
19 | display: flex
20 | flex-direction: column
21 | row-gap: 8px
22 |
23 | html,
24 | body,
25 | #board
26 | height: 100%
27 | width: 100%
28 | margin: 0
29 | overflow: hidden
30 |
31 | #board
32 | background:
33 | color: white
34 | image: url('assets/cross.svg')
35 | size: 20px
36 |
37 | & > canvas
38 | position: absolute
39 |
40 | #controller
41 | @include vertical-list
42 | position: absolute
43 | top: 18px
44 | left: 18px
45 |
46 | img
47 | @include img-fill
48 |
49 | input[type="radio"]
50 | display: none
51 |
52 | & + label
53 | @include button(40px)
54 |
55 | img
56 | transition: filter 0.4s ease-out
57 |
58 | &:checked + label
59 | background-color: black
60 |
61 | img
62 | filter: invert(1)
63 |
64 | button
65 | @include button(40px)
66 |
67 | #tool-pen-radio:checked ~ #pen-colors
68 | visibility: visible
69 | opacity: 1
70 |
71 | #pen-colors
72 | @include vertical-list
73 | position: absolute
74 | top: 50px
75 | left: 50px
76 | transition: visibility 0.1s ease-out, opacity 0.1s ease-out
77 | visibility: hidden
78 | opacity: 0
79 |
80 | input[type="radio"]
81 | display: none
82 |
83 | & + label
84 | @include button(22px)
85 | transition: border-width 0.1s ease-out
86 | border:
87 | color: white
88 | style: solid
89 | width: 6px
90 |
91 | &:checked + label
92 | border-width: 0
93 |
94 | --black: rgb(0, 0, 0)
95 | --red: rgb(255, 75, 0)
96 | --orange: rgb(246, 170, 0)
97 | --green: rgb(3, 175, 122)
98 | --blue: rgb(0, 90, 255)
99 | --sky-blue: rgb(77, 196, 255)
100 |
101 | @each $color in "black", "red", "orange", "green", "blue", "sky-blue"
102 | #pen-color-#{$color}-radio + label
103 | background-color: var(--#{$color})
104 |
105 | #info
106 | @include vertical-list
107 | position: absolute
108 | bottom: 18px
109 | left: 18px
110 |
111 | img
112 | @include img-fill
113 |
114 | a
115 | @include button(40px)
116 |
--------------------------------------------------------------------------------
/client/src/utils.rs:
--------------------------------------------------------------------------------
1 | use arrayvec::ArrayVec;
2 | use geo::{map_coords::MapCoordsInplace as _, prelude::*, CoordNum, Coordinate, Rect};
3 | use std::cmp::Ordering;
4 |
5 | pub fn coord_map_scalars
67 |
68 |