Merge pull request #5569 from tsiegleauq/scss-fix-for-change-recommendation-overview
fix white change-recommendation-overview
This commit is contained in:
Emanuel Schütze
GitHub
commit
40c2a7fae4
|
|
@ -1,79 +1,155 @@
|
|||
<!-- A summary of all changes -->
|
||||
<section class="change-recommendation-overview" *ngIf="changes.length > 0">
|
||||
<strong> {{ 'Summary of changes' | translate }}: </strong>
|
||||
<div class="motion-detail-diff">
|
||||
<section class="change-recommendation-overview" *ngIf="changes.length > 0">
|
||||
<strong> {{ 'Summary of changes' | translate }}: </strong>
|
||||
|
||||
<ul>
|
||||
<li *ngFor="let change of changes">
|
||||
<a
|
||||
href=""
|
||||
(click)="scrollToChangeClicked(change, $event)"
|
||||
[class.amendment]="isAmendment(change)"
|
||||
[class.recommendation]="isChangeRecommendation(change)"
|
||||
>
|
||||
<span *ngIf="!change.isTitleChange()" class="line-number">
|
||||
{{ 'Line' | translate }} {{ formatLineRange(change) }}
|
||||
</span>
|
||||
<span *ngIf="change.isTitleChange()">{{ 'Title' | translate }}</span>
|
||||
<span *ngIf="isChangeRecommendation(change)"> ({{ 'Change recommendation' | translate }})</span>
|
||||
<span *ngIf="isAmendment(change)"> ({{ 'Amendment' | translate }} {{ change.getIdentifier() }})</span>
|
||||
<span class="operation" *ngIf="isChangeRecommendation(change)">
|
||||
– {{ getRecommendationTypeName(change) | translate }}
|
||||
<!--
|
||||
<ul>
|
||||
<li *ngFor="let change of changes">
|
||||
<a
|
||||
href=""
|
||||
(click)="scrollToChangeClicked(change, $event)"
|
||||
[class.amendment]="isAmendment(change)"
|
||||
[class.recommendation]="isChangeRecommendation(change)"
|
||||
>
|
||||
<span *ngIf="!change.isTitleChange()" class="line-number">
|
||||
{{ 'Line' | translate }} {{ formatLineRange(change) }}
|
||||
</span>
|
||||
<span *ngIf="change.isTitleChange()">{{ 'Title' | translate }}</span>
|
||||
<span *ngIf="isChangeRecommendation(change)"> ({{ 'Change recommendation' | translate }})</span>
|
||||
<span *ngIf="isAmendment(change)">
|
||||
({{ 'Amendment' | translate }} {{ change.getIdentifier() }})</span
|
||||
>
|
||||
<span class="operation" *ngIf="isChangeRecommendation(change)">
|
||||
– {{ getRecommendationTypeName(change) | translate }}
|
||||
<!--
|
||||
@TODO
|
||||
<span ng-if="change.original.getType(motion.getVersion(version).text) == 3">
|
||||
{ change.other_description }
|
||||
</span>
|
||||
-->
|
||||
</span>
|
||||
<span class="status">
|
||||
<ng-container *ngIf="change.isRejected() && !isAmendment(change)">
|
||||
– <span>{{ 'Rejected' | translate }}</span></ng-container
|
||||
</span>
|
||||
<span class="status">
|
||||
<ng-container *ngIf="change.isRejected() && !isAmendment(change)">
|
||||
– <span>{{ 'Rejected' | translate }}</span></ng-container
|
||||
>
|
||||
<ng-container *ngIf="(change.isAccepted() || isAmendment(change)) && change.stateName">
|
||||
– {{ change.stateName | translate }}</ng-container
|
||||
>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div *ngIf="changes.length === 0" class="no-changes">{{ 'No change recommendations yet' | translate }}</div>
|
||||
</section>
|
||||
|
||||
<span class="text-prefix-label" *ngIf="showPreamble">{{ preamble | translate }}</span>
|
||||
|
||||
<!-- The actual diff view -->
|
||||
<div class="motion-text-with-diffs">
|
||||
<div *ngIf="getTitleChangingObject() as changedTitle">
|
||||
<div class="diff-box diff-box-{{ changedTitle.getChangeId() }} clearfix">
|
||||
<div class="action-row" *osPerms="'motions.can_manage'">
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isRecommendation(changedTitle)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="changeRecommendationMenu"
|
||||
[matMenuTriggerData]="{ change: changedTitle }"
|
||||
>
|
||||
<ng-container *ngIf="(change.isAccepted() || isAmendment(change)) && change.stateName">
|
||||
– {{ change.stateName | translate }}</ng-container
|
||||
>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="status-row" *ngIf="changedTitle.isRejected()">
|
||||
<i class="grey">{{ 'Rejected' | translate }}</i>
|
||||
</div>
|
||||
|
||||
<div *ngIf="changes.length === 0" class="no-changes">{{ 'No change recommendations yet' | translate }}</div>
|
||||
</section>
|
||||
|
||||
<span class="text-prefix-label" *ngIf="showPreamble">{{ preamble | translate }}</span>
|
||||
|
||||
<!-- The actual diff view -->
|
||||
<div class="motion-text-with-diffs">
|
||||
<div *ngIf="getTitleChangingObject() as changedTitle">
|
||||
<div class="diff-box diff-box-{{ changedTitle.getChangeId() }} clearfix">
|
||||
<div class="action-row" *osPerms="'motions.can_manage'">
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isRecommendation(changedTitle)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="changeRecommendationMenu"
|
||||
[matMenuTriggerData]="{ change: changedTitle }"
|
||||
<div
|
||||
class="motion-text motion-text-diff"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
[class.line-numbers-inline]="isLineNumberingInline()"
|
||||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
[attr.data-change-id]="changedTitle.getChangeId()"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
<div class="bold">{{ 'Changed title' | translate }}:</div>
|
||||
<div [innerHTML]="getFormattedTitleDiff() | trust: 'html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="status-row" *ngIf="changedTitle.isRejected()">
|
||||
<i class="grey">{{ 'Rejected' | translate }}</i>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div *ngFor="let change of getAllTextChangingObjects(); let i = index">
|
||||
<div
|
||||
class="motion-text motion-text-diff"
|
||||
class="motion-text"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
[class.line-numbers-inline]="isLineNumberingInline()"
|
||||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
[attr.data-change-id]="changedTitle.getChangeId()"
|
||||
>
|
||||
<div class="bold">{{ 'Changed title' | translate }}:</div>
|
||||
<div [innerHTML]="getFormattedTitleDiff() | trust: 'html'"></div>
|
||||
<os-motion-detail-original-change-recommendations
|
||||
[html]="getTextBetweenChanges(getAllTextChangingObjects()[i - 1], change)"
|
||||
[changeRecommendations]="[]"
|
||||
(createChangeRecommendation)="onCreateChangeRecommendation($event)"
|
||||
></os-motion-detail-original-change-recommendations>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="diff-box diff-box-{{ change.getChangeId() }} clearfix"
|
||||
[class.collides]="hasCollissions(change, getAllTextChangingObjects())"
|
||||
>
|
||||
<div class="collission-hint" *ngIf="hasCollissions(change, getAllTextChangingObjects())">
|
||||
<mat-icon matTooltip="{{ 'This change collides with another one.' | translate }}">warning</mat-icon>
|
||||
</div>
|
||||
<div class="action-row" *osPerms="'motions.can_manage'">
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isRecommendation(change)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="changeRecommendationMenu"
|
||||
[matMenuTriggerData]="{ change: change }"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isAmendment(change)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="amendmentMenu"
|
||||
[matMenuTriggerData]="{ change: change }"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
|
||||
<!--
|
||||
<a ng-if="change.type == 'amendment'" ui-sref="motions.motion.detail({id: change.original.id})"
|
||||
uib-tooltip="Open amendment"
|
||||
class="btn btn-default btn-sm pull-right btn-amend-info">
|
||||
<i class="fa fa-info"></i>
|
||||
{{ change.original.identifier }}
|
||||
</a>
|
||||
--></div>
|
||||
<div class="status-row" *ngIf="isChangeRecommendation(change) && change.isRejected()">
|
||||
<i class="grey">{{ 'Rejected' | translate }}</i>
|
||||
</div>
|
||||
|
||||
<!-- If it's an amendment, only accepted ones will be passed to this component
|
||||
by default (== !showAllAmendments). In this case, don't show the prefix.
|
||||
However, if showAllAmendments === true, the prefix should be shown alwayes,
|
||||
even if it's accepted -->
|
||||
<div class="status-row" *ngIf="isAmendment(change) && showAllAmendments">
|
||||
<i class="grey"
|
||||
>{{ change.amendment.identifier }} - {{ change.amendment.state.name | translate }}</i
|
||||
>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="motion-text motion-text-diff"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
[class.line-numbers-inline]="isLineNumberingInline()"
|
||||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
[attr.data-change-id]="change.getChangeId()"
|
||||
[innerHTML]="getDiff(change) | trust: 'html'"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngFor="let change of getAllTextChangingObjects(); let i = index">
|
||||
|
||||
<div
|
||||
class="motion-text"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
|
|
@ -81,165 +157,91 @@
|
|||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
>
|
||||
<os-motion-detail-original-change-recommendations
|
||||
[html]="getTextBetweenChanges(getAllTextChangingObjects()[i - 1], change)"
|
||||
[html]="getTextRemainderAfterLastChange()"
|
||||
[changeRecommendations]="[]"
|
||||
(createChangeRecommendation)="onCreateChangeRecommendation($event)"
|
||||
></os-motion-detail-original-change-recommendations>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="diff-box diff-box-{{ change.getChangeId() }} clearfix"
|
||||
[class.collides]="hasCollissions(change, getAllTextChangingObjects())"
|
||||
>
|
||||
<div class="collission-hint" *ngIf="hasCollissions(change, getAllTextChangingObjects())">
|
||||
<mat-icon matTooltip="{{ 'This change collides with another one.' | translate }}">warning</mat-icon>
|
||||
</div>
|
||||
<div class="action-row" *osPerms="'motions.can_manage'">
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isRecommendation(change)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="changeRecommendationMenu"
|
||||
[matMenuTriggerData]="{ change: change }"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngIf="isAmendment(change)"
|
||||
type="button"
|
||||
[matMenuTriggerFor]="amendmentMenu"
|
||||
[matMenuTriggerData]="{ change: change }"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
</button>
|
||||
|
||||
<!--
|
||||
<a ng-if="change.type == 'amendment'" ui-sref="motions.motion.detail({id: change.original.id})"
|
||||
uib-tooltip="Open amendment"
|
||||
class="btn btn-default btn-sm pull-right btn-amend-info">
|
||||
<i class="fa fa-info"></i>
|
||||
{{ change.original.identifier }}
|
||||
</a>
|
||||
-->
|
||||
</div>
|
||||
<div class="status-row" *ngIf="isChangeRecommendation(change) && change.isRejected()">
|
||||
<i class="grey">{{ 'Rejected' | translate }}</i>
|
||||
</div>
|
||||
|
||||
<!-- If it's an amendment, only accepted ones will be passed to this component
|
||||
by default (== !showAllAmendments). In this case, don't show the prefix.
|
||||
However, if showAllAmendments === true, the prefix should be shown alwayes,
|
||||
even if it's accepted -->
|
||||
<div class="status-row" *ngIf="isAmendment(change) && showAllAmendments">
|
||||
<i class="grey">{{ change.amendment.identifier }} - {{ change.amendment.state.name | translate }}</i>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="motion-text motion-text-diff"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
[class.line-numbers-inline]="isLineNumberingInline()"
|
||||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
[attr.data-change-id]="change.getChangeId()"
|
||||
[innerHTML]="getDiff(change) | trust: 'html'"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="motion-text"
|
||||
[class.line-numbers-none]="isLineNumberingNone()"
|
||||
[class.line-numbers-inline]="isLineNumberingInline()"
|
||||
[class.line-numbers-outside]="isLineNumberingOutside()"
|
||||
>
|
||||
<os-motion-detail-original-change-recommendations
|
||||
[html]="getTextRemainderAfterLastChange()"
|
||||
[changeRecommendations]="[]"
|
||||
(createChangeRecommendation)="onCreateChangeRecommendation($event)"
|
||||
></os-motion-detail-original-change-recommendations>
|
||||
</div>
|
||||
<mat-menu #amendmentMenu="matMenu">
|
||||
<ng-template matMenuContent let-change="change">
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
[routerLink]="change.amendment.getDetailStateURL()"
|
||||
[state]="{ back: 'true' }"
|
||||
>
|
||||
<mat-icon>visibility_on</mat-icon>
|
||||
<span>{{ 'Show amendment' | translate }}</span>
|
||||
</button>
|
||||
|
||||
<mat-divider *ngIf="change.amendment.state.next_states.length > 0"></mat-divider>
|
||||
|
||||
<button
|
||||
*ngFor="let state of change.amendment.state.next_states"
|
||||
mat-menu-item
|
||||
(click)="setAmendmentState(change, state.id)"
|
||||
>
|
||||
{{ state.name | translate }} <span *ngIf="state.show_state_extension_field"> ...</span>
|
||||
</button>
|
||||
<mat-divider *ngIf="change.amendment.state.next_states.length > 0"></mat-divider>
|
||||
<button
|
||||
*ngFor="let state of change.amendment.state.previous_states"
|
||||
mat-menu-item
|
||||
(click)="setAmendmentState(change, state.id)"
|
||||
>
|
||||
<mat-icon>arrow_back</mat-icon>
|
||||
{{ state.name | translate }}
|
||||
<span *ngIf="state.show_state_extension_field"> ...</span>
|
||||
</button>
|
||||
<button mat-menu-item (click)="setAmendmentState(change, null)">
|
||||
<mat-icon>replay</mat-icon>
|
||||
{{ 'Reset state' | translate }}
|
||||
</button>
|
||||
|
||||
<!-- perms.isAllowed('change_state', motion) -->
|
||||
</ng-template>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #changeRecommendationMenu="matMenu">
|
||||
<ng-template matMenuContent let-change="change">
|
||||
<button type="button" mat-menu-item (click)="setAcceptanceValue(change, 'accepted')">
|
||||
<mat-icon>thumb_up</mat-icon>
|
||||
<span>{{ 'Accept' | translate }}</span>
|
||||
<mat-icon class="active-indicator">{{ change.isAccepted() ? 'done' : '' }}</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-menu-item (click)="setAcceptanceValue(change, 'rejected')">
|
||||
<mat-icon>thumb_down</mat-icon>
|
||||
<span>{{ 'Reject' | translate }}</span>
|
||||
<mat-icon class="active-indicator">{{ change.isRejected() ? 'done' : '' }}</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-menu-item (click)="setInternal(change, !change.internal)">
|
||||
<mat-icon>{{ change.internal ? 'check_box_outline_blank' : 'check_box' }}</mat-icon>
|
||||
<span>{{ 'Public' | translate }}</span>
|
||||
</button>
|
||||
<button type="button" mat-menu-item (click)="deleteChangeRecommendation(change, $event)">
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>{{ 'Delete' | translate }}</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="editChangeRecommendation(change, $event)"
|
||||
*ngIf="!change.isTitleChange()"
|
||||
>
|
||||
<mat-icon>edit</mat-icon>
|
||||
<span>{{ 'Edit' | translate }}</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="editTitleChangeRecommendation(change, $event)"
|
||||
*ngIf="change.isTitleChange()"
|
||||
>
|
||||
<mat-icon>edit</mat-icon>
|
||||
<span>{{ 'Edit' | translate }}</span>
|
||||
</button>
|
||||
</ng-template>
|
||||
</mat-menu>
|
||||
</div>
|
||||
|
||||
<mat-menu #amendmentMenu="matMenu">
|
||||
<ng-template matMenuContent let-change="change">
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
[routerLink]="change.amendment.getDetailStateURL()" [state]="{ back: 'true' }"
|
||||
>
|
||||
<mat-icon>visibility_on</mat-icon>
|
||||
<span>{{ 'Show amendment' | translate }}</span>
|
||||
</button>
|
||||
|
||||
<mat-divider *ngIf="change.amendment.state.next_states.length > 0"></mat-divider>
|
||||
|
||||
<button *ngFor="let state of change.amendment.state.next_states" mat-menu-item (click)="setAmendmentState(change, state.id)">
|
||||
{{ state.name | translate }} <span *ngIf="state.show_state_extension_field"> ...</span>
|
||||
</button>
|
||||
<mat-divider *ngIf="change.amendment.state.next_states.length > 0"></mat-divider>
|
||||
<button
|
||||
*ngFor="let state of change.amendment.state.previous_states"
|
||||
mat-menu-item
|
||||
(click)="setAmendmentState(change, state.id)"
|
||||
>
|
||||
<mat-icon>arrow_back</mat-icon>
|
||||
{{ state.name | translate }}
|
||||
<span *ngIf="state.show_state_extension_field"> ...</span>
|
||||
</button>
|
||||
<button mat-menu-item (click)="setAmendmentState(change, null)">
|
||||
<mat-icon>replay</mat-icon>
|
||||
{{ 'Reset state' | translate }}
|
||||
</button>
|
||||
|
||||
<!-- perms.isAllowed('change_state', motion) -->
|
||||
</ng-template>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #changeRecommendationMenu="matMenu">
|
||||
<ng-template matMenuContent let-change="change">
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="setAcceptanceValue(change, 'accepted')"
|
||||
>
|
||||
<mat-icon>thumb_up</mat-icon>
|
||||
<span>{{ 'Accept' | translate }}</span>
|
||||
<mat-icon class="active-indicator">{{ change.isAccepted() ? 'done' : '' }}</mat-icon>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="setAcceptanceValue(change, 'rejected')"
|
||||
>
|
||||
<mat-icon>thumb_down</mat-icon>
|
||||
<span>{{ 'Reject' | translate }}</span>
|
||||
<mat-icon class="active-indicator">{{ change.isRejected() ? 'done' : '' }}</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-menu-item (click)="setInternal(change, !change.internal)">
|
||||
<mat-icon>{{ change.internal ? 'check_box_outline_blank' : 'check_box' }}</mat-icon>
|
||||
<span>{{ 'Public' | translate }}</span>
|
||||
</button>
|
||||
<button type="button" mat-menu-item (click)="deleteChangeRecommendation(change, $event)">
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>{{ 'Delete' | translate }}</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="editChangeRecommendation(change, $event)"
|
||||
*ngIf="!change.isTitleChange()"
|
||||
>
|
||||
<mat-icon>edit</mat-icon>
|
||||
<span>{{ 'Edit' | translate }}</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-menu-item
|
||||
(click)="editTitleChangeRecommendation(change, $event)"
|
||||
*ngIf="change.isTitleChange()"
|
||||
>
|
||||
<mat-icon>edit</mat-icon>
|
||||
<span>{{ 'Edit' | translate }}</span>
|
||||
</button>
|
||||
</ng-template>
|
||||
</mat-menu>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
@mixin os-motion-detail-diff-style($theme) {
|
||||
$background: map-get($theme, background);
|
||||
|
||||
.motion-text-with-diffs {
|
||||
.motion-detail-diff {
|
||||
.change-recommendation-overview,
|
||||
.diff-box {
|
||||
background-color: mat-color($background, background);
|
||||
|
|
|
|||
Loading…
Reference in New Issue