Merge branch 'AI3074-community_dashboard' of gitlab.com:participa/noosfero into …

…AI3074-community_dashboard

Merge branch 'AI3074-community_dashboard' of gitlab.com:participa/noosfero into …
…AI3074-community_dashboard
Evandro Junior
2 parents d403329c 1b74f3d7
Showing 1 changed file with 208 additions and 17 deletions Show diff stats
plugins/community_hub/public/style.css
@@ -4,39 +4,230 @@
 }
 .hub {
-	border:1px solid red;
+    /*border: 1px solid red;*/
 }
-.hub .title {}
+.hub ul {padding-left: 0px; margin-top: 0;}
-.hub .description {}
+#content .hub h1{
+	margin-bottom: 0;
+}
+
+
+#content .hub .title {
+    font-size: 33px;
+    font-weight: normal;
+    padding-right: 70px;
+	 color: #4b7421;
+	 font-variant: normal;
+}
+
+.hub .description {
+	font-size: 14px;
+}
+
+.hub .post{
+	border-bottom: 1px solid #ddd !important;
+	background: url("images/hub-time-bg.gif") repeat-y	left top #fff;
+}
+
+.hub .time{
+    display: inline-block;
+    font-size: 8px;
+    padding-top: 10px;
+    text-align: center;
+    vertical-align: top;
+    width: 35px;
+}
+
+.hub .avatar{
+    background-color: lightGray;
+    display: inline-block;
+    height: 43px;
+    margin: 0 10px;
+    vertical-align: top;
+    width: 43px;
+}
+
+.hub .message{
+    display: inline-block;
+    width: 70%;
+}
+
+.hub .mediation-bar{
+    display: inline-block;
+    margin: 10px 0 10px 104px;
+    width: 70%;
+
+}
+
+.hub .mediation-bar ul {}
+
+.hub .mediation-bar ul li {
+    display: inline-block;
+    margin-right: 5px;
+    overflow: hidden;
+    text-indent: -1000px;
+    width: 16px;
+}
+
+.hub .mediation-bar ul li.likes-dislikes{
+    overflow: visible;
+    text-indent: 0px;
+    width: auto;
+	 vertical-align: top;
+}
+
+.hub .mediation-bar ul li.pin{
+	height: 25px;
+}
+
+.hub .remove{}
+
+.hub .mediation-bar ul li a{
+	text-indent: -10000px;
+}
+
+.hub .promote{
+	background: url("images/hub-promote-icon.png") no-repeat center center #fff;
+}
+
+.hub .pin{
+	background: url("images/hub-pin-icon.png") no-repeat center center #fff;
+}
+
+.hub .mediation-bar ul li.pin {
+	float: right;
+}
+
+/**/
 .hub .live {
-	border:1px solid red;
+    border: 0px solid lightGray;
+    display: inline-block;
+    float: left;
+    width: 49%;
+	margin-bottom: 2em;
 }
-.hub .live .title {}
+.hub ul#live-posts, .hub ul#mediation-posts{
+    height: 500px;
+    overflow-x: hidden;
+    overflow-y: scroll;
+	border-width: 0 1px 1px;
+	border-style: solid;
+	border-color: lightGray;
+	padding-top: 10px;
+}
-.hub .live .on-air {}
-.hub .live .off-air {}
+#content .main-block .hub .live h1{
+	 background-color: #f4f4f4;
+	 border: 1px solid lightGray
+}
-.hub .mediation {
-	border:1px solid green;
+#content .hub .live .title {
+    color: #656565;
+    display: inline-block;
+    font-size: 20px;
+	 font-family: Arial Black, arial, sans-serif;
+    padding-right: 0;
+    width: 70%;
 }
+#content .hub .live .on-air {
+    background-color: #d40000;
+    border-radius: 10px 10px 10px 10px;
+    color: white;
+    display: inline-block;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0 0.5em;
+    text-align: center;
+    text-transform: uppercase;
+    vertical-align: top;
+    width: 20%;
-.hub .mediation .title {}
+}
+#content .hub .live .off-air {
+    background-color: gray;
+    border-radius: 10px 10px 10px 10px;
+    color: black;
+    display: inline-block;
+    font-size: 16px;
+    font-weight: bold;
+    padding: 0 0.5em;
+    text-align: center;
+    text-transform: uppercase;
+    vertical-align: top;
+    width: 20%;
+}
-.hub .mediation .expand {}
-.hub .form {}
+.hub .mediation {
+	border: 0px solid lightGray;
+	display: inline-block;
+	clear: right;
+	float: none;
+	margin-left: 1%;
+	width: 50%;
+	margin-bottom: 2em;
+}
+#content .main-block .hub .mediation h1{
+    background-color: #ed8e01;
+	 border: 1px solid lightGray
+}
+
+#content .hub .mediation .title {
+    color: white;
+    display: inline-block;
+    font-size: 20px;
+	 font-family: Arial Black, arial, sans-serif;
+    padding-right: 0;
+    width: 100%;
+	/*font-variant: normal;*/
+}
+.hub .mediation .expand {
+    float: right;
+    padding-right: 1em;
+}
+.hub .form {
+    clear: left;
+    float: left;
+    width: 49%;
+}
 .hub .settings {
-	border:1px solid red;
+   /* border: 1px solid red;*/
+}
+
+.hub div.settings {
+    float: right;
+    width: 50%;
+}
+
+.hub ul.settings li{
+    height: 50px;
+    line-height: 50px;
+    margin-bottom: 10px;
+	 padding: 0 10px;
+	/* background: url("images/hub-arrow-right.png") no-repeat 90% top #ed8e01;*/
+}
+
+#content .hub ul.settings li a{
+    color: white;
+    font-family: Arial Black, arial, sans-serif;
+    font-size: large;
+    font-weight: normal;
+}
+
+#content .hub form input.button.submit {
+	 font-family: Arial Black, arial, sans-serif;
+    font-size: small;
+    font-weight: normal;
+	 color: #333;
+	 margin-top: 10px;
 }
-.hub .settings .twitter,
-.hub .settings .facebook,
-.hub .settings .general {
-	border:1px solid red;	
+.hub .settings .twitter, .hub .settings .facebook, .hub .settings .general {
+   /* border: 1px solid red;*/
 }
	@@ -4,39 +4,230 @@		@@ -4,39 +4,230 @@
4	}	4	}
5		5
6	.hub {	6	.hub {
7	- border:1px solid red;	7	+ /border: 1px solid red;/
8	}	8	}
9		9
10	-.hub .title {}	10	+.hub ul {padding-left: 0px; margin-top: 0;}
11		11
12	-.hub .description {}	12	+#content .hub h1{
		13	+ margin-bottom: 0;
		14	+}
		15	+
		16	+
		17	+#content .hub .title {
		18	+ font-size: 33px;
		19	+ font-weight: normal;
		20	+ padding-right: 70px;
		21	+ color: #4b7421;
		22	+ font-variant: normal;
		23	+}
		24	+
		25	+.hub .description {
		26	+ font-size: 14px;
		27	+}
		28	+
		29	+.hub .post{
		30	+ border-bottom: 1px solid #ddd !important;
		31	+ background: url("images/hub-time-bg.gif") repeat-y left top #fff;
		32	+}
		33	+
		34	+.hub .time{
		35	+ display: inline-block;
		36	+ font-size: 8px;
		37	+ padding-top: 10px;
		38	+ text-align: center;
		39	+ vertical-align: top;
		40	+ width: 35px;
		41	+}
		42	+
		43	+.hub .avatar{
		44	+ background-color: lightGray;
		45	+ display: inline-block;
		46	+ height: 43px;
		47	+ margin: 0 10px;
		48	+ vertical-align: top;
		49	+ width: 43px;
		50	+}
		51	+
		52	+.hub .message{
		53	+ display: inline-block;
		54	+ width: 70%;
		55	+}
		56	+
		57	+.hub .mediation-bar{
		58	+ display: inline-block;
		59	+ margin: 10px 0 10px 104px;
		60	+ width: 70%;
		61	+
		62	+}
		63	+
		64	+.hub .mediation-bar ul {}
		65	+
		66	+.hub .mediation-bar ul li {
		67	+ display: inline-block;
		68	+ margin-right: 5px;
		69	+ overflow: hidden;
		70	+ text-indent: -1000px;
		71	+ width: 16px;
		72	+}
		73	+
		74	+.hub .mediation-bar ul li.likes-dislikes{
		75	+ overflow: visible;
		76	+ text-indent: 0px;
		77	+ width: auto;
		78	+ vertical-align: top;
		79	+}
		80	+
		81	+.hub .mediation-bar ul li.pin{
		82	+ height: 25px;
		83	+}
		84	+
		85	+.hub .remove{}
		86	+
		87	+.hub .mediation-bar ul li a{
		88	+ text-indent: -10000px;
		89	+}
		90	+
		91	+.hub .promote{
		92	+ background: url("images/hub-promote-icon.png") no-repeat center center #fff;
		93	+}
		94	+
		95	+.hub .pin{
		96	+ background: url("images/hub-pin-icon.png") no-repeat center center #fff;
		97	+}
		98	+
		99	+.hub .mediation-bar ul li.pin {
		100	+ float: right;
		101	+}
		102	+
		103	+/**/
13		104
14	.hub .live {	105	.hub .live {
15	- border:1px solid red;	106	+ border: 0px solid lightGray;
		107	+ display: inline-block;
		108	+ float: left;
		109	+ width: 49%;
		110	+ margin-bottom: 2em;
16	}	111	}
17		112
18	-.hub .live .title {}	113	+.hub ul#live-posts, .hub ul#mediation-posts{
		114	+ height: 500px;
		115	+ overflow-x: hidden;
		116	+ overflow-y: scroll;
		117	+ border-width: 0 1px 1px;
		118	+ border-style: solid;
		119	+ border-color: lightGray;
		120	+ padding-top: 10px;
		121	+}
19		122
20	-.hub .live .on-air {}
21		123
22	-.hub .live .off-air {}	124	+#content .main-block .hub .live h1{
		125	+ background-color: #f4f4f4;
		126	+ border: 1px solid lightGray
		127	+}
23		128
24	-.hub .mediation {
25	- border:1px solid green;	129	+#content .hub .live .title {
		130	+ color: #656565;
		131	+ display: inline-block;
		132	+ font-size: 20px;
		133	+ font-family: Arial Black, arial, sans-serif;
		134	+ padding-right: 0;
		135	+ width: 70%;
26	}	136	}
		137	+#content .hub .live .on-air {
		138	+ background-color: #d40000;
		139	+ border-radius: 10px 10px 10px 10px;
		140	+ color: white;
		141	+ display: inline-block;
		142	+ font-size: 16px;
		143	+ font-weight: bold;
		144	+ padding: 0 0.5em;
		145	+ text-align: center;
		146	+ text-transform: uppercase;
		147	+ vertical-align: top;
		148	+ width: 20%;
27		149
28	-.hub .mediation .title {}	150	+}
		151	+#content .hub .live .off-air {
		152	+ background-color: gray;
		153	+ border-radius: 10px 10px 10px 10px;
		154	+ color: black;
		155	+ display: inline-block;
		156	+ font-size: 16px;
		157	+ font-weight: bold;
		158	+ padding: 0 0.5em;
		159	+ text-align: center;
		160	+ text-transform: uppercase;
		161	+ vertical-align: top;
		162	+ width: 20%;
		163	+}
29		164
30	-.hub .mediation .expand {}
31		165
32	-.hub .form {}	166	+.hub .mediation {
		167	+ border: 0px solid lightGray;
		168	+ display: inline-block;
		169	+ clear: right;
		170	+ float: none;
		171	+ margin-left: 1%;
		172	+ width: 50%;
		173	+ margin-bottom: 2em;
		174	+}
33		175
		176	+#content .main-block .hub .mediation h1{
		177	+ background-color: #ed8e01;
		178	+ border: 1px solid lightGray
		179	+}
		180	+
		181	+#content .hub .mediation .title {
		182	+ color: white;
		183	+ display: inline-block;
		184	+ font-size: 20px;
		185	+ font-family: Arial Black, arial, sans-serif;
		186	+ padding-right: 0;
		187	+ width: 100%;
		188	+ /font-variant: normal;/
		189	+}
		190	+.hub .mediation .expand {
		191	+ float: right;
		192	+ padding-right: 1em;
		193	+}
		194	+.hub .form {
		195	+ clear: left;
		196	+ float: left;
		197	+ width: 49%;
		198	+}
34	.hub .settings {	199	.hub .settings {
35	- border:1px solid red;	200	+ /* border: 1px solid red;*/
		201	+}
		202	+
		203	+.hub div.settings {
		204	+ float: right;
		205	+ width: 50%;
		206	+}
		207	+
		208	+.hub ul.settings li{
		209	+ height: 50px;
		210	+ line-height: 50px;
		211	+ margin-bottom: 10px;
		212	+ padding: 0 10px;
		213	+ /* background: url("images/hub-arrow-right.png") no-repeat 90% top #ed8e01;*/
		214	+}
		215	+
		216	+#content .hub ul.settings li a{
		217	+ color: white;
		218	+ font-family: Arial Black, arial, sans-serif;
		219	+ font-size: large;
		220	+ font-weight: normal;
		221	+}
		222	+
		223	+#content .hub form input.button.submit {
		224	+ font-family: Arial Black, arial, sans-serif;
		225	+ font-size: small;
		226	+ font-weight: normal;
		227	+ color: #333;
		228	+ margin-top: 10px;
36	}	229	}
37		230
38	-.hub .settings .twitter,
39	-.hub .settings .facebook,
40	-.hub .settings .general {
41	- border:1px solid red;	231	+.hub .settings .twitter, .hub .settings .facebook, .hub .settings .general {
		232	+ /* border: 1px solid red;*/
42	}	233	}