LDBR-2.25: Добавить фавиконы, поправить верстку. (#32)

public/assets/icons/favicons/site.webmanifest

@@ -0,0 +1,17 @@
+{
+    "name":"Brrrello",
+    "short_name":"Brr...",
+    "icons":[
+        {
+            "src":"/android-chrome-192x192.png",
+            "sizes":"192x192","type":"image/png"
+        },
+        {
+            "src":"/android-chrome-512x512.png",
+            "sizes":"512x512","type":"image/png"
+        }
+    ],
+    "theme_color":"#ffffff",
+    "background_color":"#ffffff",
+    "display":"standalone"
+}

robots.txt

@@ -0,0 +1,3 @@
+User-agent: *
+Crawl-delay: 1
+Host: http://95.163.213.142/

src/components/Card/Card.scss

@@ -34,6 +34,8 @@ $card-due-date-done: forestgreen;
 
   &__title {
     display: inline;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 }
 

src/components/CardList/CardList.scss

@@ -38,7 +38,8 @@ $scrollbar-width: 1600px;
     &__title {
         font-size: 20px;
         margin-right: auto;
-
+        overflow: hidden;
+        text-overflow: ellipsis;
     }
 
     span:empty {

src/components/Footer/Footer.scss

@@ -1,9 +1,13 @@
+@import '../../styles/scss/Constants';
+@import '../../styles/scss/Fonts';
+@import '../../styles/scss/Common';
+
 /* Таблица стилей для компонента footer */
 
 .footer {
     position: fixed;
     height: 50px;
-    background-color: #005f73;
+    background-color: $main-theme-secondary-color;
     bottom: 0;
     left: 0;
     right: 0;
@@ -14,8 +18,8 @@
 
 
     &__text {
-        color: azure;
-        font-family: 'IBM Plex Sans', sans-serif;
+        color: rgb(255, 255, 255);
+        font-family: 'Montserrat', sans-serif;
         text-align: center;
     }
 }

src/components/Navbar/Navbar.scss

@@ -1,20 +1,23 @@
+@import '../../styles/scss/Constants';
+@import '../../styles/scss/Fonts';
+@import '../../styles/scss/Common';
+
 /* navbar style */
 
 .navbar__wrapper {
-    background-color: #258085;
+    background-color: $main-theme-color;
     border-bottom: 1px solid #C3C3C3;
     user-select: none;
 }
 
 .navbar {
-    z-index: 5;
     height: 56px;
     max-width: 1680px;
     position: relative;
-    background-color: #258085;
+    background-color: $main-theme-color;
 
     margin: 0 auto;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-family: 'Montserrat', sans-serif;
 }
 
 .navbar__header {
@@ -29,20 +32,20 @@
 }
 
 .navbar__link__title {
-    color: #ffffff;
+    color: rgb(255, 255, 255);
     text-decoration: none;
 }
 
 .navbar__links {
-    display: inline;
+    display: block;
     float: right;
     font-size: 18px;
 }
 
 .navbar__link {
     display: inline-block;
-    padding: 16px 10px;
-    color: #e5e9f5;
+    padding: 18px 12px;
+    color: rgb(255, 255, 255);
     text-decoration: none;
     cursor: pointer;
 }

src/index_template.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
 
-    <meta http-equiv="Content-Security-Policy" content="default-src 'self' <%= htmlWebpackPlugin.options.backend %> blob: ws:; style-src 'self'; font-src 'self'; object-src 'none'; script-src 'self' 'unsafe-eval' https://storage.googleapis.com/workbox-cdn">
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self' <%= htmlWebpackPlugin.options.backend %> blob: ws:; style-src 'self'; font-src 'self'; object-src 'none'; script-src 'self'">
 
     <!-- for super modern broswers - coloring browser header -->
     <meta name="theme-color" content="#258085">
@@ -15,8 +15,14 @@
     <meta name="Keywords" content="Trello, Трелло, Brrrello, Брррелло">
     <meta name="geo.region" content="RU">
     <meta name="geo.placename" content="Moscow">
+    <meta name="description" content="Brrrello — это сервис для командной работы, позволяющий планировать и публиковать текущие задачи, систематизировать их и следить за их исполнением.">
 
     <title>Brrrello</title>
+
+    <link rel="apple-touch-icon" sizes="180x180" href="/assets/icons/favicons/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="/assets/icons/favicons/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="/assets/icons/favicons/favicon-16x16.png">
+    <link rel="manifest" href="/assets/icons/favicons/site.webmanifest">
 </head>
 
 <body>

src/styles/scss/CardListPopup.scss

@@ -13,7 +13,7 @@
 .popup {
     z-index: 10;
     position: absolute;
-    background: #ffffff;
+    background: rgb(255, 255, 255);
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);

src/styles/scss/CardPopup.scss

@@ -13,7 +13,7 @@
 .popup {
     z-index: 10;
     position: absolute;
-    background: #ffffff;
+    background: rgb(255, 255, 255);
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);

src/styles/scss/Constants.scss

@@ -4,6 +4,7 @@ $tertiary-bg-color: rgb(170, 201, 208);
 
 $main-theme-color: rgb(37, 128, 133);
 $main-theme-color__focus: rgb(77, 156, 245);
+$main-theme-secondary-color: rgb(0, 95, 115);
 
 $transparent-bg-color: rgba(255, 255, 255, 0.3);
 $default-box-shadow-color: rgba(0, 0, 0, 0.2);

src/views/BoardsView/BoardsView.scss

@@ -29,6 +29,8 @@ $team-font-size: 25px;
     &__header {
         padding-bottom: 1px;
         font-size: $card-header-font-size;
+        overflow: hidden;
+        text-overflow: ellipsis;
         border-bottom: dotted 1px;
     }
 

src/views/ProfileView/ProfileView.scss

@@ -129,7 +129,7 @@ body {
 /* внешняя обертка под поля регистрации */
 .profile__input__wrapper {
     position: relative;
-    margin: 2.4em 0 1.5em 1.5em;
+    margin: 2.4em 0 1.5em;
 }
 
 /* заголовок поля регистрации  */