positioning of first sortable arrow,fix #1563 (#1579)

* positioning of first sortable arrow, fix #1563
* update changelog

CHANGELOG.md

@@ -35,6 +35,7 @@ All notable changes to this project will be documented in this file. This projec
 
 ### Fixed
 
+- [#1563](https://github.com/luyadev/luya/issues/1563) Adjust position of first sortable arrow as desired.
 - [#1545](https://github.com/luyadev/luya/issues/1545) Adjust position of page version dropdown content on admin edit section. 
 - [#1549](https://github.com/luyadev/luya/issues/1549) Hide version informations for other page types then page content.
 - [#1550](https://github.com/luyadev/luya/issues/1550) Readded option to change the page type in CMS Module.

modules/admin/src/ngrest/plugins/Sortable.php

@@ -23,8 +23,8 @@ class Sortable extends Plugin
  public function renderList($id, $ngModel)
  {
  return [
- $this->createTag('i', 'keyboard_arrow_up', ['ng-init' => '$first ? changeOrder(\''.$this->name.'\', \'+\') : null', 'ng-click' => 'sortableUp($index, item, \''.$this->name.'\')', 'ng-hide' => '$first', 'class' => 'material-icons btn btn-outline-secondary btn-symbol']),
- $this->createTag('i', 'keyboard_arrow_down', ['ng-click' => 'sortableDown($index, item, \''.$this->name.'\')', 'ng-hide' => '$last', 'class' => 'material-icons btn btn-outline-secondary btn-symbol'])
+ $this->createTag('i', 'keyboard_arrow_up', ['ng-init' => '$first ? changeOrder(\''.$this->name.'\', \'+\') : null', 'ng-click' => 'sortableUp($index, item, \''.$this->name.'\')', 'ng-class' => '{\'sortable-up-first\' : $first}', 'class' => 'material-icons btn btn-outline-secondary btn-symbol']),
+ $this->createTag('i', 'keyboard_arrow_down', ['ng-click' => 'sortableDown($index, item, \''.$this->name.'\')', 'ng-class' => '{\'sortable-up-last\' : $last}', 'class' => 'material-icons btn btn-outline-secondary btn-symbol'])
  ];
  }
 

modules/admin/src/resources/scss/admin.scss

@@ -119,6 +119,7 @@
 @import "components/material-icons";
 @import "components/modal";
 @import "components/modulenav";
+@import "components/sortable";
 @import "components/switch";
 @import "components/tab";
 @import "components/nav";

modules/admin/src/resources/scss/components/_sortable.scss

@@ -0,0 +1,7 @@
+.sortable-up-first {
+ visibility: hidden;
+}
+
+.sortable-up-last {
+ visibility: hidden;
+}