Port font editor to SDL2

Replace X11 with SDL2 to improve the portability and cross-platform support

Migrated window creation from X11's `XCreateWindow` to `SDL_CreateWindow`.

Replaced X11 event handling with SDL2’s event loop (`SDL_PollEvent`)
to capture input events such as keyboard and mouse interactions.

Updated rendering to use `SDL_Renderer` and `SDL_Surface`,
replacing X11's rendering functions.

* Modified some key event logic:
    1. SDLK_ESCAPE: ESC now exits the program.
    2. SDL_QUIT: Clicking the "X" on the window exits the program.

* Unchanged key event logic:
    1. SDLK_q: Switches to the next font.

* Rename delete function:
    1. Rename delete() to delete_char() to avoid `clang-format` misinterpreting
       `delete()` as the C++ the keyword, which cauese an extra space to be
       added when running `clang-format`, turning `delete()` to `delete ()`.

* Add operation instructions in the READMD.
    1. Add a quick guide
    2. Add demo GIF of font editor

Author: jouae

tools/font-edit/Makefile

@@ -1,7 +1,7 @@
 TARGET = twin-fedit
 
-CFLAGS = $(shell pkg-config --cflags cairo x11) -g -Wall
-LIBS = $(shell pkg-config --libs cairo x11)
+CFLAGS = $(shell pkg-config --cflags cairo) $(shell sdl2-config --cflags) -g -Wall
+LIBS = $(shell pkg-config --libs cairo) $(shell sdl2-config --libs)
 
 OBJS = \
 	twin-fedit.o \

tools/font-edit/README.md

@@ -3,15 +3,50 @@
 which are expected to fit the requirements of embedded systems with larger
 screens.
 
+<p align="center">
+  <img src="./figs/demo.gif" />
+</p>
+
 ## Build Dependency
 ```shell
-sudo apt-get install libx11-dev libcairo2-dev
+sudo apt-get install libsdl2-dev libcairo2-dev
 ```
 
 ## Usage
 ```shell
 make
 ./twin-fedit < nchars
 ```
+### Key bindings
+
+
+| Key binding | Function |
+|   ---       |   ---    |
+|  ESC  | Exit program |
+| left mouse button | Select a point as start point |
+| right mouse button | Select a point as end point |
+| d | Delete selected point|
+| f | Replace a line with a spline |
+| q | Next character |
+| s | Split a spline into two splines by start point and end point |
+| u | Undo the last operation |
+
+### Quick Guide
+* To move a point  
+    1. Select a point by left mouse button,
+    2. Use arrow keys to move the selected point.
+
+* To split a spline or line  
+    1. Select two point by left and right mouse button,
+    2. Use s key to split the line or spline into two segments.
+
+* To replace the line or spline by another spline
+    1. Select two point by left and right mouse button as start and end of the another spline,
+    2. Use f key to replace the line or spline with another spline.
+
+* To delete a point
+    1. Select a point by left mouse button,
+    2. Use d key to delete the selected point.
 
-(press 'q' to next character)
+* To undo any operation above
+    1. Use u key.