From c133612f32849b76785635efe19d4afedcfd0248 Mon Sep 17 00:00:00 2001 From: VirtualTam Date: Tue, 2 Dec 2014 21:00:52 +0100 Subject: [PATCH] CSS: remove hardcoded style from templates Fixes shaarli/Shaarli#29 Style elements refactored as follows: - use existing ids and classes if possible, - else, define new ones and stick with the existing naming convention, - remove hardcoded style attributes from RainTPL templates. Exception: In tpl/tagcloud.html, the display size of each tag is computed at page generation. Signed-off-by: VirtualTam --- inc/shaarli.css | 117 ++++++++++++++++++++++++++++++++++++++- tpl/addlink.html | 4 +- tpl/changetag.html | 5 +- tpl/daily.html | 17 +++--- tpl/editlink.html | 14 ++--- tpl/export.html | 5 +- tpl/install.html | 11 ++-- tpl/linklist.html | 14 ++--- tpl/linklist.paging.html | 4 +- tpl/loginform.html | 4 +- tpl/page.footer.html | 2 +- tpl/page.header.html | 4 +- tpl/tagcloud.html | 4 +- tpl/tools.html | 4 +- 14 files changed, 161 insertions(+), 48 deletions(-) diff --git a/inc/shaarli.css b/inc/shaarli.css index 22000ba..e7396cc 100644 --- a/inc/shaarli.css +++ b/inc/shaarli.css @@ -118,6 +118,14 @@ h1 { cursor: pointer; } +#pageheader #linkcount { + float: right; + font-style: italic; + color: #bbb; + text-align: right; + padding-right: 5px; +} + #pageheader { background-color: #333333; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#333333), to(#111111)); @@ -149,10 +157,19 @@ h1 { text-decoration: none; } +#pageheader .search { + width: 100%; + white-space: nowrap; +} + #toolsdiv a { clear: both; } +#toolsdiv #bookmark { + clear: none; +} + #toolsdiv a span { color: #ffffff; } @@ -191,6 +208,18 @@ h1 { padding: 0; } +.searchform #searchform_value { + width: 30%; +} + +.tagfilter { + margin-left:24px; +} + +.tagfilter #tagfilter_value { + width: 10%; +} + .tagfilter input.bigbutton, .searchform input.bigbutton, .addform input.bigbutton { background-color: #dedede; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#dedede), to(#ffffff)); @@ -271,6 +300,14 @@ h1 { padding-right: 5px; } +#paging_linksperpage form.linksperpage { + display: inline; +} + +#paging_linksperpage form.linksperpage input { + height: 15px; +} + #paging_current { display: inline; color: #fff; @@ -291,6 +328,10 @@ h1 { clear: both; } +#headerform input.linkurl { + width: 50%; +} + #toolsdiv { color: #ffffff; padding: 5px 5px 5px 5px; @@ -311,6 +352,10 @@ h1 { clear: left; } +#editlinkform textarea, #editlinkform .lf_input { + width: 100%; +} + #linklist li { padding: 4px 10px 15px 20px; border-top: 1px solid #bbb; @@ -339,6 +384,16 @@ h1 { color:#E28E3F; } +.linkqrcode { + display: inline; + position: relative; +} + +a.qrcode img { + width: 13px; + height: 13px; +} + #linklist li.private { background: url('../images/private.png') no-repeat 10px center; padding-left: 60px; @@ -440,6 +495,12 @@ h1 { text-decoration: none; } +.linktag .remove { + border-left: 1px solid #aaa; + padding-left: 5px; + color:#6767A7; +} + .linkshort { font-size: 8pt; color: #888; @@ -466,11 +527,11 @@ h1 { clear: both; } -#footer a { +#footer a { color: #486D08; } -#footer a:hover { +#footer a:hover { color: #000000; } @@ -484,16 +545,41 @@ h1 { font-size: 9pt; } +#newversion #version_id { + text-decoration: blink; +} + #cloudtag { padding-left: 10%; padding-right: 10%; } +#cloudtag .count { + color: #99f; + font-size: 9pt; + padding-left: 5px; + padding-right: 2px; +} + #cloudtag a { + font-weight:bold; color: black; text-decoration: none; } +#install { + margin: 0 20px; +} + +#installform { + border: 1px solid black; + padding: 10px; +} + +#installform table { + border: none; +} + #installform td { font-size: 10pt; color: black; @@ -501,6 +587,10 @@ h1 { clear: left; } +#installform input.bigbutton { + float: right; +} + #changepasswordform { color: #ccc; padding: 10px 5px 10px 5px; @@ -513,6 +603,10 @@ h1 { clear: left; } +#changetag #totag { + margin-left: 40px; +} + #configform td { color: #ccc; font-size: 10pt; @@ -676,6 +770,14 @@ div.dailyAbout a { color: #890500; } +div.dailyAbout img { + position: relative; + top: 3px; + margin-right: 4px; + width: 14px; + height: 14px; +} + div.dailyTitle { font-weight: bold; font-size: 44pt; @@ -726,6 +828,17 @@ div.dailyEntryDescription { overflow: auto; } +div.dailyNoEntry { + text-align: center; + padding: 40px 0px 90px 0px; +} + +.daily #closing { + clear: both; + text-align: center; + padding-bottom: 20px; +} + /* Common CSS screwdriver */ .clear { clear: both; diff --git a/tpl/addlink.html b/tpl/addlink.html index 853715d..da50f45 100644 --- a/tpl/addlink.html +++ b/tpl/addlink.html @@ -6,11 +6,11 @@ {include="page.header"}
- +
{include="page.footer"} - \ No newline at end of file + diff --git a/tpl/changetag.html b/tpl/changetag.html index b22bdde..79fea9a 100644 --- a/tpl/changetag.html +++ b/tpl/changetag.html @@ -9,7 +9,8 @@
Tag: - + +   or 
(Case sensitive)
@@ -23,4 +24,4 @@ $(document).ready(function() {/if} - \ No newline at end of file + diff --git a/tpl/daily.html b/tpl/daily.html index 4bc8568..c15a706 100644 --- a/tpl/daily.html +++ b/tpl/daily.html @@ -10,17 +10,17 @@ - {if="$nextday"}Next day>{else}Next day>{/if}

- Daily RSS Feed + Daily RSS Feed
The Daily Shaarli
——————————— {$day} ———————————
-
+
{if="$linksToDisplay"}
{loop="col1"}
-
permalink
+
permalink
{if="$value.tags"}
{loop="value.taglist"}{$value|htmlspecialchars} - {/loop}
{/if}
{$value.title|htmlspecialchars}
{if="$value.thumbnail"}
{$value.thumbnail}
{/if} @@ -32,7 +32,7 @@
{loop="col2"}
-
permalink
+
permalink
{if="$value.tags"}
{loop="value.taglist"}{$value|htmlspecialchars} - {/loop}
{/if}
{$value.title|htmlspecialchars}
{if="$value.thumbnail"}
{$value.thumbnail}
{/if} @@ -44,7 +44,7 @@
{loop="col3"}
-
permalink
+
permalink
{if="$value.tags"}
{loop="value.taglist"}{$value|htmlspecialchars} - {/loop}
{/if}
{$value.title|htmlspecialchars}
{if="$value.thumbnail"}
{$value.thumbnail}
{/if} @@ -53,11 +53,10 @@ {/loop}
{else} -
No articles on this day.
+
No articles on this day.
{/if} -
-
-
+
-
{include="page.footer"} - \ No newline at end of file + diff --git a/tpl/editlink.html b/tpl/editlink.html index 48945a3..454dfff 100644 --- a/tpl/editlink.html +++ b/tpl/editlink.html @@ -12,10 +12,10 @@
- URL

- Title

- Description

- Tags

+ URL

+ Title

+ Description

+ Tags

{if="($link_is_new && $GLOBALS['privateLinkByDefault']==true) || $link.private == true"}  
@@ -23,9 +23,9 @@  
{/if} - - - {if="!$link_is_new"}{/if} + + + {if="!$link_is_new"}{/if} {if="$http_referer"}{/if}
diff --git a/tpl/export.html b/tpl/export.html index 938cbe6..911b02c 100644 --- a/tpl/export.html +++ b/tpl/export.html @@ -7,9 +7,10 @@
{include="page.footer"} - \ No newline at end of file + diff --git a/tpl/install.html b/tpl/install.html index 4034ef1..32b8811 100644 --- a/tpl/install.html +++ b/tpl/install.html @@ -2,20 +2,19 @@ {include="includes"}{$timezone_js} -
+

Shaarli

It looks like it's the first time you run Shaarli. Please configure it:
-
-
- + +
{$timezone_html} - +
Login:
Password:
Page title:
{include="page.footer"} - \ No newline at end of file + diff --git a/tpl/linklist.html b/tpl/linklist.html index d33fc3c..eadbc4c 100644 --- a/tpl/linklist.html +++ b/tpl/linklist.html @@ -4,9 +4,9 @@ diff --git a/tpl/loginform.html b/tpl/loginform.html index 805a014..954f6f1 100644 --- a/tpl/loginform.html +++ b/tpl/loginform.html @@ -13,7 +13,7 @@ Login:     Password :
- + {if="$returnurl"}{/if} @@ -23,4 +23,4 @@ {include="page.footer"} - \ No newline at end of file + diff --git a/tpl/page.footer.html b/tpl/page.footer.html index 8e5869c..b494bf7 100644 --- a/tpl/page.footer.html +++ b/tpl/page.footer.html @@ -2,7 +2,7 @@ Shaarli {$version|htmlspecialchars} - The personal, minimalist, super-fast, no-database delicious clone. By sebsauvage.net. Theme by idleman.fr.
{if="$newversion"} -
● Shaarli {$newversion|htmlspecialchars} is available.
+
● Shaarli {$newversion|htmlspecialchars} is available.
{/if} {if="isLoggedIn()"} diff --git a/tpl/page.header.html b/tpl/page.header.html index 654a551..17c0c75 100644 --- a/tpl/page.header.html +++ b/tpl/page.header.html @@ -1,6 +1,6 @@ -
Shaare your links...
+
Shaare your links...
{if="!empty($linkcount)"}{$linkcount} links{/if}
{$shaarlititle|htmlspecialchars} @@ -17,7 +17,7 @@ {/if} RSS Feed {if="$GLOBALS['config']['SHOW_ATOM']"} - ATOM Feed + ATOM Feed {/if} Tag cloud Picture wall diff --git a/tpl/tagcloud.html b/tpl/tagcloud.html index 0dd2c0d..9418e24 100644 --- a/tpl/tagcloud.html +++ b/tpl/tagcloud.html @@ -6,10 +6,10 @@
{loop="tags"} - {$value.count}{$key|htmlspecialchars} + {$value.count}{$key|htmlspecialchars} {/loop}
{include="page.footer"} - \ No newline at end of file + diff --git a/tpl/tools.html b/tpl/tools.html index ba1c1e8..ae31902 100644 --- a/tpl/tools.html +++ b/tpl/tools.html @@ -10,10 +10,10 @@ Rename/delete tags : Rename or delete a tag in all links

Import : Import Netscape html bookmarks (as exported from Firefox, Chrome, Opera, delicious...)

Export : Export Netscape html bookmarks (which can be imported in Firefox, Chrome, Opera, delicious...)

- Shaare link ⇐ Drag this link to your bookmarks toolbar (or right-click it and choose Bookmark This Link....).
    Then click "Shaare link" button in any page you want to share.

+ Shaare link ⇐ Drag this link to your bookmarks toolbar (or right-click it and choose Bookmark This Link....).
    Then click "Shaare link" button in any page you want to share.

{include="page.footer"} - \ No newline at end of file +