Skip to content
Snippets Groups Projects
Commit 3199dde6 authored by gnaegi's avatar gnaegi
Browse files

OO-2057 ep page layout tuning

parent 204317e2
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 132 additions and 90 deletions
src/main/java/org/olat/modules/portfolio/ui/PageMetadataController.java
+ 8
− 4
View file @ 3199dde6
...@@ -186,16 +186,20 @@ public class PageMetadataController extends BasicController { ...@@ -186,16 +186,20 @@ public class PageMetadataController extends BasicController {
mainVC.contextPut("pageStatus", status); mainVC.contextPut("pageStatus", status);
if(secCallback.canPublish(page)) { if(secCallback.canPublish(page)) {
publishButton = LinkFactory.createButton("publish", mainVC, this); publishButton = LinkFactory.createButtonSmall("publish", mainVC, this);
publishButton.setIconLeftCSS("o_icon o_icon_publish o_icon-fw");
} }
if(secCallback.canRevision(page)) { if(secCallback.canRevision(page)) {
revisionButton = LinkFactory.createButton("revision.page", mainVC, this); revisionButton = LinkFactory.createButtonSmall("revision.page", mainVC, this);
revisionButton.setIconLeftCSS("o_icon o_icon_rejected o_icon-fw");
} }
if(secCallback.canClose(page)) { if(secCallback.canClose(page)) {
closeButton = LinkFactory.createButton("close.page", mainVC, this); closeButton = LinkFactory.createButtonSmall("close.page", mainVC, this);
closeButton.setIconLeftCSS("o_icon o_icon_status_done o_icon-fw");
} }
if(secCallback.canReopen(page)) { if(secCallback.canReopen(page)) {
reopenButton = LinkFactory.createButton("reopen.page", mainVC, this); reopenButton = LinkFactory.createButtonSmall("reopen.page", mainVC, this);
reopenButton.setIconLeftCSS("o_icon o_icon_redo o_icon-fw");
} }
} }
} }
......
src/main/java/org/olat/modules/portfolio/ui/_content/page_meta.html
+ 48
− 52
View file @ 3199dde6
<div class="o_portfolio_page_meta_wrapper" #if($imageAlign == "background") style="background-image: url('$mapperThumbnailUrl/${imageName}');" #end> <div class="o_page_lead" #if($imageAlign == "background") style="background-image: url('$mapperThumbnailUrl/${imageName}');" #end>
<div class="o_header_with_buttons">
<h2>$r.escapeHtml($pageTitle) <small>$r.translate("binder.by",$owners)</small></h2> <h2>$r.escapeHtml($pageTitle) <small>$r.translate("binder.by",$owners)</small></h2>
</div> <div class="o_portfolio_page_meta">
<div class="o_portfolio_page_meta">
<div class="clearfix">
#if($r.isNotEmpty(pageCategories)) #if($r.isNotEmpty(pageCategories))
<span class="o_portfolio_page_meta text-muted o_small"> <span class="o_portfolio_categories text-muted o_small">
<strong>$r.translate("meta.categories")</strong> <i class="o_icon o_icon_tags"> </i> <strong>$r.translate("meta.categories")</strong> <i class="o_icon o_icon_tags"> </i>
#foreach($category in $pageCategories) #foreach($category in $pageCategories)
#if(${foreach.count} > 1), #end #if(${foreach.count} > 1), #end
...@@ -15,17 +12,17 @@ ...@@ -15,17 +12,17 @@
#end #end
#if($r.isNotNull($lastPublicationDate)) #if($r.isNotNull($lastPublicationDate))
<span class="o_portfolio_page_meta text-muted o_small">#if($r.isNotEmpty(pageCategories)), #end <span class="o_portfolio_publication_date text-muted o_small">#if($r.isNotEmpty(pageCategories)), #end
$r.translate("meta.last.publication", $r.formatDateAndTime($lastPublicationDate)) $r.translate("meta.last.publication", $r.formatDateAndTime($lastPublicationDate))
</span> </span>
#end #end
<span class="o_portfolio_page_meta text-muted o_small">#if($r.isNotEmpty(pageCategories) || $r.isNotNull($lastPublicationDate)), #end <span class="o_portfolio_last_modified text-muted o_small">#if($r.isNotEmpty(pageCategories) || $r.isNotNull($lastPublicationDate)), #end
$r.translate("meta.last.modified", $r.formatDateAndTime($lastModified)) $r.translate("meta.last.modified", $r.formatDateAndTime($lastModified))
</span> </span>
</div> </div>
#if($r.available("poster") || $r.isNotEmpty($pageSummary)) #if($r.available("poster") || $r.isNotEmpty($pageSummary))
<div class="o_page_lead o_block_large_bottom"> <div class="o_page_summary o_block_top">
#if($r.available("poster")) #if($r.available("poster"))
<div class="o_media #if(!$pageSummary || $pageSummary.length() == 0) o_desc_empty"#end "> <div class="o_media #if(!$pageSummary || $pageSummary.length() == 0) o_desc_empty"#end ">
$r.render("poster") $r.render("poster")
...@@ -36,49 +33,9 @@ ...@@ -36,49 +33,9 @@
#end #end
</div> </div>
#end #end
#foreach($assignment in $assignments)
<div class="o_page_assignment o_togglebox_wrapper o_block">
<a href="#page_assignment_${assignment.key}" data-toggle="collapse" data-target="#page_assignment_${assignment.key}" class="o_opener" onclick="jQuery(this).toggleClass('o_in'); return false;">
<i class="o_icon o_icon-fw o_icon-lg"></i>
$r.translate("meta.page.assignment") $r.translate("meta.page.assignment.type"): $r.translate("assignment.type.${assignment.type}")
</a>
<div id="page_assignment_${assignment.key}" class="collapse">
<div class="o_togglebox_content clearfix">
#if($assignment.summary && $assignment.summary.length() > 0)
<div class="o_desc o_user_content_block">
$r.xssScan($assignment.summary)
</div>
#end
#if($assignment.content && $assignment.content.length() > 0)
<div class="o_desc o_user_content_block">
$r.xssScan($assignment.content)
</div>
#end
#if($assignment.documents && $assignment.documents.size() > 0)
<ul class="list-inline">
#foreach($document in $assignment.documents)
#set($fname = $document.getName())
<li class="o_attachment">
<a href="$mapperUri/${assignment.key}/$fname" target="_blank">
<div class="o_filename">$r.escapeHtml($fname)</div>
<div class="o_size">
<i class="o_icon o_icon-fw $r.getFiletypeIconCss($fname)"> </i>
$r.formatBytes($document.length())
</div>
</a>
</li>
#end
</ul>
#end
</div>
</div>
</div>
#end
#if($statusEnabled) #if($statusEnabled)
<div class="o_portfolio_status_block o_block"> <div class="o_portfolio_status_block o_block_top o_small clearfix">
<strong>$r.translate("page.status")</strong>: <i class="o_icon o_icon-fw $statusCss"> </i> $pageStatus <div class="o_portfolio_status"><strong>$r.translate("page.status")</strong>: <i class="o_icon o_icon-fw $statusCss"> </i> $pageStatus</div>
#if($r.available("publish")) #if($r.available("publish"))
$r.render("publish") $r.render("publish")
#end #end
...@@ -94,4 +51,43 @@ ...@@ -94,4 +51,43 @@
</div> </div>
#end #end
</div> </div>
</div>
\ No newline at end of file #foreach($assignment in $assignments)
<div class="o_page_assignment o_togglebox_wrapper o_block">
<a href="#page_assignment_${assignment.key}" data-toggle="collapse" data-target="#page_assignment_${assignment.key}" class="o_opener o_in" onclick="jQuery(this).toggleClass('o_in'); return false;"><i class="o_icon o_icon-fw o_icon-lg"></i></a>
<span class="o_page_assignement_info">
<i class="o_icon o_icon_assignment o_icon-fw"> </i>
<div class="o_block_inline_right"><strong>$r.translate("meta.page.assignment")</strong></div>
<div class="o_block_inline_left"><strong>$r.translate("meta.page.assignment.type"):</strong> $r.translate("assignment.type.${assignment.type}")</div>
</span>
<div id="page_assignment_${assignment.key}" class="collapse in">
<div class="o_togglebox_content clearfix">
#if($assignment.content && $assignment.content.length() > 0)
<h5>$r.translate("assignment.content")</h5>
<div class="o_desc">
$r.xssScan($assignment.content)
</div>
#end
#if($assignment.documents && $assignment.documents.size() > 0)
<h5>$r.translate("assignment.documents")</h5>
<ul class="list-inline">
#foreach($document in $assignment.documents)
#set($fname = $document.getName())
<li class="o_attachment">
<a href="$mapperUri/${assignment.key}/$fname" target="_blank">
<i class="o_icon o_icon-fw $r.getFiletypeIconCss($fname)"> </i>
<span class="o_filename">$r.escapeHtml($fname)</span>
<span class="o_size">
($r.formatBytes($document.length()))
</span>
</a>
</li>
#end
</ul>
#end
<div class="pull-right"><a href="#page_assignment_${assignment.key}" data-toggle="collapse" data-target="#page_assignment_${assignment.key}" onclick="jQuery('.o_page_assignment .o_opener ').toggleClass('o_in'); return false;">$r.translate("assignment.hide")</a></div>
</div>
</div>
</div>
#end
src/main/java/org/olat/modules/portfolio/ui/_i18n/LocalStrings_de.properties
+ 2
− 0
View file @ 3199dde6
...@@ -39,6 +39,8 @@ artefact.video=Video ...@@ -39,6 +39,8 @@ artefact.video=Video
assignment=Aufgabe assignment=Aufgabe
assignment.content=Aufgabe assignment.content=Aufgabe
assignment.document.upload=Dokument assignment.document.upload=Dokument
assignment.documents=Dokumente zur Aufgabe
assignment.hide=Aufgabenstellung verbergen
assignment.summary=Zusammenfassung assignment.summary=Zusammenfassung
assignment.title=Titel assignment.title=Titel
assignment.type=Typ assignment.type=Typ
......
src/main/java/org/olat/modules/portfolio/ui/_i18n/LocalStrings_en.properties
+ 2
− 0
View file @ 3199dde6
...@@ -39,6 +39,8 @@ artefact.video=Video ...@@ -39,6 +39,8 @@ artefact.video=Video
assignment=Assignment assignment=Assignment
assignment.content=Assignment assignment.content=Assignment
assignment.document.upload=Document assignment.document.upload=Document
assignment.documents=Documents for the assignment
assignment.hide=Hide assignment
assignment.summary=Summary assignment.summary=Summary
assignment.title=Title assignment.title=Title
assignment.type=Type assignment.type=Type
......
src/main/resources/serviceconfig/olat.properties
+ 2
− 2
View file @ 3199dde6
...@@ -1009,8 +1009,8 @@ ldap.learningResourceManagerRoleValue= ...@@ -1009,8 +1009,8 @@ ldap.learningResourceManagerRoleValue=
# Build properties # Build properties
##### #####
application.name=OpenOLAT application.name=OpenOLAT
build.version=11.0a build.version=11.0
build.identifier=openolat110a-dev build.identifier=openolat110-dev
build.repo.revision=local-devel build.repo.revision=local-devel
##### #####
......
src/main/webapp/static/themes/light/_config.scss
+ 12
− 9
View file @ 3199dde6
...@@ -330,6 +330,8 @@ $o-course-node-deleted : $badge-bg !default; ...@@ -330,6 +330,8 @@ $o-course-node-deleted : $badge-bg !default;
/* Portfolio v2 */ /* Portfolio v2 */
$o-portfolio-assignment-color : $brand-danger !default; $o-portfolio-assignment-color : $brand-danger !default;
$o-portfolio-assignment-background-color : $state-danger-bg !default;
$o-portfolio-assignment-font-size : $font-size-small !default;
$o-portfolio-media-browser-space : $padding-large-vertical * 2 !default; $o-portfolio-media-browser-space : $padding-large-vertical * 2 !default;
$o-portfolio-media-browser-space-sm : $padding-large-vertical !default; $o-portfolio-media-browser-space-sm : $padding-large-vertical !default;
$o-portfolio-media-browser-space-xs : $padding-xs-vertical !default; $o-portfolio-media-browser-space-xs : $padding-xs-vertical !default;
...@@ -339,17 +341,18 @@ $o-portfolio-media-browser-rowelem-width-sm : 80px !default; ...@@ -339,17 +341,18 @@ $o-portfolio-media-browser-rowelem-width-sm : 80px !default;
$o-portfolio-media-browser-rowelem-line-height-sm : 55px !default; $o-portfolio-media-browser-rowelem-line-height-sm : 55px !default;
$o-portfolio-media-browser-border : $brand-primary !default; $o-portfolio-media-browser-border : $brand-primary !default;
$o-portfolio-media-browser-meta-title-color : $brand-primary !default; $o-portfolio-media-browser-meta-title-color : $brand-primary !default;
$o-portfolio-entry-draft-color : $brand-warning; $o-portfolio-entry-draft-color : $brand-warning !default;
$o-portfolio-entry-published-color : $brand-primary; $o-portfolio-entry-published-color : $brand-primary !default;
$o-portfolio-entry-inrevision-color : $brand-danger; $o-portfolio-entry-inrevision-color : $brand-danger !default;
$o-portfolio-entry-closed-color : $brand-success; $o-portfolio-entry-closed-color : $brand-success !default;
$o-portfolio-entry-deleted-color : #000; $o-portfolio-entry-deleted-color : #000 !default;
$o-portfolio-media-content-background-color : #f8f8f8; $o-portfolio-media-content-background-color : #f8f8f8 !default;
$o-portfolio-media-content-space : $padding-large-vertical; $o-portfolio-media-content-space : $padding-large-vertical !default;
$o-portfolio-lead-space-sm : $padding-large-vertical !default; $o-portfolio-lead-space-sm : $padding-large-vertical !default;
$o-portfolio-lead-border-color : $gray-lighter; $o-portfolio-lead-border-color : $gray-lighter !default;
$o-portfolio-lead-border-radius : $border-radius-small !default; $o-portfolio-lead-border-radius : $border-radius-small !default;
$o-portfolio-lead-background-color : $gray-lighter; $o-portfolio-lead-background-color : $gray-lighter !default;
$o-portfolio-page-summary-font-size : $font-size-large !default;
/* Chat and other floating window */ /* Chat and other floating window */
......
src/main/webapp/static/themes/light/content.css
+ 1
− 1
View file @ 3199dde6
This diff is collapsed.
src/main/webapp/static/themes/light/content.css.map
+ 2
− 2
View file @ 3199dde6
This diff is collapsed.
src/main/webapp/static/themes/light/modules/_portfolio_v2.scss
+ 48
− 13
View file @ 3199dde6
...@@ -12,6 +12,33 @@ div#o_main_toolbar.o_toolbar.o_portfolio { ...@@ -12,6 +12,33 @@ div#o_main_toolbar.o_toolbar.o_portfolio {
border: 1px $o-portfolio-lead-border-color solid; border: 1px $o-portfolio-lead-border-color solid;
} }
.o_page_lead {
padding: $o-portfolio-lead-space-sm * 2;
.o_page_summary {
font-size: $o-portfolio-page-summary-font-size;
}
.o_portfolio_status {
display: inline-block;
padding-right: 2em;
}
}
.o_page_assignment{
font-size: $o-portfolio-assignment-font-size;
&.o_togglebox_wrapper div.o_togglebox_content {
margin: 10px 0 20px 0;
padding: 20px;
border-left: 3px solid $o-portfolio-assignment-color;
background-color: $o-portfolio-assignment-background-color;
}
.o_page_assignement_info {
position: relative;
left: -1em;
}
}
.o_portfolio_listing { .o_portfolio_listing {
.o_table_body.container-fluid { .o_table_body.container-fluid {
...@@ -100,6 +127,11 @@ div#o_main_toolbar.o_toolbar.o_portfolio { ...@@ -100,6 +127,11 @@ div#o_main_toolbar.o_toolbar.o_portfolio {
stroke: #ddd; stroke: #ddd;
} }
text {
fill: #888;
stroke: none;
font-size: 10px;
}
.dot.o_pf_status_draft { .dot.o_pf_status_draft {
fill: $o-portfolio-entry-draft-color; fill: $o-portfolio-entry-draft-color;
} }
...@@ -305,19 +337,22 @@ div#o_main_toolbar.o_toolbar.o_portfolio { ...@@ -305,19 +337,22 @@ div#o_main_toolbar.o_toolbar.o_portfolio {
} }
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
.o_portfolio_toc.o_portfolio_withtimeline, .o_portfolio_entries.o_portfolio_withtimeline { /* hide timeline on small screen, even when configured to be visible */
width: 100%; .o_portfolio_content {
float:none; .o_portfolio_toc.o_portfolio_withtimeline, .o_portfolio_entries.o_portfolio_withtimeline {
} width: 100%;
float:none;
.o_sel_timeline_off, .o_sel_timeline_on, .o_portfolio_timeline { }
display:none;
} .o_sel_timeline_off, .o_sel_timeline_on, .o_portfolio_timeline {
display:none;
.o_portfolio_content .o_portfolio_toc.o_portfolio_withtimeline { }
width: 100%;
float:none; .o_portfolio_content .o_portfolio_toc.o_portfolio_withtimeline {
} width: 100%;
float:none;
}
}
} }
.o_portfolio_media_browser { .o_portfolio_media_browser {
......
src/main/webapp/static/themes/light/theme.css
+ 1
− 1
View file @ 3199dde6
This diff is collapsed.
src/main/webapp/static/themes/light/theme.css.map
+ 1
− 1
View file @ 3199dde6
source diff could not be displayed: it is too large. Options to address this: view the blob.
src/main/webapp/static/themes/light/theme_ie_completions.css
+ 1
− 1
View file @ 3199dde6
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 @ 3199dde6
This diff is collapsed.
src/main/webapp/static/themes/openolat/theme.css.map
+ 1
− 1
View file @ 3199dde6
This diff is collapsed.
src/main/webapp/static/themes/openolat/theme_ie_completions.css
+ 1
− 1
View file @ 3199dde6
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