From 0069cc3792f75f85c9d0a402083f9bdc9d8377be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20Guillot?= <fred@miniflux.net>
Date: Sat, 26 Jul 2014 07:20:51 -0400
Subject: [PATCH] Add new theme: Cards (pull-request #224)

---
 README.markdown                 |   1 +
 docs/themes.markdown            |   1 +
 templates/bookmark_links.php    |   1 +
 templates/item.php              |   1 +
 templates/status_links.php      |   3 +-
 themes/cards/css/app.css        | 214 ++++++++++++++++++++++++++++++++
 themes/cards/css/feed-color.css |  28 +++++
 themes/cards/img/cross.png      | Bin 0 -> 362 bytes
 themes/cards/img/star.png       | Bin 0 -> 588 bytes
 themes/cards/img/tick.png       | Bin 0 -> 420 bytes
 10 files changed, 248 insertions(+), 1 deletion(-)
 create mode 100644 themes/cards/css/app.css
 create mode 100644 themes/cards/css/feed-color.css
 create mode 100644 themes/cards/img/cross.png
 create mode 100644 themes/cards/img/star.png
 create mode 100644 themes/cards/img/tick.png

diff --git a/README.markdown b/README.markdown
index c3aa382..13fb82b 100644
--- a/README.markdown
+++ b/README.markdown
@@ -91,6 +91,7 @@ Original author: [Frédéric Guillot](http://fredericguillot.com/)
 People who sent a pull-request, report a bug, make a new theme or share a super cool idea:
 
 - André Kelpe: https://github.com/fs111
+- Augustin Lacour: https://github.com/gugu4-9
 - Ayodio: https://github.com/ayodio
 - Bjauy: https://github.com/bjauy
 - Bohwaz: https://github.com/bohwaz
diff --git a/docs/themes.markdown b/docs/themes.markdown
index f650c9c..dcc330e 100644
--- a/docs/themes.markdown
+++ b/docs/themes.markdown
@@ -35,6 +35,7 @@ Other themes included in the default installation:
 
 - Bootstrap 3 (Light) by Silvus
 - Bootswatch Cyborg by Silvus
+- Cards by Augustin Lacour
 - Copper by Nicolas Dewaele
 - Green by Maxime (aka EpocDotFr)
 - Midnight by Luca Marra
diff --git a/templates/bookmark_links.php b/templates/bookmark_links.php
index 16bbd2c..ad20af5 100644
--- a/templates/bookmark_links.php
+++ b/templates/bookmark_links.php
@@ -12,6 +12,7 @@
 <?php else: ?>
     <a
         id="bookmark-<?= $item['id'] ?>"
+        class="item-bookmark"
         href="?action=bookmark&amp;value=1&amp;id=<?= $item['id'] ?>&amp;menu=<?= $menu ?>&amp;offset=<?= $offset ?>&amp;source=<?= $source ?>"
         data-action="bookmark"
         data-item-id="<?= $item['id'] ?>"
diff --git a/templates/item.php b/templates/item.php
index 5de375f..0f287ea 100644
--- a/templates/item.php
+++ b/templates/item.php
@@ -1,5 +1,6 @@
 <article
     id="item-<?= $item['id'] ?>"
+    class="feed-<?= $item['feed_id'] ?>"
     data-item-id="<?= $item['id'] ?>"
     data-item-status="<?= $item['status'] ?>"
     data-item-bookmark="<?= $item['bookmark'] ?>"
diff --git a/templates/status_links.php b/templates/status_links.php
index 4e48a2e..c1cd602 100644
--- a/templates/status_links.php
+++ b/templates/status_links.php
@@ -1,10 +1,11 @@
 <li class="hide-mobile">
-    <a href="?action=mark-item-removed&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=<?= $redirect ?>&amp;feed_id=<?= $item['feed_id'] ?>"><?= t('remove') ?></a>
+    <a class="item-delete" href="?action=mark-item-removed&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=<?= $redirect ?>&amp;feed_id=<?= $item['feed_id'] ?>"><?= t('remove') ?></a>
 </li>
 <li>
 <?php if ($item['status'] == 'unread'): ?>
     <a
         id="status-<?= $item['id'] ?>"
+        class="item-mark"
         href="?action=mark-item-read&amp;id=<?= $item['id'] ?>&amp;offset=<?= $offset ?>&amp;redirect=<?= $redirect ?>&amp;feed_id=<?= $item['feed_id'] ?>"
         data-action="mark-read"
         data-item-id="<?= $item['id'] ?>"
diff --git a/themes/cards/css/app.css b/themes/cards/css/app.css
new file mode 100644
index 0000000..d8aaca6
--- /dev/null
+++ b/themes/cards/css/app.css
@@ -0,0 +1,214 @@
+@import url('../../../assets/css/app.css');
+@import url("feed-color.css");
+
+body {
+    max-width: 960px;
+}
+
+/* header */
+header {
+    margin-bottom: 0;
+    margin-top: 20px;
+    background-color: #e4e4e4;
+    padding: 16px 16px;
+    position: relative;
+}
+
+@media only screen and (min-width: 980px) {
+    header::before{
+        content: "";
+        position: absolute;
+        bottom : -15px;
+        left: 0px;
+
+        width: 0;
+        height: 0;
+        border-style: solid;
+        border-width: 0 15px 15px 0;
+        border-color: transparent #d0d0d0 transparent transparent;
+    }
+
+    header::after{
+        content: "";
+        position: absolute;
+        bottom : -15px;
+        right: 0px;
+
+        width: 0;
+        height: 0;
+        border-style: solid;
+        border-width: 15px 15px 0 0;
+        border-color: #d0d0d0 transparent transparent 
+    }
+}
+
+header ul {
+    font-size: 100%;
+}
+
+header a {
+    color: #7c7c7c;
+}
+
+nav .active a {
+    font-weight: normal;
+}
+
+.logo {
+    color: #559966;
+}
+
+.page{
+    max-width: 930px;
+    margin: auto;
+}
+
+.page-header{
+    background-color: #eeeeee;
+    border: 1px solid #e4e4e4;
+    padding: 13px 13px;
+}
+
+.page-section h2,
+.page-header h2 {
+    color: #333;
+    border-bottom: 0;
+}
+
+.page-header h2,
+.page-header ul{
+    display: inline-block;
+}
+
+.page-header li {
+    font-size: 100%;
+    margin-left: 6px;
+    border-right: 1px solid #559966;
+}
+
+.page-header a{
+    text-decoration: none;
+    color: #559966;
+}
+
+/* items listing */
+.items article {
+    border: 0;
+    margin-bottom: 30px;
+    background-color: #e4e4e4;
+    width: 440px;
+    display: inline-block;
+    vertical-align: top;
+    position: relative;
+    margin-right : 25px;
+}
+
+.items article::before{
+    content: "";
+    position: absolute;
+    bottom: -5px;
+    left: 10px;
+    width: 42px;
+    height: 5px;
+}
+
+.items article:nth-child(2n+2){
+    margin-right : 0;
+}
+
+.items #current-item {
+    padding: 2px 2px;
+}
+.items #current-item::before{
+    bottom: -9px;
+    left: 7px;
+    width: 430px;
+    height: 3px;
+    -webkit-transition: width 200ms ease;
+       -moz-transition: width 200ms ease;
+        -ms-transition: width 200ms ease;
+         -o-transition: width 200ms ease;
+            transition: width 200ms ease;
+}
+
+.items h2 {
+    padding: 3px 0 11px 5px;
+    font-weight: normal;
+    min-height: 35px;
+}
+
+.items .preview {
+    line-height: 1.25em;
+    font-size: 100%;
+    font-family: Georgia, serif;
+    overflow: auto;
+    color: #949494;
+    background-color: #eeeeee;
+    padding: 5px 5px;
+    min-height: 125px;
+    width: 430px;
+}
+
+.items .item-menu{
+    font-size: 76%;
+    padding: 5px 0 0 5px;
+    color: #929292;
+}
+
+.items .item-menu a{
+    color: #929292;
+}
+
+.items .item-menu .item-bookmark,
+.items .item-menu .item-delete,
+.items .item-menu .item-mark{
+    color: transparent;
+    text-indent: -9999px;
+    background-repeat: no-repeat;
+    background-position: center center;
+    display: inline-block;
+    width: 15px;
+    height: 15px;
+}
+
+.items .item-menu .item-bookmark{
+    background-image: url("../img/star.png");
+}
+
+.items .item-menu .item-delete{
+    background-image: url("../img/cross.png");
+}
+
+.items .item-menu .item-mark{
+    background-image: url("../img/tick.png");
+}
+
+/* item */
+.item-menu li,
+ul.item-infos li {
+    border-right: 1px solid #929292;
+}
+
+/* responsive for big screen */
+@media only screen and (min-width: 1440px) {
+    body{max-width: 1435px;}
+    .page{max-width: 1405px;}
+    .items article {margin-right : 23px;}
+    .items article:nth-child(2n+2){margin-right : 23px;}
+    .items article:nth-child(3n+3){margin-right : 0;}
+}
+/* responsive for little screen */
+@media only screen and (max-width: 980px) {
+    header {margin-top: 0px;}
+    .items article {
+        margin-bottom: 20px;
+        width: 100%;
+        margin-right : 0;
+        padding: 5px 0;
+    }
+    .items h2{min-height: initial;}
+    .items .preview {
+        width: 98%;
+        min-height: initial;
+    }
+}
\ No newline at end of file
diff --git a/themes/cards/css/feed-color.css b/themes/cards/css/feed-color.css
new file mode 100644
index 0000000..f6717a3
--- /dev/null
+++ b/themes/cards/css/feed-color.css
@@ -0,0 +1,28 @@
+/*
+Feuille de style contenant la couleur associée à chaque flux
+à remplir manuellement, pour l'instant ;)
+
+A color is associated too every feed,
+feel free to customise it, manualy, for the moment ;)
+
+actual colors from : https://github.com/mrmrs/colors
+*/
+
+
+.feed-1::before{background-color: #001F3F; }
+.feed-2::before{background-color: #7FDBFF; }
+.feed-3::before{background-color: #3D9970; }
+.feed-4::before{background-color: #0074D9; }
+.feed-5::before{background-color: #39CCCC; }
+.feed-6::before{background-color: #2ECC40; }
+.feed-7::before{background-color: #01FF70; }
+.feed-8::before{background-color: #aaa; }
+.feed-9::before{background-color: #111;}
+.feed-10::before{background-color: #FF851B; }
+.feed-11::before{background-color: #F012BE; }
+.feed-12::before{background-color: #fff; }
+.feed-13::before{background-color: #85144B; }
+.feed-14::before{background-color: #B10DC9; }
+.feed-15::before{background-color: #ddd; }
+.feed-16::before{background-color: #FF4136; }
+.feed-17::before{background-color: #FFDC00; }
\ No newline at end of file
diff --git a/themes/cards/img/cross.png b/themes/cards/img/cross.png
new file mode 100644
index 0000000000000000000000000000000000000000..8fae3eef67cbef0187dc5eaf4c8eb167eb3fe6be
GIT binary patch
literal 362
zcmeAS@N?(olHy`uVBq!ia0vp^AT}2V8<6ZZI=>f4u@pObhHwBu4M$1`kk47*5m^jW
ze;tGwoit`w00kvWTq8<?^V3So6N^$A%FE03GV`*FlM@S4_413-XTP(N0xEj$>Eak7
zF*WwW!Oj)~k%ou%hJn|(SPt@i+oo{&*f)VSC!9U_FCSCL5p7CfHJ))Kh2OgC&F*K-
zf8KLuzfE7XK{N0Eu^CfOTRfLqdPP<uWzmLKkL^odpR~LlGx1uLkkcIo?PG;Glh!To
zx{&)KvMrr|!Pa>Vd^4Om_I|kcc#ieP^I4j%EE)VMJ&~>7|NYT={cE|(7CBeX7$=T+
z_w9R*O=r2sG5_k<m;7=M9ioNA`{TR>Z!fVs$9mMF@9h7AhT?;3(j?>eR^5N;;y$@}
z-Te~VP^FUHtKJDo6rJnWW->Uo#>nQk?dkRu`8vkf-j==b->&TkdYQq~)z4*}Q$iB}
Dj+m2|

literal 0
HcmV?d00001

diff --git a/themes/cards/img/star.png b/themes/cards/img/star.png
new file mode 100644
index 0000000000000000000000000000000000000000..2302012ecbc2fa8c7a51bd7a95650f50606ce55b
GIT binary patch
literal 588
zcmV-S0<-;zP)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV00004b3#c}2nYxW
zd<bNS00009a7bBm000fw000fw0YWI7cmMzZ8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H10m(^3K~y-6b&@e?Q&AL#zjN~fB3Nh#X`rB+ODK*Gr4V!xTpUDN
z<h=_;5S$zY>5w7ALvR)h8Qx1a5n79m>g*yoxHuGa3J9$b!6C`Jzsn0GG4D)=|D6B-
z&pG$ncs!;m@;tu|;JyD^)e}{+0ZB=jRtmVPLYk(LneCa`UYe$rMwJ3vTU)n*Q{c4B
zS4O3B2q8AJ{wxRHt?IMc5z{nvjYi{Ay<T4{isG`QkM(-}D!^ni`C(=^Yqi?1$z(Db
z4u^jZ4-W%?b-UdsX4U~N0wdrza1MO%-aiA#^ZYq*3)leGfi>W-q_&O6WAZ$I2(-=Y
zUXmoAtJVVO_xm>_y#YGj`<?^v-uEOONIJ=~Y`=<}W!b)@6G;c&``*G000x6WGlcNo
z%w8l(@^Z=fv81QYxjS(jf1BY8&sY|YLI@X@-An9fp8TIc8Le8a_Ng3sC(E)OfD&sh
zH!rWS5kmMb>56l%Bk4YXnY|7nw9V|NbM9Ik$LA|2D2ifN(wUikk+eCTPPeDi>9(ZJ
z5<4r3Vt1ai@DrVLElKOZBk%q3T<Jlc=XcHQm6^4Gw<{-*G>W3AxkLuQdw(27QB%@r
a9{&eamDg<Mp%YmE0000<MNUMnLSTZu_yFSo

literal 0
HcmV?d00001

diff --git a/themes/cards/img/tick.png b/themes/cards/img/tick.png
new file mode 100644
index 0000000000000000000000000000000000000000..a39431dd78b8d2632f1bfbeacf490cb2ae92c56b
GIT binary patch
literal 420
zcmV;V0bBlwP)<h;3K|Lk000e1NJLTq000gE000UI1^@s6gxPP$00004b3#c}2nYxW
zd<bNS00009a7bBm000fw000fw0YWI7cmMzZ8FWQhbW?9;ba!ELWdL_~cP?peYja~^
zaAhuUa%Y?FJQ@H10U=35K~yM_jgc`+13?glzqy6;$~0O?ECfMB5n^j&5laiZz!f22
zaYY(IOl4ywSXx@_UQ+u5(&QAZ0&<Oi!a}q-@p56aHW$$tA=Aw~zG2=QDT;zcD~{uJ
z=Ufb&$f97k+ug9%4n$-PNEQNnz22s^b^xq8=bk;!t9#|Po&O+X%(k`mp@h=$czn=o
zHeXb=T0IBu(lmXo)oQ~TPrJYXSOJE<?;o~Wtv3KqL@I!Y$c@(ebP8#$_ndPHunasZ
zrRrfAzE5>2iUO_mg@{}NIOjS_sr$)f(g!L)5(L3fqtW>IdChk?#+WnUx}1-IC7_>W
z*>Stw{+#vxD^+7m2e>NRr##R1qbM593+>N4wAQyk-S_>iFbwl~5Wp9~l6q04fi*?|
O0000<MNUMnLSTZ5B&_}b

literal 0
HcmV?d00001