user interface: front page and header

rero_ils/modules/items/templates/rero_ils/detailed_view_items.html

@@ -92,7 +92,7 @@ <h4 class="mb-0 col-xs-12 col-sm-10 offset-sm-2 col-md-11 offset-md-1">{{ _('Bor
                     {% set patron_name = patron.first_name + ' ' + patron.last_name + ' - ' + patron.barcode %}
                     <tr>
                       <td>
-                        <a href="{{ url_for('circulation.index') + 'checkinout?patron=' + patron.get('barcode')}}">{{ patron_name }}</a>
+                        <a href="{{ url_for('circulation.index', path='checkinout', patron=patron.get('barcode')) }}">{{ patron_name }}</ a>
                       </td>
                       <td>
                         {{ holding.end_date|format_date(
@@ -137,7 +137,7 @@ <h4 class="mb-0 col-xs-12 col-sm-10 offset-sm-2 col-md-11 offset-md-1">{{ _('Pen
                       <tr>
                         <td>
                           {% if patron %}
-                            <a href="{{ url_for('circulation.index') + 'checkinout?patron=' + patron.get('barcode')}}">{{ patron_name }}</a>
+                            <a href="{{ url_for('circulation.index', path='checkinout', patron=patron.get('barcode')) }}">{{ patron_name }}</a>
                           {% else %}
                             {{ _('No patron found!') }}
                           {% endif %}

rero_ils/permissions.py

@@ -82,6 +82,7 @@ def can(self):
         'Circulation',
         'Circulation Settings',
         'Libraries',
+        'Items',
         'My Library'] \
        or admin_view.category in [
             'Catalogue',

rero_ils/static/scss/rero_ils/frontpage.scss

@@ -8,14 +8,15 @@
  */
 
  .rero-ils-frontpage {
-  height: 70vh;
+  height: 45vh;
   background-image: url(#{$static-images}/homepage_image_bleu.jpg);
   background-size: cover;
+  background-position: center;
   form {
     margin: 0 auto;
     width: 80%;
   }
-  @include media-breakpoint-down(md) {
+  @include media-breakpoint-down(xs) {
     height: 60vh;
   }
 }

rero_ils/templates/rero_ils/frontpage.html

@@ -13,19 +13,19 @@
 {%- block page_body %}
 <div class="flex-grow-1">
 {%- block body %}
-  <header class="rero-ils-frontpage d-flex flex-column justify-content-end text-white">
-    <header class="container text-center pb-2 pb-lg-4">
+  <header class="rero-ils-frontpage d-flex flex-column justify-content-between text-white pt-4">
+    <header class="container text-center mt-4">
       <h1>{{ _('Get into your library') }}</h1>
       <h2>{{ _('A wealth of knowledge just a click away') }}</h2>
     </header>
-    <div class="container d-none d-md-block pt-2 pt-lg-4">
+    <div class="container d-none d-md-block">
     <search-autocomplete placeholder="{{ _('What\'s on your mind?') }}" action="{{config.THEME_SEARCH_ENDPOINT}}" size="large"></search-autocomplete>
     </div>
-    <div class="container d-block d-md-none pt-2 pt-lg-4">
+    <div class="container d-block d-md-none">
       <search-autocomplete placeholder="{{ _('What\'s on your mind?') }}" action="{{config.THEME_SEARCH_ENDPOINT}}"></search-autocomplete>
     </div>
     <app-root></app-root>
-    <footer class="text-center bg-danger text-white mt-4">
+    <footer class="text-center bg-danger text-white">
       <p class="py-2 mb-0">
         {{ _('Software under development') }}
       </p>

rero_ils/templates/rero_ils/header.html

@@ -28,7 +28,7 @@
                 <div class="input-group input-group-sm w-100">
                   <input class="form-control" type="search" name="q" placeholder="{{_('Search')}}" aria-label="Search" aria-describedby="button-search">
                   <div class="input-group-append">
-                    <button class="btn btn-outline-secondary" type="submit" id="button-search"><i class="fa fa-search"></i></button>
+                    <button class="btn btn-light" type="submit" id="button-search"><i class="fa fa-search"></i></button>
                   </div>
                 </div>
               </form>

ui/src/app/autocomplete/autocomplete.component.html

@@ -2,7 +2,7 @@
   <span *ngIf="model.index === 'persons'"><i  class="fa fa-user" aria-hidden="true"></i>&nbsp;</span>
   <span [innerHtml]="model.text"></span>
 </ng-template>
-<form #form class="input-group" action="{{ action }}"
+<form #form class="rero-ils-autocomplete input-group" action="{{ action }}"
       [ngClass]="{'input-group-lg': size === 'large', 'input-group-sm': size === 'small'}"
       role="search" autocomplete="off">
 

ui/src/app/autocomplete/autocomplete.component.scss

@@ -1 +1,6 @@
-
+.rero-ils-autocomplete {
+  button {
+    border-top-right-radius: .25em !important;
+    border-bottom-right-radius: .25em !important;
+  }
+}

ui/src/app/records/editor/editor.component.html

@@ -1,5 +1,5 @@
   <header class="d-flex mb-4">
-    <h3 class="mb-0 mr-4">{{ recordType | translate }}: <span translate>editor</span></h3>
+    <h3 class="mb-0 mr-4">{{ recordType | translate }}</h3>
     <button (click)="cancel()" class="btn btn-warning btn-sm" translate>Cancel</button>
   </header>
   <div *ngIf="recordType === 'documents'" class="">