From 9dcb776d00e14f189a605d84b28aa7ee1ebd6e64 Mon Sep 17 00:00:00 2001 From: Julia Miocene Date: Thu, 1 Jun 2023 13:32:17 +0200 Subject: [PATCH 1/4] Update the web ide loader page --- .../page_bundles/web_ide_loader.scss | 34 +++++++++++++++++++ app/views/ide/_show.html.haml | 3 +- app/views/shared/_ide_root.html.haml | 9 +++-- config/application.rb | 1 + 4 files changed, 41 insertions(+), 6 deletions(-) create mode 100644 app/assets/stylesheets/page_bundles/web_ide_loader.scss diff --git a/app/assets/stylesheets/page_bundles/web_ide_loader.scss b/app/assets/stylesheets/page_bundles/web_ide_loader.scss new file mode 100644 index 00000000000000..0739717172587a --- /dev/null +++ b/app/assets/stylesheets/page_bundles/web_ide_loader.scss @@ -0,0 +1,34 @@ +.web-ide-loader { + max-width: 400px; +} +.web-ide-loader .tanuki-logo { + width: 50px; + height: 50px; +} + +.web-ide-loader .tanuki, +.web-ide-loader .right-cheek, +.web-ide-loader .chin, +.web-ide-loader .left-cheek { + animation: animate-tanuki 1.5s infinite; +} +.web-ide-loader .right-cheek { + animation-delay: 0.35s; +} +.web-ide-loader .chin { + animation-delay: 0.7s; +} +.web-ide-loader .left-cheek { + animation-delay: 1.05s; +} + +@keyframes animate-tanuki { + 0%, + 50% { + filter: brightness(1) grayscale(0); + } + + 25% { + filter: brightness(1.2) grayscale(0.2); + } +} diff --git a/app/views/ide/_show.html.haml b/app/views/ide/_show.html.haml index eb6d5668807840..4b16c0199ba62c 100644 --- a/app/views/ide/_show.html.haml +++ b/app/views/ide/_show.html.haml @@ -1,4 +1,5 @@ - page_title _("IDE"), @project.full_name +- add_page_specific_style 'page_bundles/web_ide_loader' - unless use_new_web_ide? - add_page_specific_style 'page_bundles/build' @@ -9,4 +10,4 @@ - data = ide_data(project: @project, fork_info: @fork_info, params: params) -= render partial: 'shared/ide_root', locals: { data: data, loading_text: _('Loading the GitLab IDE...') } += render partial: 'shared/ide_root', locals: { data: data, loading_text: _('Loading the GitLab IDE') } diff --git a/app/views/shared/_ide_root.html.haml b/app/views/shared/_ide_root.html.haml index 848ff1e5728ff8..db3e76e188c4df 100644 --- a/app/views/shared/_ide_root.html.haml +++ b/app/views/shared/_ide_root.html.haml @@ -3,9 +3,8 @@ -# Fix for iOS 13+, the height of the page is actually less than -# 100vh because of the presence of the bottom bar -- @body_class = 'gl-max-h-full gl-fixed' -#ide.gl--flex-center.gl-h-full{ data: data } - .gl-text-center - = gl_loading_icon(size: 'md') - %h2.clgray= loading_text +#ide.gl-h-full{ data: data } + .web-ide-loader.gl-display-flex.gl-justify-content-center.gl-align-items-center.gl-flex-direction-column.gl-h-full.gl-mr-auto.gl-ml-auto + = brand_header_logo + %h3.clblack.gl-mt-6= loading_text diff --git a/config/application.rb b/config/application.rb index 5aca9b999a74ab..9764e13082cd92 100644 --- a/config/application.rb +++ b/config/application.rb @@ -336,6 +336,7 @@ class Application < Rails::Application config.assets.precompile << "page_bundles/todos.css" config.assets.precompile << "page_bundles/tree.css" config.assets.precompile << "page_bundles/users.css" + config.assets.precompile << "page_bundles/web_ide_loader.css" config.assets.precompile << "page_bundles/wiki.css" config.assets.precompile << "page_bundles/work_items.css" config.assets.precompile << "page_bundles/xterm.css" -- GitLab From 160081f2c03ec5084da6d6fd210f25ff5a7307d6 Mon Sep 17 00:00:00 2001 From: Julia Miocene Date: Thu, 1 Jun 2023 13:34:33 +0200 Subject: [PATCH 2/4] Fix stylelint --- app/assets/stylesheets/page_bundles/web_ide_loader.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/app/assets/stylesheets/page_bundles/web_ide_loader.scss b/app/assets/stylesheets/page_bundles/web_ide_loader.scss index 0739717172587a..5e6d1b2ca707ea 100644 --- a/app/assets/stylesheets/page_bundles/web_ide_loader.scss +++ b/app/assets/stylesheets/page_bundles/web_ide_loader.scss @@ -12,12 +12,15 @@ .web-ide-loader .left-cheek { animation: animate-tanuki 1.5s infinite; } + .web-ide-loader .right-cheek { animation-delay: 0.35s; } + .web-ide-loader .chin { animation-delay: 0.7s; } + .web-ide-loader .left-cheek { animation-delay: 1.05s; } -- GitLab From 4b598880248fd8af90edf48ba60d310a52e8fa04 Mon Sep 17 00:00:00 2001 From: Julia Miocene Date: Thu, 1 Jun 2023 13:36:00 +0200 Subject: [PATCH 3/4] Fix stylelint --- app/assets/stylesheets/page_bundles/web_ide_loader.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/app/assets/stylesheets/page_bundles/web_ide_loader.scss b/app/assets/stylesheets/page_bundles/web_ide_loader.scss index 5e6d1b2ca707ea..f922cadc235fd1 100644 --- a/app/assets/stylesheets/page_bundles/web_ide_loader.scss +++ b/app/assets/stylesheets/page_bundles/web_ide_loader.scss @@ -1,6 +1,7 @@ .web-ide-loader { max-width: 400px; } + .web-ide-loader .tanuki-logo { width: 50px; height: 50px; -- GitLab From 86c117bf60cd9972d058025199cf20deff8ed398 Mon Sep 17 00:00:00 2001 From: Julia Miocene Date: Thu, 1 Jun 2023 13:55:30 +0200 Subject: [PATCH 4/4] Change gitlab.pot --- locale/gitlab.pot | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/locale/gitlab.pot b/locale/gitlab.pot index 58d24b3ef6817b..b4eb71e4c6638e 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -27158,7 +27158,7 @@ msgstr "" msgid "Loading snippet" msgstr "" -msgid "Loading the GitLab IDE..." +msgid "Loading the GitLab IDE" msgstr "" msgid "Loading, please wait." -- GitLab