From ab4e63b59cc415edc25e2b38fc8315d79d023bdd Mon Sep 17 00:00:00 2001
From: Teromene <teromene@teromene.fr>
Date: Tue, 2 Aug 2016 18:56:12 +0200
Subject: [PATCH] New style for rss-bridge

---
 css/style.css     | 215 ++++++++++++++++++++++------------------------
 lib/HTMLUtils.php |   2 +-
 2 files changed, 102 insertions(+), 115 deletions(-)

diff --git a/css/style.css b/css/style.css
index 36f25b78..e378f573 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,143 +1,130 @@
-/* html5 boilerplate from http://csswizardry.com/2011/01/the-real-html5-boilerplate/  */
-/*------------------------------------*\
-    RESET
-\*------------------------------------*/
-/* http://meyerweb.com/eric/tools/css/reset/ 
-    v2.0b1 | 201101 
-    NOTE:WORK IN PROGRESS
-    USE WITH CAUTION AND TEST WITH ABANDON */
+html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
+
+    margin: 0;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
 
-html,body,div,span,applet,object,iframe,
-h1,h2,h3,h4,h5,h6,p,blockquote,pre,
-a,abbr,acronym,address,big,cite,code,
-del,dfn,em,img,ins,kbd,q,s,samp,
-small,strike,strong,sub,sup,tt,var,
-b,u,i,center,
-dl,dt,dd,ol,ul,li,
-fieldset,form,label,legend,
-table,caption,tbody,tfoot,thead,tr,th,td,
-article,aside,canvas,details,figcaption,figure,
-footer,header,hgroup,menu,nav,section,summary,
-time,mark,audio,video{
-    margin:0;
-    padding:0;
-    border:0;
-    outline:0;
-    font-size:100%;
-    font:inherit;
-    vertical-align:baseline;
 }
 /* HTML5 display-role reset for older browsers */
-article,aside,details,figcaption,figure,
-footer,header,hgroup,menu,nav,section{
-    display:block;
-}
-body{
-    line-height:1;
-}
-ol,ul{
-    list-style:none;
-}
-blockquote,q{
-    quotes:none;
-}
-blockquote:before,blockquote:after,
-q:before,q:after{
-    content:’’;
-    content:none;
-}
-/* remember to define visible focus styles! 
-:focus{
-    outline:?????;
-} */
+article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
+
+    display: block;
 
-/* remember to highlight inserts somehow! */
-ins{
-    text-decoration:none;
-}
-del{
-    text-decoration:line-through;
 }
 
-table{
-    border-collapse:collapse;
-    border-spacing:0;
-}
-
-
-/*------------------------------------*\
-    $MAIN
-\*------------------------------------*/
-/* GO! */
-
+/* Let's go for the actual style */
 
 body {
-    font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
-    font-size: 120%;
+
+	background-color: #EEEEEE;
+	font-family: 'Noto Sans';
+
 }
 
-h1 {
-    font-size: 300%;
-    font-weight: bold;
-    text-shadow: 0 5px 6px rgba(150,150,150,0.69);
+header {
+
+	text-shadow:0 5px 6px rgba(150,150,150,0.69);
+	text-align: center;
+	color: #1182DB;
+
 }
 
-h2 {
-    font-size: 120%;
-    margin-bottom: 10px;
+header > h1 {
+
+	font-size: 300%;
+
 }
 
-h2 a {
-    color:black;
-}
+header > h2 {
 
-form {
-    margin-bottom: 10px;
-}
+	margin-left: 1em;
+	font-size: 120%;
 
-header,footer {
-    max-width: 600px;
-    margin: 0 auto;
-    padding: 20px;
-}
-
-header h2 {
-	margin-left:1em;
-}
-
-footer {
-    text-align: center;
-    font-size: 80%;
 }
 
 section {
-    max-width: 600px;
-    margin: 30px auto;
-    padding: 10px 15px;
-    -webkit-box-shadow: 0 0 9px rgba(50,50,50,0.51);
-    -moz-box-shadow: 0 0 9px rgba(50,50,50,0.51);
-    box-shadow: 0 0 9px rgba(50,50,50,0.51);
-    background: #f5f5f5;
+
+	background-color: #FFFFFF;
+	width: 80%;
+	margin: 30px auto;
+	padding: 10px 15px;
+	text-align: center;
+
+	box-shadow: 0px 1px 2px rgba(0,0,0, 0.25);
+
+}
+
+section > h2 {
+
+	font-size: 200%;
+	font-weight: bold;
+
+}
+
+a, a:link, a:visited {
+
+	color: #2196F3;
+
+}
+
+button {
+
+	line-height: 1.9em;
+	color: #FFF;
+	font-weight: bold;
+	vertical-align: middle;
+	padding: 6px 12px;
+	margin: 12px auto 0px;
+	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
+	border-radius: 2px;
+	border: 1px solid transparent;
+	min-width: 140px;
+	background: #2196F3 none repeat scroll 0% 0%;
+	cursor: pointer;
+
+	width: calc(20% - 4px);
+
 }
 
 .description {
-    font-size:70%;
-    margin-bottom: 10px;
-    position:relative;
-    bottom: 5px;
-    color: #555;
+
+	margin: 10px;
+	text-decoration: underline;
+
+}
+
+h5 {
+
+	margin: 20px;
+	font-weight: bold;
+
+}
+
+form {
+
+	margin-bottom: 6px;
+
 }
 
 .maintainer {
-    font-size:60%;
-    float:right;
-    color: #777;
+
+	font-size: 60%;
+	text-align: right;
+
 }
 
-.placeholder {
-    color: #aaa;
-}
+input[type="text"] {
+
+	background-color: white;
+	color: #404552;
+	border: 0px;
+	border-bottom: 2px solid #2196F3;
+	font-size: 1.1em;
+	margin-left: 8px;
+	padding-left: 4px;
 
-input, label {
-    font-size: 80%;
 }
diff --git a/lib/HTMLUtils.php b/lib/HTMLUtils.php
index 1e2f0f78..ce08efa0 100644
--- a/lib/HTMLUtils.php
+++ b/lib/HTMLUtils.php
@@ -141,7 +141,7 @@ CARD;
 
 		}
 
-		$card .= '<span class="maintainer">'.$bridgeElement->maintainer.'</span>';
+		$card .= '<p class="maintainer">'.$bridgeElement->maintainer.'</p>';
 		$card .= '</section>';
 
 		return $card;