From 06d333c067bb0d66efa0f26c458321475674ae3e Mon Sep 17 00:00:00 2001
From: Emanuel Schuetze <emanuel@intevation.de>
Date: Sun, 17 Apr 2016 19:50:26 +0200
Subject: [PATCH] Template fixes for better smartphone usage.

- Remove on-focus-me directive on every list view.
  (Otherwise smartphones/tablets opens always the keyboard on each list view.)
- Make some columns 'optional' in list view to see only the most important columns
  on small devices.
- Add z-index for projector sidebar. Show it in full width on small
  devices.
- Remove padding on small devices.
---
 .../static/templates/agenda/item-list.html       |  8 ++++----
 .../templates/assignments/assignment-list.html   |  2 +-
 openslides/core/static/css/app.css               | 16 ++++++++++++++++
 .../core/static/templates/core/tag-list.html     |  2 +-
 .../templates/mediafiles/mediafile-list.html     |  2 +-
 .../static/templates/motions/category-list.html  |  2 +-
 .../static/templates/motions/motion-list.html    |  6 +++---
 .../users/static/templates/users/group-list.html |  2 +-
 .../users/static/templates/users/user-list.html  |  2 +-
 9 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/openslides/agenda/static/templates/agenda/item-list.html b/openslides/agenda/static/templates/agenda/item-list.html
index 9dd67fb8a..48d0edef8 100644
--- a/openslides/agenda/static/templates/agenda/item-list.html
+++ b/openslides/agenda/static/templates/agenda/item-list.html
@@ -73,7 +73,7 @@
         <div class="form-group">
           <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-search"></i></div>
-            <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+            <input type="text" ng-model="filter.search" class="form-control"
                placeholder="{{ 'Search' | translate}}">
           </div>
         </div>
@@ -124,9 +124,9 @@
         <!-- agenda item column -->
         <th>
           <translate>Agenda item</translate>
-        <th os-perms="agenda.can_see_hidden_items">
+        <th os-perms="agenda.can_see_hidden_items" class="optional">
           <translate>Duration</translate>
-        <th class="minimum">
+        <th class="minimum optional">
           <translate>Done</translate>
     <tbody>
       <tr ng-repeat="item in itemsFiltered = (items | filter: filter.search |
@@ -188,7 +188,7 @@
         <td ng-show="!item.quickEdit" os-perms="agenda.can_see_hidden_items" class="optional">
           {{ item.duration }}
           <span ng-if="item.duration" translate-comment="'h' means time in hours" translate>h</span>
-        <td ng-if="!item.quickEdit">
+        <td ng-if="!item.quickEdit" class="optional">
           <span os-perms="!agenda.can_manage">
             <i ng-if="item.closed" class="fa fa-check-square-o"></i>
           </span>
diff --git a/openslides/assignments/static/templates/assignments/assignment-list.html b/openslides/assignments/static/templates/assignments/assignment-list.html
index 6d266de11..efb321360 100644
--- a/openslides/assignments/static/templates/assignments/assignment-list.html
+++ b/openslides/assignments/static/templates/assignments/assignment-list.html
@@ -36,7 +36,7 @@
         <div class="form-group">
           <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-search"></i></div>
-            <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+            <input type="text" ng-model="filter.search" class="form-control"
                placeholder="{{ 'Search' | translate}}">
           </div>
         </div>
diff --git a/openslides/core/static/css/app.css b/openslides/core/static/css/app.css
index e0ffae5bc..af3ea5253 100644
--- a/openslides/core/static/css/app.css
+++ b/openslides/core/static/css/app.css
@@ -308,6 +308,8 @@ img {
 
 #content .col2 {
     float: right;
+    position: relative;
+    z-index: 10;
 }
 
 #content .col2.max {
@@ -854,3 +856,17 @@ tr.selected td {
     /* hide marked element / column */
     .optional, .hide-sm { display: none; }
 }
+
+/* display for resolutions smaller that 560px */
+@media only screen and (max-width: 560px) {
+    #content .containerOS {
+        padding: 0;
+    }
+    #content .col2.max {
+        width: 100%;
+        position: absolute;
+    }
+    .col2 .projector_full {
+        margin-left: 0px;
+    }
+}
diff --git a/openslides/core/static/templates/core/tag-list.html b/openslides/core/static/templates/core/tag-list.html
index 2c65f10e2..b10ce7674 100644
--- a/openslides/core/static/templates/core/tag-list.html
+++ b/openslides/core/static/templates/core/tag-list.html
@@ -14,7 +14,7 @@
   <div class="row form-group">
     <div class="col-sm-8"></div>
     <div class="col-sm-4">
-      <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+      <input type="text" ng-model="filter.search" class="form-control"
           placeholder="{{ 'Filter' | translate}}">
     </div>
   </div>
diff --git a/openslides/mediafiles/static/templates/mediafiles/mediafile-list.html b/openslides/mediafiles/static/templates/mediafiles/mediafile-list.html
index ccadb99dc..7ac7a156b 100644
--- a/openslides/mediafiles/static/templates/mediafiles/mediafile-list.html
+++ b/openslides/mediafiles/static/templates/mediafiles/mediafile-list.html
@@ -90,7 +90,7 @@
         <div class="form-group">
           <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-search"></i></div>
-            <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+            <input type="text" ng-model="filter.search" class="form-control"
                placeholder="{{ 'Search' | translate}}">
           </div>
         </div>
diff --git a/openslides/motions/static/templates/motions/category-list.html b/openslides/motions/static/templates/motions/category-list.html
index d576ccf02..0b56b67ad 100644
--- a/openslides/motions/static/templates/motions/category-list.html
+++ b/openslides/motions/static/templates/motions/category-list.html
@@ -17,7 +17,7 @@
 <div class="details">
   <div class="row form-group">
     <div class="col-sm-4 pull-right">
-      <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+      <input type="text" ng-model="filter.search" class="form-control"
           placeholder="{{ 'Filter' | translate }}">
     </div>
   </div>
diff --git a/openslides/motions/static/templates/motions/motion-list.html b/openslides/motions/static/templates/motions/motion-list.html
index 174ff180f..2427ff46b 100644
--- a/openslides/motions/static/templates/motions/motion-list.html
+++ b/openslides/motions/static/templates/motions/motion-list.html
@@ -42,7 +42,7 @@
         <div class="form-group">
           <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-search"></i></div>
-            <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+            <input type="text" ng-model="filter.search" class="form-control"
                placeholder="{{ 'Search' | translate}}">
           </div>
         </div>
@@ -95,7 +95,7 @@
           <input type="checkbox" ng-model="$parent.selectedAll" ng-change="checkAll()">
 
         <!-- agenda item column -->
-        <th ng-click="toggleSort('agenda_item.item_number')" class="sortable">
+        <th ng-click="toggleSort('agenda_item.item_number')" class="sortable optional">
           <translate translate-comment="short form of agenda item">Item</translate>
           <i class="pull-right fa" ng-show="sortColumn === 'agenda_item.item_number' && header.sortable != false"
               ng-class="reverse ? 'fa-sort-desc' : 'fa-sort-asc'">
@@ -154,7 +154,7 @@
           <input type="checkbox" ng-model="motion.selected">
 
         <!-- agenda item number -->
-        <td ng-if="!motion.quickEdit">{{ motion.agenda_item.item_number }}
+        <td ng-if="!motion.quickEdit" class="optional">{{ motion.agenda_item.item_number }}
 
         <!-- identifier -->
         <td ng-if="!motion.quickEdit">{{ motion.identifier }}
diff --git a/openslides/users/static/templates/users/group-list.html b/openslides/users/static/templates/users/group-list.html
index d0844badc..a36ca945e 100644
--- a/openslides/users/static/templates/users/group-list.html
+++ b/openslides/users/static/templates/users/group-list.html
@@ -20,7 +20,7 @@
       <div class="form-group">
         <div class="input-group">
           <div class="input-group-addon"><i class="fa fa-search"></i></div>
-          <input type="text" os-focus-me ng-model="filter.search" class="form-control"
+          <input type="text" ng-model="filter.search" class="form-control"
              placeholder="{{ 'Search' | translate}}">
         </div>
       </div>
diff --git a/openslides/users/static/templates/users/user-list.html b/openslides/users/static/templates/users/user-list.html
index 2c70c43ed..7716c7ab5 100644
--- a/openslides/users/static/templates/users/user-list.html
+++ b/openslides/users/static/templates/users/user-list.html
@@ -52,7 +52,7 @@
         <div class="form-group">
           <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-search"></i></div>
-            <input type="text" os-focus-me ng-model="filter.search" ng-model-options="{debounce: 500}" class="form-control"
+            <input type="text" ng-model="filter.search" ng-model-options="{debounce: 500}" class="form-control"
                placeholder="{{ 'Search' | translate}}">
           </div>
         </div>