andrew
/
RateMyCourse
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixing layout finally

This commit is contained in:
ludger 2018-10-18 12:35:40 +02:00
parent c5ee3d8ec9
commit 2a7e444ca9
6 changed files with 47 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
backend/postings/static/postings/css/style.css
View File

@ -30,7 +30,8 @@
background: white; background: white;
border-radius: 15px; border-radius: 15px;
padding: 30px; padding: 30px;
margin-top: 25px; } margin-top: 25px;
margin-bottom: 25px; }
.navbar-brand { .navbar-brand {
cursor: pointer; } cursor: pointer; }
@ -51,8 +52,7 @@ body {
color: #FFF; } color: #FFF; }
.rating-block { .rating-block {
background-color: #FAFAFA; float: right;
border: 1px solid #EFEFEF;
padding: 15px 15px 20px 15px; padding: 15px 15px 20px 15px;
border-radius: 3px; } border-radius: 3px; }
@ -67,7 +67,8 @@ body {
border: 1px solid #EFEFEF; border: 1px solid #EFEFEF;
padding: 15px; padding: 15px;
border-radius: 3px; border-radius: 3px;
margin-bottom: 15px; } margin-bottom: 15px;
float: right; }
.review-block-name { .review-block-name {
font-size: 12px; font-size: 12px;
@ -98,6 +99,10 @@ body {
font-size: 24px; font-size: 24px;
color: #d17581; } color: #d17581; }
.selfcenter {
margin: 0 auto;
float: inherit; }
.hr-line-dashed { .hr-line-dashed {
border-top: 1px dashed #E7EAEC; border-top: 1px dashed #E7EAEC;
color: #ffffff; color: #ffffff;
@ -121,4 +126,7 @@ h2 {
.box3 { .box3 {
background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat; } background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat; }
.box2 {
background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat; }
/*# sourceMappingURL=style.css.map */ /*# sourceMappingURL=style.css.map */

2
backend/postings/static/postings/css/style.css.map
View File

@ -1,6 +1,6 @@
{ {
"version": 3, "version": 3,
"mappings": "AACA,IAAI;EACF,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,0FAA0F;EACtG,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,MAAM;EAClB,aAAa,EAAE,CAAC;EAChB,UAAU,EAAC,MAAM;;AAEnB,mBAAoB;EAClB,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,0BAA0B;EAClC,MAAM,EAAE,uBAAuB;EAC/B,MAAM,EAAE,kBAAkB;;AAE5B,oBAAqB;EACnB,OAAO,EAAE,IAAI;EACb,MAAM,EAAE,0BAA0B;EAClC,MAAM,EAAE,uBAAuB;EAC/B,MAAM,EAAE,kBAAkB;;AAE5B,iBAAiB;EACf,SAAS,EAAE,IAAI;;AAEjB,iBAAiB;EACf,aAAa,EAAE,IAAI;;AAGrB,SAAS;EACP,UAAU,EAAE,KAAK;EACjB,aAAa,EAAE,IAAI;EACnB,OAAO,EAAE,IAAI;EACb,UAAU,EAAC,IAAI;;AAIjB,aAAa;EACX,MAAM,EAAC,OAAO;;AAIhB,KAAM;EACJ,UAAU,EAAE,OAAO;EACnB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;;AAGb,MAAM;EACJ,UAAU,EAAE,KAAK;;AAGnB,IAAK;EACH,WAAW,EAAE,IAAI;;AAEnB,SAAS;EACP,gBAAgB,EAAC,OAAO;EACxB,KAAK,EAAC,IAAI;;AAEZ,aAAa;EACX,gBAAgB,EAAC,OAAO;EACxB,MAAM,EAAC,iBAAiB;EACxB,OAAO,EAAC,mBAAmB;EAC3B,aAAa,EAAC,GAAG;;AAEnB,KAAK;EACH,WAAW,EAAC,GAAG;;AAEjB,iBAAiB;EACf,cAAc,EAAC,GAAG;;AAGpB,aAAa;EACX,gBAAgB,EAAC,OAAO;EACxB,MAAM,EAAC,iBAAiB;EACxB,OAAO,EAAC,IAAI;EACZ,aAAa,EAAC,GAAG;EACjB,aAAa,EAAC,IAAI;;AAEpB,kBAAkB;EAChB,SAAS,EAAC,IAAI;EACd,MAAM,EAAC,MAAM;;AAEf,kBAAkB;EAChB,SAAS,EAAC,IAAI;;AAEhB,kBAAkB;EAChB,SAAS,EAAC,IAAI;EACd,aAAa,EAAC,IAAI;;AAEpB,mBAAmB;EACjB,SAAS,EAAC,IAAI;EACd,WAAW,EAAC,GAAG;EACf,aAAa,EAAC,IAAI;;AAEpB,yBAAyB;EACvB,SAAS,EAAC,IAAI;;AAGhB,SAAU;EACR,kBAAkB,EAAE,WAAW;EAC/B,eAAe,EAAE,WAAW;EAC5B,UAAU,EAAE,WAAW;;AAGzB,MACA;EACE,MAAM,EAAE,MAAM;EACd,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,OAAO;;AAOhB,eAAgB;EACd,UAAU,EAAE,kBAAkB;EAC9B,KAAK,EAAE,OAAO;EACd,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,GAAG;EACX,MAAM,EAAE,MAAM;;AAGhB,EAAG;EACD,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,GAAG;;AAElB,OAAQ;EACN,UAAU,EAAE,KAAK;;AAGnB,YAAY;EACV,SAAS,EAAC,IAAI;;AAGhB,SAAS;EACP,SAAS,EAAC,IAAI;;AAGhB,KAAK;EACH,UAAU,EAAE,0FAA0F", "mappings": "AACA,IAAI;EACF,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,0FAA0F;EACtG,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,MAAM;EAClB,aAAa,EAAE,CAAC;EAChB,UAAU,EAAC,MAAM;;AAEnB,mBAAoB;EAClB,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,MAAM,EAAE,0BAA0B;EAClC,MAAM,EAAE,uBAAuB;EAC/B,MAAM,EAAE,kBAAkB;;AAG5B,oBAAqB;EACnB,OAAO,EAAE,IAAI;EACb,MAAM,EAAE,0BAA0B;EAClC,MAAM,EAAE,uBAAuB;EAC/B,MAAM,EAAE,kBAAkB;;AAE5B,iBAAiB;EACf,SAAS,EAAE,IAAI;;AAEjB,iBAAiB;EACf,aAAa,EAAE,IAAI;;AAGrB,SAAS;EACP,UAAU,EAAE,KAAK;EACjB,aAAa,EAAE,IAAI;EACnB,OAAO,EAAE,IAAI;EACb,UAAU,EAAC,IAAI;EACf,aAAa,EAAC,IAAI;;AAIpB,aAAa;EACX,MAAM,EAAC,OAAO;;AAIhB,KAAM;EACJ,UAAU,EAAE,OAAO;EACnB,QAAQ,EAAE,QAAQ;EAClB,KAAK,EAAE,IAAI;;AAGb,MAAM;EACJ,UAAU,EAAE,KAAK;;AAGnB,IAAK;EACH,WAAW,EAAE,IAAI;;AAEnB,SAAS;EACP,gBAAgB,EAAC,OAAO;EACxB,KAAK,EAAC,IAAI;;AAEZ,aAAa;EACX,KAAK,EAAC,KAAK;EACX,OAAO,EAAC,mBAAmB;EAC3B,aAAa,EAAC,GAAG;;AAEnB,KAAK;EACH,WAAW,EAAC,GAAG;;AAEjB,iBAAiB;EACf,cAAc,EAAC,GAAG;;AAGpB,aAAa;EACX,gBAAgB,EAAC,OAAO;EACxB,MAAM,EAAC,iBAAiB;EACxB,OAAO,EAAC,IAAI;EACZ,aAAa,EAAC,GAAG;EACjB,aAAa,EAAC,IAAI;EAClB,KAAK,EAAE,KAAK;;AAEd,kBAAkB;EAChB,SAAS,EAAC,IAAI;EACd,MAAM,EAAC,MAAM;;AAEf,kBAAkB;EAChB,SAAS,EAAC,IAAI;;AAEhB,kBAAkB;EAChB,SAAS,EAAC,IAAI;EACd,aAAa,EAAC,IAAI;;AAEpB,mBAAmB;EACjB,SAAS,EAAC,IAAI;EACd,WAAW,EAAC,GAAG;EACf,aAAa,EAAC,IAAI;;AAEpB,yBAAyB;EACvB,SAAS,EAAC,IAAI;;AAGhB,SAAU;EACR,kBAAkB,EAAE,WAAW;EAC/B,eAAe,EAAE,WAAW;EAC5B,UAAU,EAAE,WAAW;;AAGzB,MACA;EACE,MAAM,EAAE,MAAM;EACd,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,OAAO;;AAOhB,WAAW;EACT,MAAM,EAAE,MAAM;EACd,KAAK,EAAE,OAAO;;AAGhB,eAAgB;EACd,UAAU,EAAE,kBAAkB;EAC9B,KAAK,EAAE,OAAO;EACd,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,GAAG;EACX,MAAM,EAAE,MAAM;;AAGhB,EAAG;EACD,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,GAAG;;AAElB,OAAQ;EACN,UAAU,EAAE,KAAK;;AAGnB,YAAY;EACV,SAAS,EAAC,IAAI;;AAGhB,SAAS;EACP,SAAS,EAAC,IAAI;;AAGhB,KAAK;EACH,UAAU,EAAE,0FAA0F;;AAExG,KAAK;EACH,UAAU,EAAE,0FAA0F",
"sources": ["style.scss"], "sources": ["style.scss"],
"names": [], "names": [],
"file": "style.css" "file": "style.css"

14
backend/postings/static/postings/css/style.scss
View File

@ -15,6 +15,7 @@
height: -moz-calc(100vh - 50px); height: -moz-calc(100vh - 50px);
height: calc(100vh - 50px); height: calc(100vh - 50px);
} }
.box3 .fullcontainer { .box3 .fullcontainer {
display: flex; display: flex;
height: -webkit-calc(100vh - 50px); height: -webkit-calc(100vh - 50px);
@ -33,6 +34,7 @@
border-radius: 15px; border-radius: 15px;
padding: 30px; padding: 30px;
margin-top:25px; margin-top:25px;
margin-bottom:25px;
} }
@ -59,8 +61,7 @@ body {
color:#FFF; color:#FFF;
} }
.rating-block{ .rating-block{
background-color:#FAFAFA; float:right;
border:1px solid #EFEFEF;
padding:15px 15px 20px 15px; padding:15px 15px 20px 15px;
border-radius:3px; border-radius:3px;
} }
@ -77,6 +78,7 @@ body {
padding:15px; padding:15px;
border-radius:3px; border-radius:3px;
margin-bottom:15px; margin-bottom:15px;
float: right;
} }
.review-block-name{ .review-block-name{
font-size:12px; font-size:12px;
@ -115,6 +117,11 @@ body {
} }
.selfcenter{
margin: 0 auto;
float: inherit;
}
.hr-line-dashed { .hr-line-dashed {
border-top: 1px dashed #E7EAEC; border-top: 1px dashed #E7EAEC;
color: #ffffff; color: #ffffff;
@ -142,3 +149,6 @@ h2 {
.box3{ .box3{
background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat; background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat;
} }
.box2{
background: #5850c7 url(https://d20ohkaloyme4g.cloudfront.net/img/hero-illustration-module.png) repeat;
}

36
backend/postings/templates/postings/frontend/entity.html
View File

@ -9,89 +9,89 @@
{% block content %} {% block content %}
<div class="container entity"> <div class="fullcontainer">
<div class="container entity whitebox">
{% block entity_info %} {% block entity_info %}
<div class="row"> <div class="row">
<div class="col-sm-6"> <div class="col-sm-8 selfcenter">
<h1 class="muted text-center">{{ entity.name }}</h1> <h1 class="muted text-center">{{ entity.name }}</h1>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}
<hr> <hr>
<div class="row"> <div class="row">
<div class="col-sm-3"> <div class="col-sm-5">
<div class="rating-block" data-rating="{{ entity.average_rating|floatformat:"-2" }}"> <div class="rating-block" data-rating="{{ entity.average_rating|floatformat:"-2" }}">
<h4>Average user rating</h4> <h2>Average user rating</h2>
<h2 class="bold padding-bottom-7">{{ entity.average_rating|floatformat:"-2" }} <small>/ 5</small></h2> <h2 class="bold padding-bottom-7">{{ entity.average_rating|floatformat:"-2" }} <small>/ 5</small></h2>
</div> </div>
</div> </div>
{# Rating Distribution Display #} {# Rating Distribution Display #}
<div class="col-sm-3"> <div class="col-sm-5">
<h4>Rating breakdown</h4> <h4>Rating breakdown</h4>
<div class="pull-left"> <div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;"> <div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">5 <span class="glyphicon glyphicon-star"></span></div> <div style="height:9px; margin:5px 0;">5 <span class="glyphicon glyphicon-star"></span></div>
</div> </div>
<div class="pull-left" style="width:180px;"> <div class="pull-left" style="width:250px;">
<div class="progress" style="height:9px; margin:8px 0;"> <div class="progress" style="height:9px; margin:8px 0;">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="5" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.4.1 }}%"> <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="5" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.4.1 }}%">
<span class="sr-only">80% Complete (danger)</span> <span class="sr-only">80% Complete (danger)</span>
</div> </div>
</div> </div>
</div> </div>
<div class="pull-right" style="margin-left:10px;">{{ entity.rating_distribution.4.0 }}</div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;"> <div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">4 <span class="glyphicon glyphicon-star"></span></div> <div style="height:9px; margin:5px 0;">4 <span class="glyphicon glyphicon-star"></span></div>
</div> </div>
<div class="pull-left" style="width:180px;"> <div class="pull-left" style="width:250px;">
<div class="progress" style="height:9px; margin:8px 0;"> <div class="progress" style="height:9px; margin:8px 0;">
<div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="4" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.3.1 }}%"> <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="4" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.3.1 }}%">
<span class="sr-only">80% Complete (danger)</span> <span class="sr-only">80% Complete (danger)</span>
</div> </div>
</div> </div>
</div> </div>
<div class="pull-right" style="margin-left:10px;">{{ entity.rating_distribution.3.0 }}</div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;"> <div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">3 <span class="glyphicon glyphicon-star"></span></div> <div style="height:9px; margin:5px 0;">3 <span class="glyphicon glyphicon-star"></span></div>
</div> </div>
<div class="pull-left" style="width:180px;"> <div class="pull-left" style="width:250px;">
<div class="progress" style="height:9px; margin:8px 0;"> <div class="progress" style="height:9px; margin:8px 0;">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="3" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.2.1 }}%"> <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="3" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.2.1 }}%">
<span class="sr-only">80% Complete (danger)</span> <span class="sr-only">80% Complete (danger)</span>
</div> </div>
</div> </div>
</div> </div>
<div class="pull-right" style="margin-left:10px;">{{ entity.rating_distribution.2.0 }}</div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;"> <div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">2 <span class="glyphicon glyphicon-star"></span></div> <div style="height:9px; margin:5px 0;">2 <span class="glyphicon glyphicon-star"></span></div>
</div> </div>
<div class="pull-left" style="width:180px;"> <div class="pull-left" style="width:250px;">
<div class="progress" style="height:9px; margin:8px 0;"> <div class="progress" style="height:9px; margin:8px 0;">
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.1.1 }}%"> <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.1.1 }}%">
<span class="sr-only">80% Complete (danger)</span> <span class="sr-only">80% Complete (danger)</span>
</div> </div>
</div> </div>
</div> </div>
<div class="pull-right" style="margin-left:10px;">{{ entity.rating_distribution.1.0 }}</div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
<div class="pull-left" style="width:35px; line-height:1;"> <div class="pull-left" style="width:35px; line-height:1;">
<div style="height:9px; margin:5px 0;">1 <span class="glyphicon glyphicon-star"></span></div> <div style="height:9px; margin:5px 0;">1 <span class="glyphicon glyphicon-star"></span></div>
</div> </div>
<div class="pull-left" style="width:180px;"> <div class="pull-left" style="width:250px;">
<div class="progress" style="height:9px; margin:8px 0;"> <div class="progress" style="height:9px; margin:8px 0;">
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.0.1 }}%"> <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuemax="5" style="width: {{ entity.rating_distribution.0.1 }}%">
<span class="sr-only">80% Complete (danger)</span> <span class="sr-only">80% Complete (danger)</span>
</div> </div>
</div> </div>
</div> </div>
<div class="pull-right" style="margin-left:10px;">{{ entity.rating_distribution.0.0 }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -101,10 +101,10 @@
<div class="row"> <div class="row">
<div class="col-sm-7"> <div class="col-sm-11">
<hr/> <hr/>
<div id="review_container" class="review-block"> <div id="review_container" class="review-block">
<div class="row" style="margin-top:40px;"> <div class="row" style="margin-top:10px;">
<div class="col-md-12"> <div class="col-md-12">
<div class="well-sm"> <div class="well-sm">
<div class="text-right"> <div class="text-right">
@ -168,7 +168,7 @@
</div> </div>
</div> </div>
</div>
{% endblock %} {% endblock %}

4
backend/postings/templates/postings/frontend/results.html
View File

@ -5,7 +5,7 @@
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="fullcontainer container bootstrap snippet results">
<div class="row"> <div class="row">
<div class="col-lg-12 whitebox"> <div class="col-lg-12 whitebox">
<div class="ibox float-e-margins "> <div class="ibox float-e-margins ">
@ -46,5 +46,5 @@
</div> </div>
</div> </div>
</div> </div>
</div>
{% endblock %} {% endblock %}

2
backend/postings/templates/postings/frontend/review.html
View File

@ -17,7 +17,7 @@
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="review-block-title">{{ review.title }}</div> <div class="review-block-title">{{ review.title }}</div>
<div class="review-block-description">{{ review.content }}</div> <div class="review-block-description"><p>{{ review.content }}</p></div>
<div id="review-votes-{{ review.pk }}" class="js_votes" data-review_id="{{ review.pk }}"> <div id="review-votes-{{ review.pk }}" class="js_votes" data-review_id="{{ review.pk }}">
<div class="review-vote-buttons"> <div class="review-vote-buttons">