style the token list a bit

diff --git a/grauphel.css b/grauphel.css
index e31ed6d5a577a33c425b9aa95b700e76d466df8d..85143f7bb04aff15a5fa16e64f79c185afd4b979 100644 (file)
--- a/grauphel.css
+++ b/grauphel.css
@@ -1,5 +1,7 @@
 .app-grauphel #app-content {
     box-sizing: border-box;
 .app-grauphel #app-content {
     box-sizing: border-box;

+}
+.app-grauphel #app-content.content {

     padding: 2ex;
 }
 
     padding: 2ex;
 }
 


@@ -8,6 +10,10 @@
     font-size: 2em;
     margin-bottom: 1ex;
 }
     font-size: 2em;
     margin-bottom: 1ex;
 }

+.app-grauphel #app-content.list h1 {
+    padding: 1ex;
+}
+

 .app-grauphel #app-content h2 {
     font-weight: bold;
     font-size: 150%;
 .app-grauphel #app-content h2 {
     font-weight: bold;
     font-size: 150%;


@@ -48,4 +54,64 @@
 .app-grauphel .buttons {
     margin-top: 2ex;
     text-align: center;
 .app-grauphel .buttons {
     margin-top: 2ex;
     text-align: center;

-}
\ No newline at end of file
+}
+
+
+/* table style */
+
+table.table {
+    position: relative;
+    width: 100%;
+}
+
+/* make sure there's enough room for the file actions */
+#body-user table.table {
+       min-width: 688px; /* 768 (mobile break) - 80 (nav width) */
+}
+
+table.table tbody tr { background-color:#fff; height:51px; }
+
+/* fit app list view heights */
+/*
+.app-files #app-content>.viewcontainer {
+       min-height: 100%;
+}*/
+
+table.table tbody tr { background-color:#fff; height:40px; }
+table.table tbody tr:hover, tbody tr:active {
+       background-color: rgb(240,240,240);
+}
+table.table tbody tr.selected {
+       background-color: rgb(230,230,230);
+}
+table.table tbody tr.searchresult {
+       background-color: rgb(240,240,240);
+}
+table.table tbody a { color:#000; }
+
+table.table tr.mouseOver td {
+       background-color: #eee;
+}
+table.table th, table th a {
+       color: #999;
+}
+table.table thead th {
+    background-color: white;
+    padding: 15px;
+    height: 50px;
+    box-sizing: border-box;
+    vertical-align: middle;
+}
+
+table.table th, table.table td {
+    border-bottom:1px solid #ddd;
+    text-align:left;
+    font-weight:normal;
+}
+table.table td {
+    padding: 0 15px;
+    border-bottom: 1px solid #eee;
+    font-style: normal;
+    background-position: 8px center;
+    background-repeat: no-repeat;
+}

diff --git a/templates/index.php b/templates/index.php
index e59b3811d7ee15e26b009e4864e65aec26c5f548..fb57acdfc15df5b45189d7a12f72f301b132cc48 100644 (file)
--- a/templates/index.php
+++ b/templates/index.php
@@ -3,7 +3,7 @@
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 

-<div id="app-content">
+<div id="app-content" class="content">

   <div>
     <h1>grauphel - Tomboy notes server</h1>
     <p>
   <div>
     <h1>grauphel - Tomboy notes server</h1>
     <p>

diff --git a/templates/tag.php b/templates/tag.php
index ea80ed051a1030899f2639d75873894e21eefcbd..fec3bc2fb1d06c8f3068d5790a24563c76a666d9 100644 (file)
--- a/templates/tag.php
+++ b/templates/tag.php
@@ -3,7 +3,7 @@
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 

-<div id="app-content">
+<div id="app-content" class="content">

   <h1>Notebook: <?php p($_['tag']); ?></h1>
   <ul>
     <?php foreach ($_['notes'] as $note) { ?>
   <h1>Notebook: <?php p($_['tag']); ?></h1>
   <ul>
     <?php foreach ($_['notes'] as $note) { ?>

diff --git a/templates/tokens.php b/templates/tokens.php
index 531883d0e4977229034e57a074c9b009206c6b96..4a578f577649e35b0c2cc619a5ea4ff789c23dd8 100644 (file)
--- a/templates/tokens.php
+++ b/templates/tokens.php
@@ -3,11 +3,26 @@
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 
 <?php /** @var $l OC_L10N */ ?>
 <?php $_['appNavigation']->printPage(); ?>
 

-<div id="app-content">
+<div id="app-content" class="list">

   <h1>Manage access tokens</h1>
   <h1>Manage access tokens</h1>

-  <ul>
+  <table class="table">
+   <thead>
+    <tr>
+     <th>Token</th>
+     <th>Client</th>
+     <th>Last use</th>
+     <th>Actions</th>
+    </tr>
+   </thead>
+   <tbody>

     <?php foreach ($_['tokens'] as $token) { ?>
     <?php foreach ($_['tokens'] as $token) { ?>

-      <li data-id="<?php p($token->tokenKey); ?>"><a href="#"><?php p($token->tokenKey); ?></a></li>
+      <tr>
+       <td><?php p($token->tokenKey); ?></td>
+       <td></td>
+       <td></td>
+       <td>Disable Delete</td>
+      </tr>

     <?php } ?>
     <?php } ?>

-  </ul>
+   </tbody>
+ </table>

 </div>
 </div>