modified notifications items on home

fbormann
1 parent af269427
Showing 3 changed files with 34 additions and 31 deletions Show diff stats
app/templates/home.html
app/templates/home_teacher_student_content.html
core/static/css/base/amadeus.css
@@ -119,11 +119,11 @@
 		</div>
  
 	{% else %}
-		<ul class="timeline" style="-webkit-padding-start: 0px">
+		
 			<div id="timeline">
 				{% include page_template %}
 			</div>
-		</ul>
+		
 	{% endif %}
  
 	<div id="loading" class="alert alert-primary" role="alert" style="display: none">
 {% load static i18n %}
  
 {% for notification in objects %}
-    <li {% if not notification.read %}class="not_read"{% endif %}>
-        <div class="avatar">
-            <img src="{{ notification.user.image_url }}">
+    
+
+    <div class="well timeLine">
+    <div class="row">
+        <div class="col-md-12">
+        <p><a href="#"></a></p><h6><a href="#"><i>Default Path to Notification</i></a></h6><p></p>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-xs-2 col-md-1">
+            <img class="imgTimeLine" src="{{ notification.user.image_url }}">
         </div>
-        <div class="bubble-container">
-            <div class="bubble">
-                <div class="retweet" style="color: white">
-                    {{ notification.datetime }}
-                </div>
-                <h3>{{ notification.user }}</h3> - <h3>{{ notification.action_resource }}</h3><br/>
-                <a href="{% url 'core:notification_read' notification.id %}">{{ notification }}</a>
-            </div>
-            <div class="arrow"></div>
+        <div class="col-xs-10 col-md-11">
+            <i class="fa fa-pencil-square-o" aria-hidden="true"></i>
+            <a href=""><h4 class="resource_inline"><b>{{ notification.user }}</b></h4></a>
+            <p class="resource_inline">{{notification.message}} em : <a href="{% url 'core:notification_read' notification.id  %}">Recurso</a></p>
+            <p class="timePost"><i>{{ notification.datetime }}</i></p>
         </div>
-    </li>
+    </div>
+</div>
 {% endfor %}
  
@@ -296,27 +296,25 @@ body .container .jumbotron-inverse, body .container .well-inverse, body .contain
     color: #000;
 }
  
-.timeline.post {
-    border-top-left-radius: 8px;
-    border-top-right-radius: 8px;
-    padding-bottom: 0px;
-    -webkit-padding-start: 0px !important;
-    width: 100%;
-}
-.timeline.post a {
-    color: #000;
+/*TIMELINE CLASSES BEGIN */
+.resource_inline{
+    display: inline-block;
 }
-.timeline.post li {
-    padding: 10px;
-    border-bottom: 1px solid #fff;
+
+.imgTimeLine{
+    width: 100%;
+    height: auto;
+    padding-top: 10px;
 }
-.timeline.post li:last-child {
-    border: none;
+.timeLine div .col-md-11{
+    padding-left: 0px;
 }
-.timeline.post h3 {
-    margin-top: 5px;
+.timeLine div .col-md-11 i{
+    padding-right: 5px;
 }
  
+/*TIMELINE CLASSES END*/
+
 .notification-count {
     background-color: #FF0000;
 }
...	...	@@ -119,11 +119,11 @@
119	119	</div>
120	120
121	121	{% else %}
122		- <ul class="timeline" style="-webkit-padding-start: 0px">
	122	+
123	123	<div id="timeline">
124	124	{% include page_template %}
125	125	</div>
126		- </ul>
	126	+
127	127	{% endif %}
128	128
129	129	<div id="loading" class="alert alert-primary" role="alert" style="display: none">
...	...
1	1	{% load static i18n %}
2	2
3	3	{% for notification in objects %}
4		- <li {% if not notification.read %}class="not_read"{% endif %}>
5		- <div class="avatar">
6		- <img src="{{ notification.user.image_url }}">
	4	+
	5	+
	6	+ <div class="well timeLine">
	7	+ <div class="row">
	8	+ <div class="col-md-12">
	9	+ <p><a href="#"></a></p><h6><a href="#"><i>Default Path to Notification</i></a></h6><p></p>
	10	+ </div>
	11	+ </div>
	12	+ <div class="row">
	13	+ <div class="col-xs-2 col-md-1">
	14	+ <img class="imgTimeLine" src="{{ notification.user.image_url }}">
7	15	</div>
8		- <div class="bubble-container">
9		- <div class="bubble">
10		- <div class="retweet" style="color: white">
11		- {{ notification.datetime }}
12		- </div>
13		- <h3>{{ notification.user }}</h3> - <h3>{{ notification.action_resource }}</h3><br/>
14		- <a href="{% url 'core:notification_read' notification.id %}">{{ notification }}</a>
15		- </div>
16		- <div class="arrow"></div>
	16	+ <div class="col-xs-10 col-md-11">
	17	+ <i class="fa fa-pencil-square-o" aria-hidden="true"></i>
	18	+ <a href=""><h4 class="resource_inline"><b>{{ notification.user }}</b></h4></a>
	19	+ <p class="resource_inline">{{notification.message}} em : <a href="{% url 'core:notification_read' notification.id %}">Recurso</a></p>
	20	+ <p class="timePost"><i>{{ notification.datetime }}</i></p>
17	21	</div>
18		- </li>
	22	+ </div>
	23	+</div>
19	24	{% endfor %}
20	25
...	...
...	...	@@ -296,27 +296,25 @@ body .container .jumbotron-inverse, body .container .well-inverse, body .contain
296	296	color: #000;
297	297	}
298	298
299		-.timeline.post {
300		- border-top-left-radius: 8px;
301		- border-top-right-radius: 8px;
302		- padding-bottom: 0px;
303		- -webkit-padding-start: 0px !important;
304		- width: 100%;
305		-}
306		-.timeline.post a {
307		- color: #000;
	299	+/TIMELINE CLASSES BEGIN /
	300	+.resource_inline{
	301	+ display: inline-block;
308	302	}
309		-.timeline.post li {
310		- padding: 10px;
311		- border-bottom: 1px solid #fff;
	303	+
	304	+.imgTimeLine{
	305	+ width: 100%;
	306	+ height: auto;
	307	+ padding-top: 10px;
312	308	}
313		-.timeline.post li:last-child {
314		- border: none;
	309	+.timeLine div .col-md-11{
	310	+ padding-left: 0px;
315	311	}
316		-.timeline.post h3 {
317		- margin-top: 5px;
	312	+.timeLine div .col-md-11 i{
	313	+ padding-right: 5px;
318	314	}
319	315
	316	+/TIMELINE CLASSES END/
	317	+
320	318	.notification-count {
321	319	background-color: #FF0000;
322	320	}
...	...