From 26b6527e26675679f7e7188aa282d1250636afb7 Mon Sep 17 00:00:00 2001
From: Julia Radzhabova <Julia.Radzhabova@onlyoffice.com>
Date: Fri, 28 Apr 2017 13:44:03 +0300
Subject: [PATCH] [DE][PE] Refactoring header, toolbar

---
 apps/common/main/lib/view/Header.js                    |  2 +-
 apps/common/main/resources/less/header.less            |  5 +++++
 apps/common/main/resources/less/toolbar.less           | 10 ++++++++--
 apps/documenteditor/main/app/template/Toolbar.template |  4 ++--
 .../main/app/template/Toolbar.template                 |  4 ++--
 5 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js
index 258164433..f82f802d8 100644
--- a/apps/common/main/lib/view/Header.js
+++ b/apps/common/main/lib/view/Header.js
@@ -71,7 +71,7 @@ define([
 
         var templateRightBox = '<section>' +
                             '<label id="rib-doc-name" class="status-label"></label>' +
-                            '<a href="#" id="rib-save-status" class="status-label locked"><%= textSaveEnd %></a>' +
+                            '<a id="rib-save-status" class="status-label locked"><%= textSaveEnd %></a>' +
                             '<div class="elset">' +
                                 // '<span class="btn-slot text" id="slot-btn-users"></span>' +
                                 '<section id="tlb-box-users" class="box-cousers dropdown"">' +
diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less
index 52cbd59d2..5ed84fc06 100644
--- a/apps/common/main/resources/less/header.less
+++ b/apps/common/main/resources/less/header.less
@@ -53,9 +53,14 @@
 
     #rib-doc-name {
         flex-grow: 1;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        min-width: 50px;
     }
 
     #rib-save-status {
+        white-space: nowrap;
         &.locked {
             text-decoration: none;
             color: @gray-darker;
diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less
index 0df58d09b..0e8e0248c 100644
--- a/apps/common/main/resources/less/toolbar.less
+++ b/apps/common/main/resources/less/toolbar.less
@@ -49,6 +49,7 @@
       width: 100%;
       border-top: 1px solid @gray-dark;
       top: @height-tabs - 1;
+      z-index: 1;
     }
   }
 
@@ -122,12 +123,17 @@
       min-width: 20px;
       text-align: center;
       z-index: 1;
+      cursor: pointer;
+
+      &:hover {
+        text-decoration: none;
+      }
 
       &.left{
-        box-shadow: 5px 0 20px 5px rgba(208, 221, 182, .8)
+        box-shadow: 5px 0 20px 5px rgba(255, 255, 255, .8)
       }
       &.right{
-        box-shadow: -5px 0 20px 5px rgba(208, 221, 182, .8)
+        box-shadow: -5px 0 20px 5px rgba(255, 255, 255, .8)
       }
     }
   }
diff --git a/apps/documenteditor/main/app/template/Toolbar.template b/apps/documenteditor/main/app/template/Toolbar.template
index fc4807ce3..5966eb202 100644
--- a/apps/documenteditor/main/app/template/Toolbar.template
+++ b/apps/documenteditor/main/app/template/Toolbar.template
@@ -2,7 +2,7 @@
     <div class="box-tabs">
         <div class="extra left"></div>
         <section class="tabs">
-            <a href="#" class="scroll left">
+            <a class="scroll left">
                 <i class="icon">&lt;</i>
             </a>
             <ul>
@@ -13,7 +13,7 @@
                 <% } %>
                 <div class="marker"></div>
             </ul>
-            <a href="#" class="scroll right">
+            <a class="scroll right">
                 <i class="icon">&gt;</i>
             </a>
         </section>
diff --git a/apps/presentationeditor/main/app/template/Toolbar.template b/apps/presentationeditor/main/app/template/Toolbar.template
index ab54e7b4a..63d153ba3 100644
--- a/apps/presentationeditor/main/app/template/Toolbar.template
+++ b/apps/presentationeditor/main/app/template/Toolbar.template
@@ -2,7 +2,7 @@
     <section class="box-tabs">
         <div class="extra left"></div>
         <section class="tabs">
-            <a href="#" class="scroll left">
+            <a class="scroll left">
                 <i class="icon">&lt;</i>
             </a>
             <ul>
@@ -13,7 +13,7 @@
                 <% } %>
                 <div class="marker"></div>
             </ul>
-            <a href="#" class="scroll right">
+            <a class="scroll right">
                 <i class="icon">&gt;</i>
             </a>
         </section>