style: Moved and minified tree-add-btn

lib/RoadizCoreBundle/src/Entity/NodesSources.php

@@ -210,10 +210,7 @@ public function __construct(Node $node, TranslationInterface $translation)
         $this->redirections = new ArrayCollection();
     }
 
-    /**
-     * @inheritDoc
-     * @Serializer\Exclude
-     */
+    #[Serializer\Exclude]
     public function injectObjectManager(ObjectManager $objectManager): void
     {
         $this->objectManager = $objectManager;

lib/Rozier/src/Resources/app/less/widgets/nestable.less

@@ -24,37 +24,26 @@
     position: relative;
 }
 
-.tree-btn-add{
-    position: relative;
-    display: block;
-    width: 100%; height:40px;
-    font-size: @default-font-size; line-height:42px;
-    color:#666666;
-    border-bottom: 1px dashed var(--global-border-color);
-    margin:0 0 0;
-    padding-left: 23px;
-    text-align: left;
-    background: #D0D0D0;
-    .box-sizing();
-    transition: ~'background ease 0.35s, color ease 0.35s';
-
-    &:after{
-        position: absolute;
-        content:'';
-        left:0; right:0; bottom:-4px;
-        height:1px;
-        border-top:1px dashed lighten(#b5b5b5, 15%);
-    }
+.tree-btn-add {
+    position: absolute;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height:32px;
+    top: 24px;
+    right: 20px;
+    font-size: @default-font-size;
+    margin: 0 0 0;
+    opacity: 0.6;
 
-    .uk-icon-rz-plus-simple{
+    .uk-icon-rz-plus-simple {
         font-size:16px;
-        margin:-3px 5px 0 0;
+        margin: 0;
     }
 
-    &:hover{
-        color:@item-color-name-color-hover;
-        text-decoration: none;
-        background: #C9C9C9;
+    &:hover, &:focus {
+        opacity: 1;
     }
 }
 

lib/Rozier/src/Resources/views/partials/js-inject.html.twig

@@ -1,5 +1,5 @@
 
-<script src="{{ asset('js/vendor.3cbc4c47fc763899b1a0.js', 'Rozier') }}" defer type="text/javascript"></script>
+<script src="{{ asset('js/vendor.e61f574696a873492b95.js', 'Rozier') }}" defer type="text/javascript"></script>
 
-<script src="{{ asset('js/app.3cbc4c47fc763899b1a0.js', 'Rozier') }}" defer type="text/javascript"></script>
+<script src="{{ asset('js/app.e61f574696a873492b95.js', 'Rozier') }}" defer type="text/javascript"></script>
 

lib/Rozier/src/Resources/views/partials/simple-js-inject.html.twig

@@ -1,3 +1,3 @@
 
-<script src="{{ asset('js/simple.3cbc4c47fc763899b1a0.js', 'Rozier') }}" defer type="text/javascript"></script>
+<script src="{{ asset('js/simple.e61f574696a873492b95.js', 'Rozier') }}" defer type="text/javascript"></script>
 

lib/Rozier/src/Resources/views/widgets/folderTree/folderTree.html.twig

@@ -5,14 +5,20 @@
             <div class="tree-head foldertree-head">
                 <h4>{% trans %}folderTree{% endtrans %}</h4>
                 {% if folderTree.getRootFolder == null %}
-                <a href="{{ path('foldersAddPage') }}" class="tree-btn-add" id="foldertree-btn-add">
-                    <i class="uk-icon-rz-plus-simple"></i>{% trans %}add.a.folder{% endtrans %}
+                <a href="{{ path('foldersAddPage') }}"
+                   data-uk-tooltip="{animation:true}"
+                   title="{% trans %}add.a.folder{% endtrans %}"
+                   class="uk-button tree-btn-add"
+                   id="foldertree-btn-add">
+                    <i class="uk-icon-rz-plus-simple"></i>
                 </a>
                 {% else %}
                 <a href="{{ path('foldersAddChildPage', { folderId : folderTree.rootFolder.id }) }}"
-                   class="tree-btn-add"
+                   class="uk-button tree-btn-add"
+                   data-uk-tooltip="{animation:true}"
+                   title="{% trans %}add.child.folder{% endtrans %}"
                    id="foldertree-btn-add">
-                    <i class="uk-icon-rz-plus-simple"></i>{% trans %}add.child.folder{% endtrans %}
+                    <i class="uk-icon-rz-plus-simple"></i>
                 </a>
                 {% endif %}
             </div>

lib/Rozier/src/Resources/views/widgets/nodeTree/nodeStackTree.html.twig

@@ -6,7 +6,7 @@
                     <input type="hidden" name="nodeTypeId" value="{{ nodeType.id }}">
                     <input type="hidden" name="parentNodeId" value="{{ node.id }}">
                     <input type="hidden" name="pushTop" value="1">
-                    <button class="tree-btn-add rz-no-ajax-link"
+                    <button class="uk-button tree-btn-add rz-no-ajax-link"
                        id="nodetree-btn-add"
                        type="submit"><i class="uk-icon-rz-plus-simple"></i> {{ "add.a.%nodeType%"|trans({'%nodeType%': nodeType.getDisplayName}) -}}</button>
                 </form>

lib/Rozier/src/Resources/views/widgets/nodeTree/nodeTree.html.twig

@@ -13,12 +13,16 @@
                 </h4>
                 {% if not nodeTree.rootNode %}
                     <a href="{{ path('nodesAddChildPage') }}"
-                       class="tree-btn-add"
-                       id="nodetree-btn-add"><i class="uk-icon-rz-plus-simple"></i>{% trans %}add.a.node{% endtrans %}</a>
+                       data-uk-tooltip="{animation:true}"
+                       title="{% trans %}add.a.node{% endtrans %}"
+                       class="uk-button tree-btn-add"
+                       id="nodetree-btn-add"><i class="uk-icon-rz-plus-simple"></i></a>
                 {% else %}
                     <a href="{{ path('nodesAddChildPage', { nodeId : nodeTree.rootNode.id }) }}"
-                       class="tree-btn-add"
-                       id="nodetree-btn-add"><i class="uk-icon-rz-plus-simple"></i>{% trans %}add.child.node{% endtrans %}</a>
+                       data-uk-tooltip="{animation:true}"
+                       title="{% trans %}add.child.node{% endtrans %}"
+                       class="uk-button tree-btn-add"
+                       id="nodetree-btn-add"><i class="uk-icon-rz-plus-simple"></i></a>
                 {% endif %}
             </div>
         {% endif %}

lib/Rozier/src/Resources/views/widgets/tagTree/tagTree.html.twig

@@ -5,9 +5,19 @@
         <div class="tree-head tagtree-head">
             <h4>{% trans %}tagTree{% endtrans %}</h4>
             {% if tagTree.getRootTag == null %}
-            <a href="{{ path('tagsAddPage') }}" class="tree-btn-add" id="tagtree-btn-add"><i class="uk-icon-rz-plus-simple"></i>{% trans %}add.a.tag{% endtrans %}</a>
+            <a href="{{ path('tagsAddPage') }}"
+               title="{% trans %}add.a.tag{% endtrans %}"
+               data-uk-tooltip="{animation:true}"
+               class="uk-button tree-btn-add"
+               id="tagtree-btn-add"
+            ><i class="uk-icon-rz-plus-simple"></i></a>
             {% else %}
-            <a href="{{ path('tagsAddChildPage', { tagId : tagTree.getRootTag.getId }) }}" class="tree-btn-add" id="tagtree-btn-add"><i class="uk-icon-rz-plus-simple"></i>{% trans %}add.a.child.tag{% endtrans %}</a>
+            <a href="{{ path('tagsAddChildPage', { tagId : tagTree.getRootTag.getId }) }}"
+               title="{% trans %}add.a.child.tag{% endtrans %}"
+               data-uk-tooltip="{animation:true}"
+               class="uk-button tree-btn-add"
+               id="tagtree-btn-add"
+            ><i class="uk-icon-rz-plus-simple"></i></a>
             {% endif %}
         </div>
     {% endif %}