mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
Activity, improve badge-title. Fix too long badges line break in a narrow inline wrapper.
This commit is contained in:
parent
8f889248fb
commit
800ab896bc
@ -1,7 +1,9 @@
|
||||
// Access to Bootstrap variables and mixins
|
||||
@import '~ChillMainAssets/module/bootstrap/shared';
|
||||
|
||||
// activity creation first step: select type page
|
||||
//// ACTIVITY CREATION
|
||||
// first step: select type page
|
||||
|
||||
div.new-activity-select-type {
|
||||
div.activity-row {
|
||||
display: flex;
|
||||
@ -21,29 +23,36 @@ div.new-activity-select-type {
|
||||
}
|
||||
}
|
||||
|
||||
/// liste des échanges, sous le titre-badge, le bloc de contenu
|
||||
div.main {
|
||||
padding: 1em;
|
||||
//// ACTIVITY LIST PAGE
|
||||
// precise badge-title specific details
|
||||
|
||||
///
|
||||
ul.list-content {
|
||||
list-style-type: none;
|
||||
padding-left: 0.6em;
|
||||
margin: 0;
|
||||
li {
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
}
|
||||
h2.badge-title {
|
||||
div.duration {
|
||||
font-size: smaller;
|
||||
padding-left: 1em;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
ul.list-content {
|
||||
font-size: 70%;
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
li {
|
||||
margin-bottom: 0.2em;
|
||||
// exception: change bg color for action badges above badge-title
|
||||
.bg-light {
|
||||
background-color: $chill-light-gray !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
div.main {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
//// ACTIVITY SHOW AND FORM PAGES
|
||||
// Exceptions for flex-bloc in concerned-groups
|
||||
|
||||
// exceptions for flex-bloc in concerned-groups
|
||||
div.flex-bloc.concerned-groups {
|
||||
margin-top: 1em;
|
||||
div.item-bloc {
|
||||
|
||||
@ -36,14 +36,13 @@
|
||||
<span class="title_action">
|
||||
|
||||
{{ activity.type.name | localize_translatable_string }}
|
||||
<ul class="small_in_title">
|
||||
|
||||
<ul class="small_in_title">
|
||||
<li>
|
||||
<abbr title="{{ 'location'|trans }}">{{ 'location'|trans ~ ': ' }}</abbr>
|
||||
{# TODO {% if activity.location %}{{ activity.location }}{% endif %} #}
|
||||
Domicile de l'usager
|
||||
</li>
|
||||
|
||||
{% if activity.user and t.userVisible %}
|
||||
<li>
|
||||
<abbr title="{{ 'Referrer'|trans }}">{{ 'Referrer'|trans ~ ': ' }}</abbr>
|
||||
@ -51,6 +50,35 @@
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
<ul class="list-content">
|
||||
{%- if t.reasonsVisible -%}
|
||||
{%- if activity.reasons is not empty -%}
|
||||
<li class="reasons">
|
||||
{% for r in activity.reasons %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
</li>
|
||||
{%- endif -%}
|
||||
{% endif %}
|
||||
{%- if t.socialIssuesVisible %}
|
||||
{%- if activity.socialIssues is not empty -%}
|
||||
<li class="social-issues">
|
||||
{% for r in activity.socialIssues %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
</li>
|
||||
{%- endif -%}
|
||||
{% endif %}
|
||||
{%- if t.socialActionsVisible -%}
|
||||
{%- if activity.socialActions is not empty -%}
|
||||
<li class="social-actions">
|
||||
{% for r in activity.socialActions %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
</li>
|
||||
{%- endif -%}
|
||||
{% endif %}
|
||||
</ul>
|
||||
</span>
|
||||
</h2>
|
||||
{#
|
||||
@ -68,69 +96,32 @@
|
||||
#}
|
||||
</div>
|
||||
|
||||
|
||||
{% if activity.comment.comment is not empty
|
||||
or activity.persons|length > 0
|
||||
or activity.thirdParties|length > 0
|
||||
or activity.users|length > 0
|
||||
%}
|
||||
<div class="main">
|
||||
<ul class="list-content">
|
||||
{%- if t.reasonsVisible -%}
|
||||
<li class="reasons">
|
||||
{%- if activity.reasons is not empty -%}
|
||||
{% for r in activity.reasons %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
{%- endif -%}
|
||||
</li>
|
||||
{% endif %}
|
||||
{%- if t.socialIssuesVisible %}
|
||||
<li class="social-issues">
|
||||
{%- if activity.socialIssues is not empty -%}
|
||||
{% for r in activity.socialIssues %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
{%- endif -%}
|
||||
</li>
|
||||
{% endif %}
|
||||
{%- if t.socialActionsVisible -%}
|
||||
<li class="social-actions">
|
||||
{%- if activity.socialActions is not empty -%}
|
||||
{% for r in activity.socialActions %}
|
||||
{{ r|chill_entity_render_box }}
|
||||
{% endfor %}
|
||||
{%- endif -%}
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
|
||||
{% if activity.comment.comment is not empty
|
||||
or activity.persons|length > 0
|
||||
or activity.thirdParties|length > 0
|
||||
or activity.users|length > 0
|
||||
%}
|
||||
|
||||
{% if activity.comment.comment is not empty %}
|
||||
{{ activity.comment|chill_entity_render_box({
|
||||
'disable_markdown': false,
|
||||
'limit_lines': 3,
|
||||
'metadata': false,
|
||||
}) }}
|
||||
{% endif %}
|
||||
|
||||
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {
|
||||
'context': context,
|
||||
'with_display': 'row',
|
||||
'entity': activity,
|
||||
'badge_person': true
|
||||
} %}
|
||||
|
||||
{% if activity.comment.comment is not empty %}
|
||||
{{ activity.comment|chill_entity_render_box({
|
||||
'disable_markdown': false,
|
||||
'limit_lines': 3,
|
||||
'metadata': false,
|
||||
}) }}
|
||||
{% endif %}
|
||||
|
||||
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {
|
||||
'context': context,
|
||||
'with_display': 'row',
|
||||
'entity': activity,
|
||||
'badge_person': true
|
||||
} %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="item-row separator">
|
||||
<div class="updatedBy">
|
||||
{#
|
||||
{{ 'Last updated by'|trans}}
|
||||
<b>{{ activity.updatedBy|chill_entity_render_box }}</b>,<br>
|
||||
{{ 'le ' ~ activity.updatedAt|format_datetime('long', 'short') }}
|
||||
#}
|
||||
</div>
|
||||
<div class="updatedBy"></div>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}"
|
||||
|
||||
@ -1,9 +1,7 @@
|
||||
/*
|
||||
* BADGES, MARKS, PINS
|
||||
* for chill person theme
|
||||
* BADGES PERSON AND THIRDPARTY
|
||||
*/
|
||||
|
||||
// chill person badges
|
||||
span.badge-person,
|
||||
span.badge-thirdparty {
|
||||
display: inline-block;
|
||||
@ -18,15 +16,12 @@ span.badge-thirdparty {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
span.badge-person {
|
||||
border-bottom-color: $chill-green;
|
||||
}
|
||||
|
||||
// todo: move in thirdparty
|
||||
span.badge-thirdparty {
|
||||
border-bottom-color: shade-color($chill-pink, 10%);
|
||||
}
|
||||
span.badge-person {
|
||||
border-bottom-color: $chill-green;
|
||||
}
|
||||
span.badge-thirdparty {
|
||||
border-bottom-color: shade-color($chill-pink, 10%);
|
||||
}
|
||||
|
||||
/*
|
||||
* HOUSEHOLD HOLDER MARK
|
||||
@ -81,44 +76,44 @@ h2.badge-title {
|
||||
}
|
||||
}
|
||||
|
||||
/// AccompanyingCourse Work list Page
|
||||
div.accompanying_course_work-list {
|
||||
h2.badge-title {
|
||||
span.title_label {
|
||||
// Calculate same color then border:groove
|
||||
background-color: shade-color($social-action-color, 34%);
|
||||
}
|
||||
span.title_action {
|
||||
@include badge_title($social-action-color);
|
||||
}
|
||||
/// badge_title in AccompanyingCourse Work list Page
|
||||
div.accompanying_course_work-list {
|
||||
h2.badge-title {
|
||||
span.title_label {
|
||||
// Calculate same color then border:groove
|
||||
background-color: shade-color($social-action-color, 34%);
|
||||
}
|
||||
span.title_action {
|
||||
@include badge_title($social-action-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Activities on resume page
|
||||
div.activity-list {
|
||||
h2.badge-title {
|
||||
span.title_label {
|
||||
// Calculate same color then border:groove
|
||||
background-color: shade-color($activity-color, 34%);
|
||||
h3 {
|
||||
color: $white;
|
||||
}
|
||||
/// badge_title in Activities on resume page
|
||||
div.activity-list {
|
||||
h2.badge-title {
|
||||
span.title_label {
|
||||
// Calculate same color then border:groove
|
||||
background-color: shade-color($activity-color, 34%);
|
||||
h3 {
|
||||
color: $white;
|
||||
}
|
||||
span.title_action {
|
||||
@include badge_title($activity-color);
|
||||
}
|
||||
span.title_label {
|
||||
div.duration {
|
||||
font-size: 70%;
|
||||
font-weight: 500;
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
text-align: right;
|
||||
abbr {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
span.title_action {
|
||||
@include badge_title($activity-color);
|
||||
}
|
||||
span.title_label {
|
||||
div.duration {
|
||||
font-size: 70%;
|
||||
font-weight: 500;
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
text-align: right;
|
||||
abbr {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -8,19 +8,26 @@
|
||||
span.altname {}
|
||||
}
|
||||
|
||||
/// SOCIAL-ISSUE
|
||||
&.entity-social-issue {
|
||||
/// SOCIAL-ISSUE AND SOCIAL-ACTION
|
||||
&.entity-social-issue,
|
||||
&.entity-social-action {
|
||||
margin-right: 0.3em;
|
||||
font-size: 120%;
|
||||
span.badge {
|
||||
// for too long badge in a narrow inside block
|
||||
text-align: initial;
|
||||
margin-bottom: 0.2em;
|
||||
> span {
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.entity-social-issue {
|
||||
span.badge {
|
||||
@include badge_social($social-issue-color);
|
||||
}
|
||||
}
|
||||
|
||||
/// SOCIAL-ACTION
|
||||
&.entity-social-action {
|
||||
margin-right: 0.3em;
|
||||
font-size: 120%;
|
||||
span.badge {
|
||||
@include badge_social($social-action-color);
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user