ActionBar: normale Link-Elemente nun doch als DIVs rendern & als Buttons stylen

diff --git a/SL/Layout/ActionBar/Link.pm b/SL/Layout/ActionBar/Link.pm
index 49243de..8eb8906 100644 (file)
--- a/SL/Layout/ActionBar/Link.pm
+++ b/SL/Layout/ActionBar/Link.pm
@@ -14,10 +14,9 @@ sub render {
   my ($self) = @_;
 
   return $self->p->html_tag(
-    'a', $self->text,
-    %{ $self->params // {} },
+    'div', $self->text,
     id    => $self->id,
-    class => 'layout-actionbar-link',
+    class => 'layout-actionbar-action layout-actionbar-link',
   );
 }
 

diff --git a/css/common.css b/css/common.css
index 1f1dfcb..7355dc9 100644 (file)
--- a/css/common.css
+++ b/css/common.css
@@ -109,8 +109,10 @@ div.layout-actionbar-separator {
   width: 20px;
 }
 
+div.layout-actionbar div.layout-actionbar-link,
 div.layout-actionbar div.layout-actionbar-submit,
 div.layout-actionbar div.layout-actionbar-scriptbutton,
+div.layout-actionbar div.layout-actionbar-link:focus,
 div.layout-actionbar div.layout-actionbar-submit:focus,
 div.layout-actionbar div.layout-actionbar-scriptbutton:focus {
   display: inline-block;
@@ -123,18 +125,13 @@ div.layout-actionbar div.layout-actionbar-scriptbutton:focus {
   cursor: default;
 }
 
+div.layout-actionbar div.layout-actionbar-link:hover,
 div.layout-actionbar div.layout-actionbar-submit:hover,
 div.layout-actionbar div.layout-actionbar-scriptbutton:hover {
   border: 1px;
   border-style: solid;
 }
 
-div.layout-actionbar .layout-actionbar-link {
-  margin-left: 6px;
-  margin-right: 6px;
-  cursor: default;
-}
-
 div.layout-actionbar-combobox {
   position: relative;
   display: inline-block;

diff --git a/css/kivitendo/main.css b/css/kivitendo/main.css
index a4ef71f..ca94491 100644 (file)
--- a/css/kivitendo/main.css
+++ b/css/kivitendo/main.css
@@ -534,14 +534,17 @@ div.layout-actionbar {
   background-color: white;
 }
 
+div.layout-actionbar div.layout-actionbar-link,
 div.layout-actionbar div.layout-actionbar-submit,
 div.layout-actionbar div.layout-actionbar-scriptbutton,
+div.layout-actionbar div.layout-actionbar-link:focus,
 div.layout-actionbar div.layout-actionbar-submit:focus,
 div.layout-actionbar div.layout-actionbar-scriptbutton:focus {
   border-color: darkgray;
   background-color: whitesmoke;
 }
 
+div.layout-actionbar div.layout-actionbar-link:hover,
 div.layout-actionbar div.layout-actionbar-submit:hover,
 div.layout-actionbar div.layout-actionbar-scriptbutton:hover {
   color: #FE5F14;

diff --git a/css/lx-office-erp/main.css b/css/lx-office-erp/main.css
index 1615de6..51763ce 100644 (file)
--- a/css/lx-office-erp/main.css
+++ b/css/lx-office-erp/main.css
@@ -536,8 +536,10 @@ div.layout-actionbar {
   background-color: #d0cfc9;
 }
 
+div.layout-actionbar div.layout-actionbar-link,
 div.layout-actionbar div.layout-actionbar-submit,
 div.layout-actionbar div.layout-actionbar-scriptbutton,
+div.layout-actionbar div.layout-actionbar-link:focus,
 div.layout-actionbar div.layout-actionbar-submit:focus,
 div.layout-actionbar div.layout-actionbar-scriptbutton:focus {
   border-color: darkgray;
@@ -547,6 +549,7 @@ div.layout-actionbar div.layout-actionbar-scriptbutton:focus {
   border-radius: 2px;
 }
 
+div.layout-actionbar div.layout-actionbar-link:hover,
 div.layout-actionbar div.layout-actionbar-submit:hover,
 div.layout-actionbar div.layout-actionbar-scriptbutton:hover {
   background-color: lightgray;

diff --git a/js/kivi.ActionBar.js b/js/kivi.ActionBar.js
index cda1935..1d90bd6 100644 (file)
--- a/js/kivi.ActionBar.js
+++ b/js/kivi.ActionBar.js
@@ -129,7 +129,7 @@ namespace('kivi', function(k){
       $(e).tooltipster({ content: data.tooltip, theme: 'tooltipster-light' });
     }
 
-    if (data.call || data.submit) {
+    if (data.call || data.submit || data.link) {
       $(e).click(function(event) {
         var $hidden, key, func, check;
         if ($(e).hasClass(CLASSES.disabled)) {
@@ -160,6 +160,9 @@ namespace('kivi', function(k){
           }
           $(form).submit();
         }
+        if (data.link) {
+          window.location.href = data.link;
+        }
       });
     }
   };