Merge pull request Hexlet#303 from shamshaev/improve-ux-no-workspace

Improve UX without workspace
shamshaev · Oct 8, 2024 · 43e3e71 · 43e3e71
2 parents 5780315 + 7304bc3
commit 43e3e71
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 0 deletions.
diff --git a/src/main/resources/messages_en.properties b/src/main/resources/messages_en.properties
@@ -51,6 +51,11 @@ navbar.signup=Sign Up
 navbar.create-workspace=Create Workspace
 navbar.account-info=Account Info
 
+text.hero-header=Everything you need in
+text.hero-highlight=one place
+text.hero-description=Create your workspace to manage everything regarding typos: add sites (URLs) from which reports can be sent to the workspace, see and manage received typo statistics, add users to the workspace and more
+btn.get-started=Get started
+
 acc-info.card-title.general=General
 acc-info.card-title.workspaces=Workspaces
 

diff --git a/src/main/resources/messages_ru.properties b/src/main/resources/messages_ru.properties
@@ -57,6 +57,11 @@ navbar.signup=Регистрация
 navbar.account-info=Информация об аккаунте
 navbar.create-workspace=Создать Пространство
 
+text.hero-header=Все что вам нужно в
+text.hero-highlight=одном месте
+text.hero-description=Создайте свое рабочее пространство, чтобы управлять всем связанным с опечатками: добавлять сайты (URLs) с которых отчеты могут отправляться в пространство, видеть и управлять статистикой полученных опечаток, добавлять пользователей в рабочее пространство и многое другое
+btn.get-started=Начать
+
 acc-info.wks.url=URL пространства
 acc-info.wks.name=Имя пространства
 acc-info.wks.role=Роль

diff --git a/src/main/resources/templates/workspaces.html b/src/main/resources/templates/workspaces.html
@@ -4,6 +4,22 @@
 <body style="padding-top: 4.5rem">
 <nav th:replace="~{fragments/panels :: mainNavbarTop}"></nav>
 <main class="container">
+    <div th:if="${#lists.isEmpty(wksInfoList)}">
+        <div class="container-fluid px-4 py-5 my-5 text-center">
+            <div class="lc-block mb-4">
+                <h2 class="display-4 fw-bold" th:inline="text">
+                    [[#{text.hero-header}]]
+                    <span class="text-primary" th:text="#{text.hero-highlight}" />
+                </h2>
+            </div>
+            <div class="lc-block col-lg-6 mx-auto mb-5">
+                <p class="lead" th:text="#{text.hero-description}"></p>
+            </div>
+            <div class="lc-block d-grid gap-2 d-sm-flex justify-content-sm-center mb-5">
+                <a class="btn btn-primary btn-lg px-4 gap-3 mx-2" th:href="@{/workspace}" th:text="#{btn.get-started}" role="button"></a>
+            </div>
+        </div>
+    </div>
     <div class="row row-cols-1 row-cols-md-3 g-4">
         <div class="col" th:each="wksInfo : ${wksInfoList}" th:object="${wksInfo}">
             <div class="card h-100">