Skip to content
Snippets Groups Projects
Commit 3d682ce8 authored by gnaegi's avatar gnaegi
Browse files

OO-1740 improved usability in task layout

parent ec527d08
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 84 additions and 60 deletions
src/main/java/org/olat/course/nodes/gta/ui/_content/coach.html
+ 19
− 19
View file @ 3d682ce8
...@@ -16,7 +16,7 @@ $r.render("contextualSubscription") ...@@ -16,7 +16,7 @@ $r.render("contextualSubscription")
#if($assignmentEnabled) #if($assignmentEnabled)
<div class="o_step $assignmentCssClass"> <div class="o_step $assignmentCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_assignement_content" data-toggle="collapse" aria-expanded="$collapse_assignement">$r.translate("run.assignment.title")</a></h4> <h4 class="o_title"> <a href="#o_step_assignement_content" data-toggle="collapse" aria-expanded="$collapse_assignement" #if(!$collapse_assignement) class="collapsed" #end>$r.translate("run.assignment.title")</a></h4>
#if($assignmentDueDate) #if($assignmentDueDate)
<div class="o_meta">$r.translate("run.assignment.due.date", $assignmentDueDate)</div> <div class="o_meta">$r.translate("run.assignment.due.date", $assignmentDueDate)</div>
#elseif($assignmentDueDateMsg) #elseif($assignmentDueDateMsg)
...@@ -44,7 +44,7 @@ $r.render("contextualSubscription") ...@@ -44,7 +44,7 @@ $r.render("contextualSubscription")
#if($submitEnabled) #if($submitEnabled)
<div class="o_step $submitCssClass"> <div class="o_step $submitCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_submit_content" data-toggle="collapse" aria-expanded="$collapse_submit">$r.translate("run.submit")</a></h4> <h4 class="o_title"> <a href="#o_step_submit_content" data-toggle="collapse" aria-expanded="$collapse_submit" #if(!$collapse_submit) class="collapsed" #end>$r.translate("run.submit")</a></h4>
#if($submitDueDate) #if($submitDueDate)
<div class="o_meta">$r.translate("run.submit.due.date", $submitDueDate)</div> <div class="o_meta">$r.translate("run.submit.due.date", $submitDueDate)</div>
#elseif($submitDueDateMsg) #elseif($submitDueDateMsg)
...@@ -72,7 +72,7 @@ $r.render("contextualSubscription") ...@@ -72,7 +72,7 @@ $r.render("contextualSubscription")
#if($reviewAndCorrectionEnabled) #if($reviewAndCorrectionEnabled)
<div class="o_step $reviewCssClass"> <div class="o_step $reviewCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_review_content" data-toggle="collapse" aria-expanded="$collapse_reviewAndCorrection">$r.translate("run.review")</a></h4> <h4 class="o_title"> <a href="#o_step_review_content" data-toggle="collapse" aria-expanded="$collapse_reviewAndCorrection" #if(!$collapse_reviewAndCorrection) class="collapsed" #end>$r.translate("run.review")</a></h4>
<div id="o_step_review_content" class="o_content collapse #if($collapse_reviewAndCorrection) in #end" aria-expanded="$collapse_reviewAndCorrection"> <div id="o_step_review_content" class="o_content collapse #if($collapse_reviewAndCorrection) in #end" aria-expanded="$collapse_reviewAndCorrection">
#if($r.available("corrections")) #if($r.available("corrections"))
$r.render("corrections") $r.render("corrections")
...@@ -101,7 +101,7 @@ $r.render("contextualSubscription") ...@@ -101,7 +101,7 @@ $r.render("contextualSubscription")
#if($revisionEnabled && !$skipRevisions) #if($revisionEnabled && !$skipRevisions)
<div class="o_step $revisionCssClass"> <div class="o_step $revisionCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_revision_content" data-toggle="collapse" aria-expanded="$collapse_revision">$r.translate("run.revision")</a></h4> <h4 class="o_title"> <a href="#o_step_revision_content" data-toggle="collapse" aria-expanded="$collapse_revision" #if(!$collapse_revision) class="collapsed" #end>$r.translate("run.revision")</a></h4>
<div id="o_step_revision_content" class="o_content collapse #if($collapse_revision) in #end" aria-expanded="$collapse_revision"> <div id="o_step_revision_content" class="o_content collapse #if($collapse_revision) in #end" aria-expanded="$collapse_revision">
#if($r.available("revisionDocs")) #if($r.available("revisionDocs"))
$r.render("revisionDocs") $r.render("revisionDocs")
...@@ -120,7 +120,7 @@ $r.render("contextualSubscription") ...@@ -120,7 +120,7 @@ $r.render("contextualSubscription")
#if($solutionEnabled) #if($solutionEnabled)
<div class="o_step $solutionCssClass"> <div class="o_step $solutionCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_solution_content" data-toggle="collapse" aria-expanded="$collapse_solution">$r.translate("run.solution")</a></h4> <h4 class="o_title"> <a href="#o_step_solution_content" data-toggle="collapse" aria-expanded="$collapse_solution" #if(!$collapse_solution) class="collapsed" #end>$r.translate("run.solution")</a></h4>
#if($solutionAvailableDate) #if($solutionAvailableDate)
<div class="o_meta">$r.translate("run.solution.available.date", $solutionAvailableDate)</div> <div class="o_meta">$r.translate("run.solution.available.date", $solutionAvailableDate)</div>
#elseif($solutionAvailableDateMsg) #elseif($solutionAvailableDateMsg)
...@@ -144,24 +144,24 @@ $r.render("contextualSubscription") ...@@ -144,24 +144,24 @@ $r.render("contextualSubscription")
#if($gradingEnabled) #if($gradingEnabled)
<div class="o_step $gradingCssClass"> <div class="o_step $gradingCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_grading_content" data-toggle="collapse" aria-expanded="$collapse_grading">$r.translate("run.grading")</a></h4> <h4 class="o_title"> <a href="#o_step_grading_content" data-toggle="collapse" aria-expanded="$collapse_grading" #if(!$collapse_grading) class="collapsed" #end>$r.translate("run.grading")</a></h4>
<div id="o_step_grading_content" class="o_content collpase #if($collapse_grading) in #end" aria-expanded="$collapse_grading"> <div id="o_step_grading_content" class="o_content collapse #if($collapse_grading) in #end" aria-expanded="$collapse_grading">
#if($r.available("grading")) #if($r.available("grading"))
$r.render("grading") $r.render("grading")
#end #end
#if($userLog || $groupLog)
<div class="o_box">
#o_togglebox_start("o_course_run_log" $r.translate("log.title"))
#if($groupLog)
<pre class="small">$groupLog</pre>
#end
#if($userLog)
<pre class="small">$userLog</pre>
#end
#o_togglebox_end()
</div>
#end
</div> </div>
#if($userLog || $groupLog)
<div class="o_box">
#o_togglebox_start("o_course_run_log" $r.translate("log.title"))
#if($groupLog)
<pre class="small">$groupLog</pre>
#end
#if($userLog)
<pre class="small">$userLog</pre>
#end
#o_togglebox_end()
</div>
#end
</div> </div>
<script type='text/javascript'>/* <![CDATA[ */ <script type='text/javascript'>/* <![CDATA[ */
jQuery('#o_step_grading_content').on('hide.bs.collapse', function () { jQuery('#o_step_grading_content').on('hide.bs.collapse', function () {
......
src/main/java/org/olat/course/nodes/gta/ui/_content/run.html
+ 19
− 19
View file @ 3d682ce8
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
#if($assignmentEnabled) #if($assignmentEnabled)
<div id="o_step_assignement" class="o_step $assignmentCssClass"> <div id="o_step_assignement" class="o_step $assignmentCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title" > <a href="#o_step_assignement_content" data-toggle="collapse" aria-expanded="$collapse_assignement">$r.translate("run.assignment.title")</a></h4> <h4 class="o_title" > <a href="#o_step_assignement_content" data-toggle="collapse" aria-expanded="$collapse_assignement" #if(!$collapse_assignement) class="collapsed" #end>$r.translate("run.assignment.title")</a></h4>
#if($assignmentDueDate) #if($assignmentDueDate)
<div class="o_meta">$r.translate("run.assignment.due.date", $assignmentDueDate)</div> <div class="o_meta">$r.translate("run.assignment.due.date", $assignmentDueDate)</div>
#elseif($assignmentDueDateMsg) #elseif($assignmentDueDateMsg)
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
#if($submitEnabled) #if($submitEnabled)
<div class="o_step $submitCssClass"> <div class="o_step $submitCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_submit_content" data-toggle="collapse" aria-expanded="$collapse_submit">$r.translate("run.submit")</a></h4> <h4 class="o_title"> <a href="#o_step_submit_content" data-toggle="collapse" aria-expanded="$collapse_submit" #if(!$collapse_submit) class="collapsed" #end>$r.translate("run.submit")</a></h4>
#if($submitDueDate) #if($submitDueDate)
<div class="o_meta">$r.translate("run.submit.due.date", $submitDueDate)</div> <div class="o_meta">$r.translate("run.submit.due.date", $submitDueDate)</div>
#elseif($submitDueDateMsg) #elseif($submitDueDateMsg)
...@@ -90,7 +90,7 @@ ...@@ -90,7 +90,7 @@
#if($reviewAndCorrectionEnabled) #if($reviewAndCorrectionEnabled)
<div class="o_step $reviewCssClass"> <div class="o_step $reviewCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_review_content" data-toggle="collapse" aria-expanded="$collapse_reviewAndCorrection">$r.translate("run.review")</a></h4> <h4 class="o_title"> <a href="#o_step_review_content" data-toggle="collapse" aria-expanded="$collapse_reviewAndCorrection" #if(!$collapse_reviewAndCorrection) class="collapsed" #end>$r.translate("run.review")</a></h4>
<div id="o_step_review_content" class="o_content collapse #if($collapse_reviewAndCorrection) in #end" aria-expanded="$collapse_reviewAndCorrection"> <div id="o_step_review_content" class="o_content collapse #if($collapse_reviewAndCorrection) in #end" aria-expanded="$collapse_reviewAndCorrection">
#if($reviewMessage && !$reviewMessage.isEmpty()) #if($reviewMessage && !$reviewMessage.isEmpty())
<p>$reviewMessage</p> <p>$reviewMessage</p>
...@@ -112,7 +112,7 @@ ...@@ -112,7 +112,7 @@
#if($revisionEnabled && !$skipRevisions) #if($revisionEnabled && !$skipRevisions)
<div class="o_step $revisionCssClass"> <div class="o_step $revisionCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_revision_content" data-toggle="collapse" aria-expanded="$collapse_revision">$r.translate("run.revision")</a></h4> <h4 class="o_title"> <a href="#o_step_revision_content" data-toggle="collapse" aria-expanded="$collapse_revision" #if(!$collapse_revision) class="collapsed" #end>$r.translate("run.revision")</a></h4>
<div id="o_step_revision_content" class="o_content collapse #if($collapse_revision) in #end" aria-expanded="$collapse_revision"> <div id="o_step_revision_content" class="o_content collapse #if($collapse_revision) in #end" aria-expanded="$collapse_revision">
#if($r.available("revisionDocs")) #if($r.available("revisionDocs"))
$r.render("revisionDocs") $r.render("revisionDocs")
...@@ -134,7 +134,7 @@ ...@@ -134,7 +134,7 @@
#if($solutionEnabled) #if($solutionEnabled)
<div class="o_step $solutionCssClass"> <div class="o_step $solutionCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_solution_content" data-toggle="collapse" aria-expanded="$collapse_solution">$r.translate("run.solution")</a></h4> <h4 class="o_title"> <a href="#o_step_solution_content" data-toggle="collapse" aria-expanded="$collapse_solution" #if(!$collapse_solution) class="collapsed" #end>$r.translate("run.solution")</a></h4>
#if($solutionAvailableDate) #if($solutionAvailableDate)
<div class="o_meta">$r.translate("run.solution.available.date", $solutionAvailableDate)</div> <div class="o_meta">$r.translate("run.solution.available.date", $solutionAvailableDate)</div>
#elseif($solutionAvailableDateMsg) #elseif($solutionAvailableDateMsg)
...@@ -158,24 +158,24 @@ ...@@ -158,24 +158,24 @@
#if($gradingEnabled) #if($gradingEnabled)
<div class="o_step $gradingCssClass"> <div class="o_step $gradingCssClass">
<div class="o_bar"></div> <div class="o_bar"></div>
<h4 class="o_title"> <a href="#o_step_grading_content" data-toggle="collapse" aria-expanded="$collapse_grading">$r.translate("run.grading")</a></h4> <h4 class="o_title"> <a href="#o_step_grading_content" data-toggle="collapse" aria-expanded="$collapse_grading" #if(!$collapse_grading) class="collapsed" #end>$r.translate("run.grading")</a></h4>
<div id="o_step_grading_content" class="o_content collpase #if($collapse_grading) in #end" aria-expanded="$collapse_grading"> <div id="o_step_grading_content" class="o_content collapse #if($collapse_grading) in #end" aria-expanded="$collapse_grading">
#if($r.available("grading")) #if($r.available("grading"))
$r.render("grading") $r.render("grading")
#end #end
#if($userLog || $groupLog)
<div class="o_box">
#o_togglebox_start("o_course_run_log" $r.translate("log.title"))
#if($groupLog)
<pre class="small">$groupLog</pre>
#end
#if($userLog)
<pre class="small">$userLog</pre>
#end
#o_togglebox_end()
</div>
#end
</div> </div>
#if($userLog || $groupLog)
<div class="o_box">
#o_togglebox_start("o_course_run_log" $r.translate("log.title"))
#if($groupLog)
<pre class="small">$groupLog</pre>
#end
#if($userLog)
<pre class="small">$userLog</pre>
#end
#o_togglebox_end()
</div>
#end
</div> </div>
<script type='text/javascript'>/* <![CDATA[ */ <script type='text/javascript'>/* <![CDATA[ */
jQuery('#o_step_grading_content').on('hide.bs.collapse', function () { jQuery('#o_step_grading_content').on('hide.bs.collapse', function () {
......
src/main/webapp/static/themes/light/_config.scss
+ 14
− 0
View file @ 3d682ce8
...@@ -415,6 +415,20 @@ $o-datecomp-month-color : #fff !default; ...@@ -415,6 +415,20 @@ $o-datecomp-month-color : #fff !default;
$o-datecomp-day-bg : $body-bg !default; $o-datecomp-day-bg : $body-bg !default;
$o-datecomp-day-color : $text-color !default; $o-datecomp-day-color : $text-color !default;
/* Process step component */
$o-step-border-width : 4px !default;
$o-step-milestone-size : ($o-step-border-width * 4) !default;
$o-step-padding-top : 10px !default;
$o-step-padding-left : 30px !default;
$o-step-padding-bottom : 10px !default;
$o-step-color : $gray-light !default;
$o-step-active-color : $brand-primary !default;
$o-step-active-marker-color : $o-step-active-color !default;
$o-step-done-color : lighten($brand-primary,10%) !default;
$o-step-done-marker-color : $brand-success !default;
$o-step-meta-color : $text-muted !default;
$o-step-meta-size : $font-size-small !default;
/* other configurations */ /* other configurations */
$o-portrait-radius : 50% !default; $o-portrait-radius : 50% !default;
$o-portrait-border : none !default; $o-portrait-border : none !default;
......
src/main/webapp/static/themes/light/content.css.map
+ 1
− 1
View file @ 3d682ce8
This diff is collapsed.
src/main/webapp/static/themes/light/modules/_process.scss
+ 24
− 14
View file @ 3d682ce8
$o-step-border-width : 4px !default;
$o-step-milestone-size : ($o-step-border-width * 4) !default;
$o-step-padding-top : 10px !default;
$o-step-padding-left : 30px !default;
$o-step-padding-bottom : 10px !default;
$o-step-color : $gray-light !default;
$o-step-active-color : $brand-primary !default;
$o-step-done-color : lighten($brand-primary,10%) !default;
$o-step-meta-color : $text-muted !default;
$o-step-meta-size : $font-size-small !default;
.o_process { .o_process {
position: relative; position: relative;
padding-left: 25px; padding-left: 25px;
...@@ -44,6 +33,27 @@ $o-step-meta-size : $font-size-small !default; ...@@ -44,6 +33,27 @@ $o-step-meta-size : $font-size-small !default;
.o_title { .o_title {
margin-top: round($headings-line-height/2) * -1 + px; margin-top: round($headings-line-height/2) * -1 + px;
color: $o-step-color !important; color: $o-step-color !important;
&:before {
/* ok or hand icon */
@include fa-icon();
position: absolute;
left: floor($o-step-milestone-size * -1.5);
}
a {
&:before {
/* toggle icon */
@include fa-icon();
content: $fa-var-caret-down;
width: 1em;
}
&.collapsed {
&:before {
/* toggle icon */
content: $fa-var-caret-right;
}
}
}
} }
.o_step.o_active { .o_step.o_active {
...@@ -54,9 +64,9 @@ $o-step-meta-size : $font-size-small !default; ...@@ -54,9 +64,9 @@ $o-step-meta-size : $font-size-small !default;
.o_title { .o_title {
color: $o-step-active-color !important; color: $o-step-active-color !important;
&:before { &:before {
@include fa-icon();
content: $fa-var-hand-o-right; content: $fa-var-hand-o-right;
} color: $o-step-active-marker-color;
}
} }
} }
.o_step.o_done { .o_step.o_done {
...@@ -67,8 +77,8 @@ $o-step-meta-size : $font-size-small !default; ...@@ -67,8 +77,8 @@ $o-step-meta-size : $font-size-small !default;
.o_title { .o_title {
color: $o-step-done-color !important; color: $o-step-done-color !important;
&:before { &:before {
@include fa-icon();
content: $fa-var-check; content: $fa-var-check;
color: $o-step-done-marker-color;
} }
} }
} }
......
src/main/webapp/static/themes/light/theme.css
+ 1
− 1
View file @ 3d682ce8
This diff is collapsed.
src/main/webapp/static/themes/light/theme.css.map
+ 1
− 1
View file @ 3d682ce8
source diff could not be displayed: it is too large. Options to address this: view the blob.
src/main/webapp/static/themes/openolat/theme.css
+ 1
− 1
View file @ 3d682ce8
This diff is collapsed.
src/main/webapp/static/themes/openolat/theme.css.map
+ 1
− 1
View file @ 3d682ce8
This diff is collapsed.
src/main/webapp/static/themes/openolat/theme_ie_completions.css
+ 1
− 1
View file @ 3d682ce8
source diff could not be displayed: it is too large. Options to address this: view the blob.
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment