diff --git a/README.md b/README.md index 45d7a000..26774c7f 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@
- +

diff --git a/ui/app.slint b/ui/app.slint index 7f71e1a6..a5b65cca 100644 --- a/ui/app.slint +++ b/ui/app.slint @@ -1,5 +1,5 @@ import {MainView} from "./index.slint"; -import {ROOT_GLOBAL} from "./global.slint"; +import { ROOT_GLOBAL, Token } from "./global.slint"; export component App inherits Window { callback loginClicked <=> main-view.startLink; @@ -8,7 +8,7 @@ export component App inherits Window { min-width: ROOT-GLOBAL.window-width; title: "SAST Evento"; background: white; - icon: @image-url("assets/app_icon.png"); + icon: Token.image.icon.evento; main-view := MainView { y: 120px; } diff --git a/ui/assets/font/MiSans-Regular.ttf b/ui/assets/font/MiSans-Regular.ttf new file mode 100644 index 00000000..9cbfff50 Binary files /dev/null and b/ui/assets/font/MiSans-Regular.ttf differ diff --git a/ui/assets/image/display/avatar/avatar_1.svg b/ui/assets/image/display/avatar/avatar_1.svg new file mode 100644 index 00000000..8ea966a1 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_1.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_10.svg b/ui/assets/image/display/avatar/avatar_10.svg new file mode 100644 index 00000000..b729a36d --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_10.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_11.svg b/ui/assets/image/display/avatar/avatar_11.svg new file mode 100644 index 00000000..2859ab21 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_11.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_12.svg b/ui/assets/image/display/avatar/avatar_12.svg new file mode 100644 index 00000000..b76d2a92 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_12.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_2.svg b/ui/assets/image/display/avatar/avatar_2.svg new file mode 100644 index 00000000..40ddfc93 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_2.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_3.svg b/ui/assets/image/display/avatar/avatar_3.svg new file mode 100644 index 00000000..93dfa60e --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_3.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_4.svg b/ui/assets/image/display/avatar/avatar_4.svg new file mode 100644 index 00000000..bbc845a8 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_4.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_5.svg b/ui/assets/image/display/avatar/avatar_5.svg new file mode 100644 index 00000000..98d4f7df --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_5.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_6.svg b/ui/assets/image/display/avatar/avatar_6.svg new file mode 100644 index 00000000..11541a6e --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_6.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_7.svg b/ui/assets/image/display/avatar/avatar_7.svg new file mode 100644 index 00000000..2c0840b6 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_7.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_8.svg b/ui/assets/image/display/avatar/avatar_8.svg new file mode 100644 index 00000000..26ebb645 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_8.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/avatar/avatar_9.svg b/ui/assets/image/display/avatar/avatar_9.svg new file mode 100644 index 00000000..3c16a753 --- /dev/null +++ b/ui/assets/image/display/avatar/avatar_9.svg @@ -0,0 +1 @@ +touxiang \ No newline at end of file diff --git a/ui/assets/image/display/event/backend_1.png b/ui/assets/image/display/event/backend_1.png new file mode 100644 index 00000000..715d25fc Binary files /dev/null and b/ui/assets/image/display/event/backend_1.png differ diff --git a/ui/assets/image/display/event/cpp_1.svg b/ui/assets/image/display/event/cpp_1.svg new file mode 100644 index 00000000..5e117077 --- /dev/null +++ b/ui/assets/image/display/event/cpp_1.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + diff --git a/ui/assets/image/display/event/cpp_2.png b/ui/assets/image/display/event/cpp_2.png new file mode 100644 index 00000000..0a1d1ea8 Binary files /dev/null and b/ui/assets/image/display/event/cpp_2.png differ diff --git a/ui/assets/image/display/event/cpp_3.png b/ui/assets/image/display/event/cpp_3.png new file mode 100644 index 00000000..dc1daa1a Binary files /dev/null and b/ui/assets/image/display/event/cpp_3.png differ diff --git a/ui/assets/image/display/event/csharp_1.png b/ui/assets/image/display/event/csharp_1.png new file mode 100644 index 00000000..d8cda7ee Binary files /dev/null and b/ui/assets/image/display/event/csharp_1.png differ diff --git a/ui/assets/image/display/event/default_1.png b/ui/assets/image/display/event/default_1.png new file mode 100644 index 00000000..a0bc5400 Binary files /dev/null and b/ui/assets/image/display/event/default_1.png differ diff --git a/ui/assets/image/display/event/default_2.png b/ui/assets/image/display/event/default_2.png new file mode 100644 index 00000000..e6e6ab70 Binary files /dev/null and b/ui/assets/image/display/event/default_2.png differ diff --git a/ui/assets/image/display/event/default_3.png b/ui/assets/image/display/event/default_3.png new file mode 100644 index 00000000..2cf11f2e Binary files /dev/null and b/ui/assets/image/display/event/default_3.png differ diff --git a/ui/assets/image/display/event/frontend_1.png b/ui/assets/image/display/event/frontend_1.png new file mode 100644 index 00000000..b1efe758 Binary files /dev/null and b/ui/assets/image/display/event/frontend_1.png differ diff --git a/ui/assets/image/display/event/frontend_2.png b/ui/assets/image/display/event/frontend_2.png new file mode 100644 index 00000000..83258606 Binary files /dev/null and b/ui/assets/image/display/event/frontend_2.png differ diff --git a/ui/assets/image/display/event/frontend_3.png b/ui/assets/image/display/event/frontend_3.png new file mode 100644 index 00000000..3b5cd8ab Binary files /dev/null and b/ui/assets/image/display/event/frontend_3.png differ diff --git a/ui/assets/image/display/event/game_1.svg b/ui/assets/image/display/event/game_1.svg new file mode 100644 index 00000000..755e1942 --- /dev/null +++ b/ui/assets/image/display/event/game_1.svg @@ -0,0 +1,29 @@ + + + diff --git a/ui/assets/image/display/event/game_2.jpg b/ui/assets/image/display/event/game_2.jpg new file mode 100644 index 00000000..60a6de3d Binary files /dev/null and b/ui/assets/image/display/event/game_2.jpg differ diff --git a/ui/assets/image/display/event/game_3.jpg b/ui/assets/image/display/event/game_3.jpg new file mode 100644 index 00000000..c6167c96 Binary files /dev/null and b/ui/assets/image/display/event/game_3.jpg differ diff --git a/ui/assets/image/display/event/lambda_1.png b/ui/assets/image/display/event/lambda_1.png new file mode 100644 index 00000000..ddfc6e1c Binary files /dev/null and b/ui/assets/image/display/event/lambda_1.png differ diff --git a/ui/assets/image/display/event/lambda_2.png b/ui/assets/image/display/event/lambda_2.png new file mode 100644 index 00000000..55bd09a5 Binary files /dev/null and b/ui/assets/image/display/event/lambda_2.png differ diff --git a/ui/assets/image/display/event/python_1.png b/ui/assets/image/display/event/python_1.png new file mode 100644 index 00000000..85772f47 Binary files /dev/null and b/ui/assets/image/display/event/python_1.png differ diff --git a/ui/assets/image/display/event/union_1.png b/ui/assets/image/display/event/union_1.png new file mode 100644 index 00000000..698c83e9 Binary files /dev/null and b/ui/assets/image/display/event/union_1.png differ diff --git a/ui/assets/image/display/event/union_2.png b/ui/assets/image/display/event/union_2.png new file mode 100644 index 00000000..440663be Binary files /dev/null and b/ui/assets/image/display/event/union_2.png differ diff --git a/ui/assets/evento_black.png b/ui/assets/image/display/evento/evento.png similarity index 100% rename from ui/assets/evento_black.png rename to ui/assets/image/display/evento/evento.png diff --git a/ui/assets/evento_white.png b/ui/assets/image/display/evento/evento_dark.png similarity index 100% rename from ui/assets/evento_white.png rename to ui/assets/image/display/evento/evento_dark.png diff --git a/ui/assets/image/display/no_image.png b/ui/assets/image/display/no_image.png new file mode 100644 index 00000000..acb02f42 Binary files /dev/null and b/ui/assets/image/display/no_image.png differ diff --git a/ui/assets/app.ico b/ui/assets/image/icon/app.ico similarity index 100% rename from ui/assets/app.ico rename to ui/assets/image/icon/app.ico diff --git a/ui/assets/app_icon.png b/ui/assets/image/icon/evento.png similarity index 100% rename from ui/assets/app_icon.png rename to ui/assets/image/icon/evento.png diff --git a/ui/assets/app_icon.svg b/ui/assets/image/icon/evento.svg similarity index 100% rename from ui/assets/app_icon.svg rename to ui/assets/image/icon/evento.svg diff --git a/ui/assets/image/icon/home.svg b/ui/assets/image/icon/home.svg new file mode 100644 index 00000000..6502662b --- /dev/null +++ b/ui/assets/image/icon/home.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/ui/assets/image/icon/home_dark.svg b/ui/assets/image/icon/home_dark.svg new file mode 100644 index 00000000..1fb1a0e6 --- /dev/null +++ b/ui/assets/image/icon/home_dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/ui/assets/sast_link.svg b/ui/assets/image/icon/sast_link.svg similarity index 100% rename from ui/assets/sast_link.svg rename to ui/assets/image/icon/sast_link.svg diff --git a/ui/assets/image/image_token.slint b/ui/assets/image/image_token.slint new file mode 100644 index 00000000..dabab6a4 --- /dev/null +++ b/ui/assets/image/image_token.slint @@ -0,0 +1,131 @@ +struct ImgPair { + light: image, + dark: image, +} + +struct EventoIconCollection { + evento: image, + sast_link: image, + home: image, +} + +struct EventoDisplayCollection { + evento: image, + avatar: [image], + event: { + default: [image], + union: [image], + + cpp: [image], + csharp: [image], + frontend: [image], + backend: [image], + game: [image], + lambda: [image], + python: [image], + }, + no_image: image, +} + +struct EventoImageCollection { + icon: EventoIconCollection, + display: EventoDisplayCollection, +} + +export global EventoImageToken { + out property image:{ + icon: icon, + display: display, + }; + // + // TODO(theme): link icon change to darkmode with theme system, replace TO_REPLACE + pure function switcher(is-light: bool, img: ImgPair) -> image { + return is-light ? img.light : img.dark; + } + property TO_REPLACE: true; + // + // icon used as small image in button, navbar and so on + // icon will change according to darkmode switch + property icon:{ + // Product specific + evento: switcher(TO_REPLACE,{ + light: @image-url("./icon/evento.png"), + // TODO(resource): no evento_dark provided, use light temporarily + dark: @image-url("./icon/evento.svg"), + }), + sast_link: switcher(TO_REPLACE,{ + light: @image-url("./icon/sast_link.svg"), + // TODO(resource): no sast_link_dark provided, use light temporarily + dark: @image-url("./icon/sast_link.svg"), + }), + // General usage + home: switcher(TO_REPLACE,{ + light: @image-url("./icon/home.svg"), + dark: @image-url("./icon/home_dark.svg"), + }), + }; + // display used as images bigger than icon + // most display image won't change according to darkmode switch + property display:{ + // Product specific + evento: switcher(TO_REPLACE,{ + light: @image-url("./display/evento/evento.png"), + dark: @image-url("./display/evento/evento_dark.png"), + }), + // Other + avatar: [ + @image-url("./display/avatar/avatar_1.svg"), + @image-url("./display/avatar/avatar_2.svg"), + @image-url("./display/avatar/avatar_3.svg"), + @image-url("./display/avatar/avatar_4.svg"), + @image-url("./display/avatar/avatar_5.svg"), + @image-url("./display/avatar/avatar_6.svg"), + @image-url("./display/avatar/avatar_7.svg"), + @image-url("./display/avatar/avatar_8.svg"), + @image-url("./display/avatar/avatar_9.svg"), + @image-url("./display/avatar/avatar_10.svg"), + @image-url("./display/avatar/avatar_11.svg"), + @image-url("./display/avatar/avatar_12.svg"), + ], + event: { + default: [ + @image-url("./display/event/default_1.png"), + @image-url("./display/event/default_2.png"), + @image-url("./display/event/default_3.png"), + ], + union: [ + @image-url("./display/event/union_1.png"), + @image-url("./display/event/union_2.png"), + ], + cpp: [ + @image-url("./display/event/cpp_1.svg"), + @image-url("./display/event/cpp_2.png"), + @image-url("./display/event/cpp_3.png"), + ], + csharp: [ + @image-url("./display/event/csharp_1.png"), + ], + frontend: [ + @image-url("./display/event/frontend_1.png"), + @image-url("./display/event/frontend_2.png"), + @image-url("./display/event/frontend_3.png"), + ], + backend: [ + @image-url("./display/event/backend_1.png"), + ], + game: [ + @image-url("./display/event/game_1.svg"), + @image-url("./display/event/game_2.jpg"), + @image-url("./display/event/game_3.jpg"), + ], + lambda: [ + @image-url("./display/event/lambda_1.png"), + @image-url("./display/event/lambda_2.png"), + ], + python: [ + @image-url("./display/event/python_1.png"), + ], + }, + no_image: @image-url("./display/no_image.png") + }; +} diff --git a/ui/assets/image/unspecific/SRD_lesson_pic_bg.jpg b/ui/assets/image/unspecific/SRD_lesson_pic_bg.jpg new file mode 100644 index 00000000..032d0579 Binary files /dev/null and b/ui/assets/image/unspecific/SRD_lesson_pic_bg.jpg differ diff --git a/ui/assets/index.slint b/ui/assets/index.slint new file mode 100644 index 00000000..08b7f74c --- /dev/null +++ b/ui/assets/index.slint @@ -0,0 +1 @@ +export { EventoImageToken } from "./image/image_token.slint"; \ No newline at end of file diff --git a/ui/global.slint b/ui/global.slint index 34560e92..548a2dfa 100644 --- a/ui/global.slint +++ b/ui/global.slint @@ -1,7 +1,12 @@ -//! global styles +import { EventoImageToken } from "./assets/index.slint"; + export global ROOT_GLOBAL { - in-out property window-height : 760px; - in-out property window-width : 1340px; - in-out property font-size : 16px; - in-out property padding : 0px; -} \ No newline at end of file + in-out property window-height: 760px; + in-out property window-width: 1340px; + in-out property font-size: 16px; + in-out property padding: 0px; +} + +export global Token { + out property image <=> EventoImageToken.image; +} diff --git a/ui/views/main.slint b/ui/views/main.slint index 507c7862..623b056f 100644 --- a/ui/views/main.slint +++ b/ui/views/main.slint @@ -1,5 +1,5 @@ -import { Hello } from "../components/index.slint"; import { SText, SButton } from "../modules/surrealism-ui/index.slint"; +import { Token } from "../global.slint"; export component MainView { callback startLink <=> link-button.clicked; @@ -7,7 +7,7 @@ export component MainView { evento-image := Image { height: 240px; width: 700px; - source: @image-url("../assets/evento_black.png"); + source: Token.image.display.evento; } link-button := SButton { @@ -19,7 +19,7 @@ export component MainView { theme: Dark; border-radius: 12px; show-icon: true; - icon: @image-url("../assets/sast_link.svg"); + icon: Token.image.icon.sast-link; } visitor-button := SButton {