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
|
// Access to Bootstrap variables and mixins
|
||||||
@import '~ChillMainAssets/module/bootstrap/shared';
|
@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.new-activity-select-type {
|
||||||
div.activity-row {
|
div.activity-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -21,29 +23,36 @@ div.new-activity-select-type {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/// liste des échanges, sous le titre-badge, le bloc de contenu
|
//// ACTIVITY LIST PAGE
|
||||||
div.main {
|
// precise badge-title specific details
|
||||||
padding: 1em;
|
|
||||||
|
|
||||||
///
|
h2.badge-title {
|
||||||
ul.list-content {
|
|
||||||
list-style-type: none;
|
|
||||||
padding-left: 0.6em;
|
|
||||||
margin: 0;
|
|
||||||
li {
|
|
||||||
margin-bottom: 0.2em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
div.duration {
|
div.duration {
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
padding-left: 1em;
|
padding-left: 1em;
|
||||||
margin-top: 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 {
|
div.flex-bloc.concerned-groups {
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
div.item-bloc {
|
div.item-bloc {
|
||||||
|
|||||||
@ -36,14 +36,13 @@
|
|||||||
<span class="title_action">
|
<span class="title_action">
|
||||||
|
|
||||||
{{ activity.type.name | localize_translatable_string }}
|
{{ activity.type.name | localize_translatable_string }}
|
||||||
<ul class="small_in_title">
|
|
||||||
|
|
||||||
|
<ul class="small_in_title">
|
||||||
<li>
|
<li>
|
||||||
<abbr title="{{ 'location'|trans }}">{{ 'location'|trans ~ ': ' }}</abbr>
|
<abbr title="{{ 'location'|trans }}">{{ 'location'|trans ~ ': ' }}</abbr>
|
||||||
{# TODO {% if activity.location %}{{ activity.location }}{% endif %} #}
|
{# TODO {% if activity.location %}{{ activity.location }}{% endif %} #}
|
||||||
Domicile de l'usager
|
Domicile de l'usager
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
{% if activity.user and t.userVisible %}
|
{% if activity.user and t.userVisible %}
|
||||||
<li>
|
<li>
|
||||||
<abbr title="{{ 'Referrer'|trans }}">{{ 'Referrer'|trans ~ ': ' }}</abbr>
|
<abbr title="{{ 'Referrer'|trans }}">{{ 'Referrer'|trans ~ ': ' }}</abbr>
|
||||||
@ -51,6 +50,35 @@
|
|||||||
</li>
|
</li>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</ul>
|
</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>
|
</span>
|
||||||
</h2>
|
</h2>
|
||||||
{#
|
{#
|
||||||
@ -68,69 +96,32 @@
|
|||||||
#}
|
#}
|
||||||
</div>
|
</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">
|
<div class="main">
|
||||||
<ul class="list-content">
|
{% if activity.comment.comment is not empty %}
|
||||||
{%- if t.reasonsVisible -%}
|
{{ activity.comment|chill_entity_render_box({
|
||||||
<li class="reasons">
|
'disable_markdown': false,
|
||||||
{%- if activity.reasons is not empty -%}
|
'limit_lines': 3,
|
||||||
{% for r in activity.reasons %}
|
'metadata': false,
|
||||||
{{ 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
|
|
||||||
} %}
|
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
{% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {
|
||||||
|
'context': context,
|
||||||
|
'with_display': 'row',
|
||||||
|
'entity': activity,
|
||||||
|
'badge_person': true
|
||||||
|
} %}
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="item-row separator">
|
<div class="item-row separator">
|
||||||
<div class="updatedBy">
|
<div class="updatedBy"></div>
|
||||||
{#
|
|
||||||
{{ 'Last updated by'|trans}}
|
|
||||||
<b>{{ activity.updatedBy|chill_entity_render_box }}</b>,<br>
|
|
||||||
{{ 'le ' ~ activity.updatedAt|format_datetime('long', 'short') }}
|
|
||||||
#}
|
|
||||||
</div>
|
|
||||||
<ul class="record_actions">
|
<ul class="record_actions">
|
||||||
<li>
|
<li>
|
||||||
<a href="{{ path('chill_activity_activity_show', { 'id': activity.id, 'person_id': person_id, 'accompanying_period_id': accompanying_course_id }) }}"
|
<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
|
* BADGES PERSON AND THIRDPARTY
|
||||||
* for chill person theme
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// chill person badges
|
|
||||||
span.badge-person,
|
span.badge-person,
|
||||||
span.badge-thirdparty {
|
span.badge-thirdparty {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
@ -18,15 +16,12 @@ span.badge-thirdparty {
|
|||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
span.badge-person {
|
||||||
span.badge-person {
|
border-bottom-color: $chill-green;
|
||||||
border-bottom-color: $chill-green;
|
}
|
||||||
}
|
span.badge-thirdparty {
|
||||||
|
border-bottom-color: shade-color($chill-pink, 10%);
|
||||||
// todo: move in thirdparty
|
}
|
||||||
span.badge-thirdparty {
|
|
||||||
border-bottom-color: shade-color($chill-pink, 10%);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* HOUSEHOLD HOLDER MARK
|
* HOUSEHOLD HOLDER MARK
|
||||||
@ -81,44 +76,44 @@ h2.badge-title {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/// AccompanyingCourse Work list Page
|
/// badge_title in AccompanyingCourse Work list Page
|
||||||
div.accompanying_course_work-list {
|
div.accompanying_course_work-list {
|
||||||
h2.badge-title {
|
h2.badge-title {
|
||||||
span.title_label {
|
span.title_label {
|
||||||
// Calculate same color then border:groove
|
// Calculate same color then border:groove
|
||||||
background-color: shade-color($social-action-color, 34%);
|
background-color: shade-color($social-action-color, 34%);
|
||||||
}
|
}
|
||||||
span.title_action {
|
span.title_action {
|
||||||
@include badge_title($social-action-color);
|
@include badge_title($social-action-color);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/// Activities on resume page
|
/// badge_title in Activities on resume page
|
||||||
div.activity-list {
|
div.activity-list {
|
||||||
h2.badge-title {
|
h2.badge-title {
|
||||||
span.title_label {
|
span.title_label {
|
||||||
// Calculate same color then border:groove
|
// Calculate same color then border:groove
|
||||||
background-color: shade-color($activity-color, 34%);
|
background-color: shade-color($activity-color, 34%);
|
||||||
h3 {
|
h3 {
|
||||||
color: $white;
|
color: $white;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
span.title_action {
|
}
|
||||||
@include badge_title($activity-color);
|
span.title_action {
|
||||||
}
|
@include badge_title($activity-color);
|
||||||
span.title_label {
|
}
|
||||||
div.duration {
|
span.title_label {
|
||||||
font-size: 70%;
|
div.duration {
|
||||||
font-weight: 500;
|
font-size: 70%;
|
||||||
p {
|
font-weight: 500;
|
||||||
margin-bottom: 0;
|
p {
|
||||||
text-align: right;
|
margin-bottom: 0;
|
||||||
abbr {
|
text-align: right;
|
||||||
text-decoration: none;
|
abbr {
|
||||||
}
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -8,19 +8,26 @@
|
|||||||
span.altname {}
|
span.altname {}
|
||||||
}
|
}
|
||||||
|
|
||||||
/// SOCIAL-ISSUE
|
/// SOCIAL-ISSUE AND SOCIAL-ACTION
|
||||||
&.entity-social-issue {
|
&.entity-social-issue,
|
||||||
|
&.entity-social-action {
|
||||||
margin-right: 0.3em;
|
margin-right: 0.3em;
|
||||||
font-size: 120%;
|
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 {
|
span.badge {
|
||||||
@include badge_social($social-issue-color);
|
@include badge_social($social-issue-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/// SOCIAL-ACTION
|
|
||||||
&.entity-social-action {
|
&.entity-social-action {
|
||||||
margin-right: 0.3em;
|
|
||||||
font-size: 120%;
|
|
||||||
span.badge {
|
span.badge {
|
||||||
@include badge_social($social-action-color);
|
@include badge_social($social-action-color);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user