]> git.immae.eu Git - github/shaarli/Shaarli.git/commitdiff
A lot of minor improvements, cleanup, narrow mobile side blank spaces
authorArthurHoaro <arthur@hoa.ro>
Fri, 6 Jan 2017 13:50:09 +0000 (14:50 +0100)
committerArthurHoaro <arthur@hoa.ro>
Fri, 6 Jan 2017 13:50:09 +0000 (14:50 +0100)
20 files changed:
tpl/default/404.html
tpl/default/addlink.html
tpl/default/changepassword.html
tpl/default/changetag.html
tpl/default/configure.html
tpl/default/css/shaarli.css
tpl/default/daily.html
tpl/default/editlink.html
tpl/default/export.html
tpl/default/import.html
tpl/default/install.html
tpl/default/js/shaarli.js
tpl/default/linklist.html
tpl/default/linklist.paging.html
tpl/default/loginform.html
tpl/default/page.header.html
tpl/default/picwall.html
tpl/default/pluginsadmin.html
tpl/default/tagcloud.html
tpl/default/tools.html

index edc5ac4bd6c0c465eabf1c40dab8deb4445d9feb..2de6b6da686dafd96b23bb42856cd1ffdce872e8 100644 (file)
@@ -6,7 +6,6 @@
 <body>
 <div id="pageheader">
   {include="page.header"}
-</div>
 <div class="center" id="page404">
   <h2>{'Sorry, nothing to see here.'|t}</h2>
   <img src="img/sad_star.png">
index 2d66c3818388dbdf2825277373af7f35387b9637..2f956e061bc30534a1f15cbaa2087e2a51da9c3d 100644 (file)
@@ -6,8 +6,8 @@
 <body>
 {include="page.header"}
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div id="addlink-form" class="page-form  page-form-light pure-u-lg-1-3 pure-u-3-4">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div id="addlink-form" class="page-form  page-form-light pure-u-lg-1-3 pure-u-22-24">
     <h2 class="window-title">{"Shaare a new link"|t}</h2>
     <form method="GET" action="#" name="addform" class="addform">
       <div>
index 7196cccdf979250c2cd31d7e3ee7a7467f7fd8a7..2d15c92ac81e2775d9992626b4384a1954dd15c3 100644 (file)
@@ -6,8 +6,8 @@
 <body>
 {include="page.header"}
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-3-4">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
     <h2 class="window-title">{"Change password"|t}</h2>
     <form method="POST" action="#" name="changepasswordform" id="changepasswordform">
       <div>
index 5d5d8c96a742c2426beb57b4c24485560835e0f0..4f98baec2286d85124217118d9fd38c162c6fd72 100644 (file)
@@ -6,8 +6,8 @@
 <body>
 {include="page.header"}
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-3-4">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
     <h2 class="window-title">{"Manage tags"|t}</h2>
     <form method="POST" action="#" name="changetag" id="changetag">
       <div>
@@ -28,8 +28,7 @@
       <input type="hidden" name="token" value="{$token}">
       <div>
         <input type="submit" value="{'Rename'|t}" name="renametag">
-        <span class="pure-u-0 pure-u-lg-visible">or</span>
-        <input type="submit" value="{'Delete'|t}" name="deletetag">
+        <input type="submit" value="{'Delete'|t}" name="deletetag" class="button-red">
       </div>
     </form>
   </div>
index e872a4d244aec3b577974f204e84b225ed54d0aa..b959a91bd780be77e96121462145cd3184c56ba6 100644 (file)
@@ -13,8 +13,8 @@
 
 <form method="POST" action="#" name="configform" id="configform">
   <div class="pure-g">
-    <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-    <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-form-complete">
+    <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+    <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-form-complete">
       <h2 class="window-title">{'Configure'|t}</h2>
       <div class="pure-g">
         <div class="pure-u-lg-{$ratioLabel} pure-u-1">
index ae0d58073c3cbff1bf6c4ae060a10d14d3ce81f9..fafe7351ff34e66d4322d0fe15025fdbd6382c01 100644 (file)
@@ -175,46 +175,70 @@ pre {
     font-size: 0.8em;
 }
 
-#search {
-    position: fixed;
+#search, #search-linklist {
+    text-align: center;
     width: 100%;
 }
 
-#search input[type="text"] {
-    width: 250px;
+#search input[type="text"], #search-linklist input[type="text"] {
+    padding: 0 5px;
+    height: 30px;
+    width: 260px;
+    background: #f5f5f5;
+    border: medium none currentColor;
+    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 1px rgba(0, 0, 0, 0.298) inset;
+    border-radius: 2px;
     color: #252525;
 }
 
 /* because chrome */
-#search input[type="text"]::-webkit-input-placeholder {
-    color: #252525;
+#search input[type="text"]::-webkit-input-placeholder,
+#search-linklist input[type="text"]::-webkit-input-placeholder {
+    color: #777777;
 }
 
-#search button {
+#search button,
+#search-linklist button {
     background: transparent;
     border: none;
+}
+
+#search button {
     color: #f5f5f5;
 }
 
+#search-linklist button {
+    color: #252525;
+}
+
 #search button:hover {
     color: #fff;
 }
 
+#search-linklist button:hover {
+    color: #000;
+}
+
+#search-linklist {
+    padding: 5px 0;
+}
+
 @media screen and (min-width: 64em) {
-    #search .searchform {
+    #search .searchform,
+    #search-linklist .searchform {
         margin-right: 25px;
         text-align: right;
     }
 
-    #search .tagfilter {
+    #search .tagfilter,
+    #search-linklist .tagfilter {
         margin-left: 25px;
         text-align: left;
     }
 }
 @media screen and (max-width: 64em) {
-    #search {
-        position: relative;
-        height: 60px;
+    #search, #search * {
+        visibility: hidden;
     }
 }
 
@@ -239,11 +263,6 @@ pre {
         visibility: visible;
     }
 }
-@media screen and (max-width: 64em) {
-    #search.subheader-form, .subheader-form.open * {
-        visibility: visible;
-    }
-}
 
 .subheader-form input[type="text"], .subheader-form input[type="password"], .subheader-form .remember-me {
     margin: 0 0 5px 0;
@@ -252,7 +271,7 @@ pre {
     width: 20%;
     background: #f5f5f5;
     border: medium none currentColor;
-    border-radius: 5px;
+    border-radius: 2px;
     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 4px rgba(0, 0, 0, 0.298) inset;
     color: #252525;
 }
@@ -315,6 +334,46 @@ pre {
     }
 }
 
+/**
+ * Plugins additional forms
+ */
+.toolbar-plugin {
+    margin: 5px 0;
+    text-align: center;
+}
+
+.toolbar-plugin input[type="text"] {
+    padding: 0 5px;
+    height: 30px;
+    width: 300px;
+    background: #f5f5f5;
+    border: medium none currentColor;
+    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 1px rgba(0, 0, 0, 0.298) inset;
+    border-radius: 2px;
+    color: #252525;
+}
+
+/* because chrome */
+.toolbar-plugin input[type="text"]::-webkit-input-placeholder {
+    color: #777777;
+}
+
+.toolbar-plugin input[type="submit"] {
+    padding: 0 10px;
+    height: 30px;
+    background: #f5f5f5;
+    border: medium none currentColor;
+    border-radius: 2px;
+    color: #252525;
+}
+
+@media screen and (max-width: 64em) {
+    .toolbar-plugin input[type="text"] {
+        width: 70%;
+
+    }
+}
+
 /**
  * CONTENT - LINKLIST PAGING
  * 64em -> lg
@@ -369,14 +428,18 @@ pre {
     background: #f5f5f5;
 }
 
+.linksperpage a, .linksperpage input[type="text"] {
+    display: inline-block;
+    width: 20px;
+    text-align: center;
+}
+
 .linksperpage form {
     display: inline;
-    margin: 0 10px 0 0;
 }
 
 .linksperpage input[type="text"] {
-    width: 28px;
-    height: 12px;
+    height: 15px;
     margin: 0;
     padding: 3px 5px 3px 8px;
     background: #f5f5f5;
@@ -400,9 +463,22 @@ pre {
 }
 
 .linklist-item-title {
+    position: relative;
     background: #f5f5f5;
 }
 
+.linklist-item.private .linklist-item-title::before {
+    position: absolute;
+    left: 3px;
+    top: 0;
+    display: block;
+    content:"";
+    background: #F89406;
+    height: 95%;
+    width: 3px;
+    margin-top: 3px;
+}
+
 .linklist-item-title h2 {
     padding: 3px 10px 0 10px;
     line-height: 25px;
@@ -417,6 +493,7 @@ pre {
 }
 
 .linklist-item-title .linklist-link {
+    font-size: 1.1em;
     color: #1b926c;
 }
 
@@ -454,6 +531,12 @@ pre {
     padding: 5px;
 }
 
+.linklist-item-editbuttons * {
+    display: block;
+    float: left;
+    margin: 0 1px;
+}
+
 .linklist-item-editbuttons a {
     font-size: 1em;
 }
@@ -469,6 +552,7 @@ pre {
 }
 
 .linklist-item-description {
+    position: relative;
     padding: 10px;
     background: #f5f5f5;
     font-family: Roboto Slab, Arial, sans-serif;
@@ -476,6 +560,19 @@ pre {
     color: #252525;
 }
 
+.linklist-item.private .linklist-item-description::before {
+    position: absolute;
+    left: 3px;
+    top: 0;
+    display: block;
+    content:"";
+    background: #F89406;
+    height: 95%;
+    width: 3px;
+    z-index: 9999;
+    #margin: 0;
+}
+
 .linklist-item-description a {
     text-decoration: none;
     color: #1b926c;
@@ -496,13 +593,13 @@ pre {
 }
 
 .linklist-item-infos {
-    padding: 5px 5px 0 5px;
+    padding: 8px 8px 5px 8px;
     background: #ddd;
     color: #252525;
 }
 
 .linklist-item-infos a {
-    color: #505050;
+    color: #252525;
     text-decoration: none;
 }
 
@@ -511,17 +608,14 @@ pre {
 }
 
 .linklist-item-infos .linklist-item-tags {
-    margin: 0 0 5px 0;
     font-size: 0.8em;
 }
 
 .linklist-item-infos .label-tag {
-    border: 1px solid #505050;
     font-size: 0.9em;
 }
 
 .linklist-item-infos .label-tag:hover {
-    border: 1px solid #000;
 }
 
 .linklist-item-infos-dateblock {
@@ -541,6 +635,17 @@ pre {
     font-size: 0.8em;
 }
 
+.linklist-item-infos .mobile-buttons {
+    text-align: right;
+}
+
+.linklist-item-infos .linklist-plugin-icon {
+    display: inline-block;
+    margin: 0 2px;
+    width: 16px;
+    height: 16px;
+}
+
 /** 64em -> lg **/
 @media screen and (max-width: 64em) {
     .linklist-item-infos-url {
@@ -576,10 +681,10 @@ pre {
  */
 .page-form {
     margin: 20px 0 0 0;
-    padding: 0 10px 0 10px;
     background: #f5f5f5;
     box-shadow: 1px 1px 2px #797979;
     color: #252525;
+    overflow: hidden;
 }
 
 .page-form .window-title {
@@ -609,16 +714,22 @@ pre {
     font-weight: bold;
 }
 
+.page-form p {
+    padding: 0 10px;
+    margin: 0;
+}
+
 .page-form input[type="text"],
 .page-form input[type="password"],
 .page-form textarea {
+    box-sizing: border-box;
     margin: 10px 0;
     padding: 5px 5px 3px 15px;
-    height: 30px;
-    width: 80%;
-    background: #f5f5f5;
+    height: 35px;
+    width: 90%;
+    background: #ebebeb;
     border: medium none currentColor;
-    border-radius: 5px;
+    border-radius: 2px;
     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 4px rgba(0, 0, 0, 0.298) inset;
     color: #252525;
 }
@@ -634,7 +745,7 @@ pre {
 /* because chrome */
 .page-form input[type="text"]::-webkit-input-placeholder,
 .page-form input[type="password"]::-webkit-input-placeholder {
-    color: #252525;
+    color: #777777;
 }
 
 .page-form input[type="submit"] {
@@ -648,6 +759,11 @@ pre {
     color: #f5f5f5;
 }
 
+
+.page-form input[type="submit"].button-red {
+    background: #ac2925;
+}
+
 .page-form select {
     color: #252525;
 }
@@ -704,10 +820,9 @@ pre {
 }
 
 .page-form section {
-    margin-top: 20px;
+    margin: 10px 0 25px 0;
 }
 
-
 .page-form table {
     margin: auto;
     width: 90%;
@@ -715,12 +830,13 @@ pre {
 
 .page-form table .order {
     text-decoration: none;
+    color: #252525;
 }
 
 .page-form table, .page-form th, .page-form td {
     border-width: 1px 0;
     border-style: solid;
-    border-color: #b0ddce;
+    border-color: #aaaaaa;
 }
 
 .page-form th, .page-form td {
@@ -730,7 +846,7 @@ pre {
 
 /* Awesomeplete fix */
 .page-form .awesomplete {
-    width: 80%;
+    width: 90%;
 }
 
 .page-form .awesomplete input {
@@ -852,7 +968,6 @@ pre {
     }
 }
 
-
 /**
  * IMPORT
  */
@@ -882,13 +997,14 @@ pre {
  */
 #picwall_container {
     margin: 0 10px 10px 10px;
-    color: #fff;
-    background-color: #000;
+    color: #252525;
+    background-color: #f5f5f5;
     clear: both;
 }
 
 .picwall_pictureframe {
-    background-color: #000;
+    margin: 2px;
+    background-color: #f5f5f5;
     z-index: 5;
     position: relative;
     display: table-cell;
@@ -924,6 +1040,7 @@ pre {
 /* CSS to show title when hovering an image - no javascript required. */
 .picwall_pictureframe span.info {
     display: none;
+    font-family: Arial, sans-serif;
 }
 
 .picwall_pictureframe:hover span.info {
@@ -932,16 +1049,12 @@ pre {
     top: 0;
     left: 0;
     width: 90px;
+    height: 90px;
     font-weight: bold;
-    font-size: 8pt;
-    color: #fff;
+    font-size: 9pt;
+    color: #f5f5f5;
     text-align: left;
-    background-color: transparent;
-    background-color: rgba(0, 0, 0, 0.4);
-    /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
-    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000);
-    /* IE6\96IE9 */
-    text-shadow: 2px 2px 1px #000000;
+    background-color: rgba(0, 0, 0, 0.8);
 }
 
 /**
index d4c11f6f38b88a8b1acb75f5cecbf2fbecaa9d46..d8c91078ad533dbda81d769c1f543292ae1b68e5 100644 (file)
@@ -7,8 +7,8 @@
 {include="page.header"}
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-  <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-visitor" id="daily">
+  <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+  <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-visitor" id="daily">
     <h2 class="window-title">
       {'The Daily Shaarli'|t}
       <a href="?do=dailyrss" title="{'1 RSS entry per day'|t}"><i class="fa fa-rss"></i></a>
index 1708bee1ed876c9a4a47e3cb7ff949700bb9246a..6b480c29c106f95b905ba9f948a30fe53886521d 100644 (file)
@@ -10,8 +10,8 @@
     <div class="center">Shaare to: {$shaarlititle}</div>
   {/if}
   <div id="editlinkform" class="pure-g">
-    <div class="pure-u-lg-1-5 pure-u-1-8"></div>
-    <form method="post" name="linkform" class="page-form pure-u-lg-3-5 pure-u-3-4 page-form page-form-light">
+    <div class="pure-u-lg-1-5 pure-u-1-24"></div>
+    <form method="post" name="linkform" class="page-form pure-u-lg-3-5 pure-u-22-24 page-form page-form-light">
       <h2 class="window-title">{'Shaare'|t}</h2>
       <input type="hidden" name="lf_linkdate" value="{$link.linkdate}">
       {if="isset($link.id)"}
@@ -61,7 +61,7 @@
       <div>
         <input type="submit" value="{'Save'|t}" name="save_edit">
         {if="!$link_is_new"}
-          <input type="submit" value="{'Delete'|t}" name="delete_link" class="delete-link">
+          <input type="submit" value="{'Delete'|t}" name="delete_link" class="button-red">
         {/if}
       </div>
 
index e93f98a9e9c3d3d20e92c11909f9b6d517a3a0f1..af1d6e330218c75df41b2bb2c0f1a0aff5ddcfdc 100644 (file)
@@ -6,15 +6,10 @@
 <body>
 {include="page.header"}
 
-{$ratioLabel='5-12'}
-{$ratioLabelMobile='7-8'}
-{$ratioInput='7-12'}
-{$ratioInputMobile='1-8'}
-
 <form method="GET" action="#" name="exportform" id="exportform">
   <div class="pure-g">
-    <div class="pure-u-lg-1-4 pure-u-1-8"></div>
-    <div class="pure-u-lg-1-2 pure-u-3-4 page-form page-form-complete">
+    <div class="pure-u-lg-1-4 pure-u-1-24"></div>
+    <div class="pure-u-lg-1-2 pure-u-22-24 page-form page-form-complete">
       <div>
         <h2 class="window-title">{"Export Database"|t}</h2>
       </div>
index a524c3bc192f9769bdf74d1ce059d7d996311d91..e6e521e8fc3d0280e2ec04f622c88a5792271968 100644 (file)
@@ -6,15 +6,10 @@
 <body>
 {include="page.header"}
 
-{$ratioLabel='5-12'}
-{$ratioLabelMobile='7-8'}
-{$ratioInput='7-12'}
-{$ratioInputMobile='1-8'}
-
 <form method="POST" action="?do=import" enctype="multipart/form-data" name="uploadform" id="uploadform">
   <div class="pure-g">
-    <div class="pure-u-lg-1-4 pure-u-1-8"></div>
-    <div class="pure-u-lg-1-2 pure-u-3-4 page-form page-form-complete">
+    <div class="pure-u-lg-1-4 pure-u-1-24"></div>
+    <div class="pure-u-lg-1-2 pure-u-22-24 page-form page-form-complete">
       <div>
         <h2 class="window-title">{"Import Database"|t}</h2>
       </div>
       <div class="pure-g">
         <div class="pure-u-lg-1-3 pure-u-7-8">
           <div class="form-label">
-            <label for="overwrite"><span class="label-name">{'Overwrite existing bookmarks'|t}</span></label>
+            <label for="overwrite">
+              <span class="label-name">{'Overwrite existing bookmarks'|t}</span><br>
+              <span class="label-desc">{'Duplicates based on URL'|t}</span>
+            </label>
           </div>
         </div>
         <div class="pure-u-lg-2-3 pure-u-1-8">
@@ -70,7 +68,7 @@
         </div>
         <div class="pure-u-lg-2-3 pure-u-1">
           <div class="form-input">
-            <input type="text" name="default_tags" id="default_tags">
+            <input type="text" name="default_tags" id="default_tags" placeholder="{'Tag'|t}">
           </div>
         </div>
       </div>
index aa606e92e1ef9edb51cd89cbf629469e04066079..0bd8a63559b1b5146132fedea3f3d6f69d287f6c 100644 (file)
@@ -4,21 +4,15 @@
   {include="includes"}
 </head>
 <body>
-<div id="header" class="pure-u-0 pure-u-lg-visible">
-  <h1 id="header-title">
-    <a>Shaarli</a>
-  </h1>
-</div>
-<div class="clear"></div>
 
 {$ratioLabel='1-4'}
 {$ratioInput='3-4'}
 
 <form method="POST" action="#" name="installform" id="installform">
 <div class="pure-g">
-  <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-  <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-form-complete">
-    <h2 class="window-title">{'Install'|t}</h2>
+  <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+  <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-form-complete">
+    <h2 class="window-title">{'Install Shaarli'|t}</h2>
 
     <div class="center">
       {'It looks like it\'s the first time you run Shaarli. Please configure it.'|t}
@@ -87,7 +81,7 @@
     </div>
 
     <div class="pure-g">
-      <div class="pure-u-lg-{$ratioLabel} pure-u-1">
+      <div class="pure-u-lg-{$ratioLabel} pure-u-7-8">
         <div class="form-label">
           <label for="update">
             <span class="label-name">{'Check updates'|t}</span><br>
           </label>
         </div>
       </div>
-      <div class="pure-u-lg-{$ratioInput} pure-u-1 ">
+      <div class="pure-u-lg-{$ratioInput} pure-u-1-8">
         <div class="form-input">
           <input type="checkbox" name="updateCheck" id="update" checked="checked">
-
         </div>
       </div>
     </div>
 
     <div class="center">
-      <input type="submit" value="{'Create config'|t}" name="Save">
+      <input type="submit" value="{'Install'|t}" name="Save">
     </div>
   </div>
 </div>
index 01e22022edd4ccbad8c679066be888003973ebce..287d157c8c417fa1ea47788b4956d4d0e7b3a3aa 100644 (file)
@@ -151,20 +151,11 @@ if (autofocusElements != null) {
     autofocusElements.focus();
 }
 
-/**
- * Hide search bar
- */
-var search = document.getElementById('search');
-if (search != null) {
-    removeClass(search, 'open');
-}
-
 /**
  * Handle sub menus/forms
  */
 var openers = document.getElementsByClassName('subheader-opener');
 if (openers != null) {
-    console.log(openers);
     [].forEach.call(openers, function(opener) {
          opener.addEventListener('click', function(event) {
              event.preventDefault();
index f1f67eea2aaca92e52bab2d040dc6d0df758deda..459a7c33e3dddd7b504f9bcfa4ad127c0bb4ec45 100644 (file)
@@ -6,6 +6,49 @@
 <body>
 {include="page.header"}
 
+<div id="search-linklist">
+  <div class="pure-g">
+    <div class="pure-u-1 pure-u-lg-1-2">
+      <form method="GET" class="searchform" name="searchform">
+        <input type="text" tabindex="1" name="searchterm" placeholder="{'Search text'|t}"
+               {if="!empty($search_term)"}
+               value="{$search_term}"
+               {/if}
+        >
+        <button type="submit" class="search-button"><i class="fa fa-search"></i></button>
+      </form>
+    </div>
+    <div class="pure-u-1 pure-u-lg-1-2">
+      <form method="GET" class="tagfilter" name="tagfilter">
+        <input type="text" tabindex="2" name="searchtags" placeholder="{'Filter by tag'|t}"
+               {if="!empty($search_tags)"}
+               value="{$search_tags}"
+               {/if}
+        autocomplete="off" data-multiple data-minChars="1"
+        data-list="{loop="$tags"}{$key}, {/loop}"
+        >
+        <button type="submit" class="search-button"><i class="fa fa-search"></i></button>
+      </form>
+    </div>
+  </div>
+</div>
+
+{loop="$plugins_header.fields_toolbar"}
+  <form
+    {loop="$value.attr"}
+      {$key}="{$value}"
+    {/loop}>
+    <div class="toolbar-plugin pure-u-lg-1">
+      {loop="$value.inputs"}
+        <input
+          {loop="$value"}
+          {$key}="{$value}"
+          {/loop}>
+      {/loop}
+    </div>
+  </form>
+{/loop}
+
 <div id="linklist">
 
   <div id="linkcount" class="center">
             {if="$value.tags"}
               <div class="linklist-item-tags">
                 <i class="fa fa-tags"></i>
+                {$tag_counter=count($value.taglist)}
                 {loop="value.taglist"}
                   <span class="label label-tag" title="Add tag">
                     <a href="?addtag={$value|urlencode}">{$value}</a>
                   </span>
+                  {if="$tag_counter - 1 != $counter"}&middot;{/if}
                 {/loop}
               </div>
             {/if}
                   {'permalink'|t}
                 </a>
 
+                <div class="pure-u-0 pure-u-lg-visible">
+                  {if="isset($value.link_plugin)"}
+                    &middot;
+                    {$link_plugin_counter=count($value.link_plugin)}
+                    {loop="$value.link_plugin"}
+                      {$value}
+                      {if="$link_plugin_counter - 1 != $counter"}&middot;{/if}
+                    {/loop}
+                  {/if}
+                </div>
+              </div><div
+                {ignore}do not add space or line break between these div - Firefox issue{/ignore}
+                class="linklist-item-infos-url pure-u-lg-5-8 pure-u-1">
+                <a href="{$value.real_url}" title="{$value.title}">
+                  <i class="fa fa-link"></i> {$value.url}
+                </a>
+                {if="isLoggedIn()"}
+                  <a href="?delete_link&amp;lf_linkdate={$value.id}&amp;token={$token}"
+                     title="{'Delete'|t}" class="delete-link pure-u-0 pure-u-lg-visible">
+                    <i class="fa fa-trash"></i>
+                  </a>
+                {/if}
+              </div>
+              <div class="mobile-buttons pure-u-1 pure-u-lg-0">
                 {if="isset($value.link_plugin)"}
-                  &middot;
                   {$link_plugin_counter=count($value.link_plugin)}
                   {loop="$value.link_plugin"}
                     {$value}
                     {if="$link_plugin_counter - 1 != $counter"}&middot;{/if}
                   {/loop}
+                  &middot;
+                {/if}
+                {if="isLoggedIn()"}
+                  <a href="?delete_link&amp;lf_linkdate={$value.id}&amp;token={$token}"
+                     title="{'Delete'|t}" class="delete-link">
+                    <i class="fa fa-trash"></i>
+                  </a>
                 {/if}
-              </div><div
-                {ignore}do not add space or line break between these div - Firefox issue{/ignore}
-                class="linklist-item-infos-url pure-u-lg-5-8 pure-u-1">
-                <a href="{$value.real_url}" title="{$value.title}">
-                  <i class="fa fa-link"></i> {$value.url}
-                </a>
-                <a href="?delete_link&amp;lf_linkdate={$value.id}&amp;token={$token}" title="{'Delete'|t}" class="delete-link">
-                  <i class="fa fa-trash"></i>
-                </a>
               </div>
             </div>
           </div>
index 4888267b3f452e44ef2eda344a4d5d30f05af365..0b71c9d2e04e8959bd1b1339976e72193faf74be 100644 (file)
@@ -1,7 +1,7 @@
 <div class="linklist-paging">
   <div class="pure-g">
-    <div class="pure-u-2-24"></div>
-    <div class="pure-u-20-24">
+    <div class="pure-u-lg-2-24 pure-u-1-24"></div>
+    <div class="pure-u-lg-20-24 pure-u-22-24">
       <div class="paging pure-g">
         <div class="linklist-filters pure-u-1-3">
           {if="isLoggedIn() or !empty($action_plugin)"}
index dcc29676c3eca43cbc3c81e353aa04e3644df6b9..2ad3fe9cdc8e5e0813895d7527126f1bb010e442 100644 (file)
@@ -17,8 +17,8 @@
 </div>
 {else}
   <div class="pure-g">
-    <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-    <div id="login-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-3-4">
+    <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+    <div id="login-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
       <form method="post" name="loginform">
         <h2 class="window-title">{'Login'|t}</h2>
         <div>
index fefa92581136711f3286d5033f7a5463b7fa2c3b..ba643cac098d7b1e68ac1c843f418fc574059a97 100644 (file)
@@ -95,7 +95,7 @@
 </div>
 
 <div id="content">
-  <div id="search" class="subheader-form open">
+  <div id="search" class="subheader-form">
     <div class="pure-g">
       <div class="pure-u-1 pure-u-lg-1-2">
         <form method="GET" class="searchform" name="searchform">
       </div>
     </div>
   </div>
-  {loop="$plugins_header.fields_toolbar"}
-    <form
-      {loop="$value.attr"}
-        {$key}="{$value}"
-      {/loop}>
-      <div class="subheader-form open pure-u-0 pure-u-lg-visible pure-u-lg-1">
-        {loop="$value.inputs"}
-          <input
-            {loop="$value"}
-              {$key}="{$value}"
-            {/loop}>
-        {/loop}
-      </div>
-    </form>
-  {/loop}
   {if="!isLoggedIn()"}
     <form method="post" name="loginform">
       <div class="subheader-form" id="header-login-form">
index 57669340d785a2fa7c102c006263fcf121f4a7ba..b9ae2f2e5d2f007acc33c6e018d8e2d2c8e5dd9d 100644 (file)
@@ -7,8 +7,8 @@
 {include="page.header"}
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-  <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-visitor">
+  <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+  <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-visitor">
     {$countPics=count($linksToDisplay)}
     <h2 class="window-title">{'Picture Wall'|t} - {$countPics} {'pics'|t}</h2>
 
index ac38db97e4c4181dfaa787a2a0dafa9c3b71b5da..22fa81f6cfaf7332bb3c2a63138904bda495012f 100644 (file)
@@ -18,8 +18,8 @@
 
 <form method="POST" action="?do=save_pluginadmin" name="pluginform" id="pluginform">
   <div class="pure-g">
-    <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-    <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-form-complete">
+    <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+    <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-form-complete">
       <h2 class="window-title">{'Plugin administration'|t}</h2>
 
       <section id="enabled_plugins">
 
 <form action="?do=save_pluginadmin" method="POST">
   <div class="pure-g">
-    <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-    <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-form-light">
+    <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+    <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-form-light">
       <h2 class="window-title">{'Plugin configuration'|t}</h2>
       <section id="plugin_parameters">
         <div>
                   <h3 class="window-subtitle">{function="str_replace('_', ' ', $key)"}</h3>
                   {loop="$value.parameters"}
                   <div class="plugin_parameter">
-                    <div class="float_label">
+                    <p class="float_label">
                       <label for="{$key}">
                         <code>{$key}</code>
                         {if="isset($value.desc)"}
                           &middot; {$value.desc}
                         {/if}
                       </label>
-                    </div>
+                    </p>
                     <div class="float_input">
                       <input name="{$key}" value="{$value.value}" id="{$key}" type="text" />
                     </div>
index 8d56f95794a4b82e9d2489611f995a4590111d41..53c317485a1734db464d303c8333967eeb83b848 100644 (file)
@@ -7,8 +7,8 @@
 {include="page.header"}
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-6 pure-u-1-8"></div>
-  <div class="pure-u-lg-2-3 pure-u-3-4 page-form page-visitor">
+  <div class="pure-u-lg-1-6 pure-u-1-24"></div>
+  <div class="pure-u-lg-2-3 pure-u-22-24 page-form page-visitor">
     {$countTags=count($tags)}
     <h2 class="window-title">{'Tag cloud'|t} - {$countTags} {'tags'|t}</h2>
 
index a9b8803bfc02dad170e4830de5526e44373b6014..b9df32d9ee31ca8bdd386f58a5c60ef253e976a4 100644 (file)
@@ -7,8 +7,8 @@
 {include="page.header"}
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
     <h2 class="window-title">{'Settings'|t}</h2>
     <div class="tools-item">
       <a href="?do=configure" title="{'Change Shaarli settings: title, timezone, etc.'|t}">
 </div>
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
     <h2 class="window-title">Bookmarklets</h2>
-    <div>
+    <p>
       {'Drag one of these button to your bookmarks toolbar or right-click it and "Bookmark This Link"'|t},
       {'then click on the bookmarklet in any page you want to share.'|t}
-    </div>
+    </p>
     <div class="tools-item">
       <a title="{'Drag this link to your bookmarks toolbar or right-click it and Bookmark This Link'|t},
                 {'then click âœšShaare link button in any page you want to share'|t}"
@@ -96,8 +96,8 @@
 
 {if="$sslenabled"}
   <div class="pure-g">
-    <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-    <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
+    <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+    <div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
       <h2 class="window-title">Firefox Social API</h2>
       <p>{'You need to browse your Shaarli over <strong>HTTPS</strong> to use this functionality.'|t}</p>
 
 {/if}
 
 <div class="pure-g">
-  <div class="pure-u-lg-1-3 pure-u-1-8"></div>
-  <div class="pure-u-lg-1-3 pure-u-3-4 page-form page-form-light">
+  <div class="pure-u-lg-1-3 pure-u-1-24"></div>
+  <div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
     <h2 class="window-title">{'3rd party'|t}</h2>
     <div class="tools-item">
       <a href="https://addons.mozilla.org/fr/firefox/addon/shaarli/" title="Firefox {'Plugin'|t}">