Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HW-379: Fixed minor css issue for dashlet #82

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions ang/civicase/ActivityItemInnerWrapper.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
<div ng-if="activity.category && activity.category.length && templateExists('~/civicase/ActivityItemInner-' + activity.category[0] + '.html')" ng-include="'~/civicase/ActivityItemInner-' + activity.category[0] + '.html'"></div>
<div ng-if="!(activity.category && activity.category.length && templateExists('~/civicase/ActivityItemInner-' + activity.category[0] + '.html'))" ng-include="'~/civicase/ActivityItemInner-default.html'"></div>
<a class="act-case-info" title="{{ ts('View Case') }}" ng-if="activity.case" ng-href="#/case/list?caseId={{ activity.case_id }}&cf=%7B%22status_id%22:%5B%22{{ activity.case.status.name }}%22%5D,%22case_type_id%22:%5B%22{{ activity.case.type.name }}%22%5D%7D">
<span style="background-color: {{ activity.case.status.color }}" title="{{ ts('Status: %1', {1: activity.case.status.label}) }}">
{{ ts('Case: %1', {1: activity.case_id}) }}
<span style="background-color: {{ activity.case.status.color }}" title="{{ ts('Status: %1', {1: activity.case.status.label}) }}">{{ ts('Case:') }} <span>{{ activity.case_id }}</span>
<span class="arrow" style="border-right-color:{{ activity.case.status.color }}; border-top-color:{{ activity.case.status.color }};"></span>
</span>
<span>{{ activity.case.type.title }}</span>
<span civicase-activity-contacts="activity.case.client"></span>
Expand Down
4 changes: 2 additions & 2 deletions ang/civicase/DashboardCtrl.html
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ <h1 crm-page-title crm-document-title="myCasesOnly ? ts('CiviCase Dashboard - My

<div class="row dashboard-case-wrapper">
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel panel-default next-milestone-panel">
<div class="panel-heading">
<h3 class="panel-title">{{ ts('Next Milestones') }}
<span class="badge badge-primary" ng-class="{'badge-danger': dashboardActivities.nextMilestones[0].is_overdue}">{{ dashboardActivities.nextMilestonesCount }}</span>
Expand Down Expand Up @@ -64,7 +64,7 @@ <h3 class="panel-title">{{ ts('Next Milestones') }}
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel panel-default recent-communication-panel">
<div class="panel-heading">
<h3 class="panel-title">{{ ts('Recent Communications') }}
<span class="badge badge-primary">{{ dashboardActivities.recentCommunicationCount }}</span>
Expand Down
4 changes: 2 additions & 2 deletions ang/civicase/Utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -486,10 +486,10 @@
'<span ng-if="contacts.length === 2">&amp; <a title="{{ ts(\'View Contact\') }}" href="{{ url(\'civicrm/contact/view\', {cid: contacts[1].contact_id}) }}">{{ contacts[1].display_name }}</a></span>' +
// preventDefault stops the browser from folling a link if this is used inside an <a> tag and the user clicks the button.
'<div class="btn-group btn-group-xs" ng-if="contacts.length > 2" ng-click="$event.preventDefault();">' +
' <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="{{ ts(\'Additional Contacts\') }}">' +
' <button type="button" class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="{{ ts(\'Additional Contacts\') }}">' +
' + {{ contacts.length - 1 }}' +
' </button>' +
' <ul class="dropdown-menu" >' +
' <ul class="dropdown-menu pull-right" >' +
' <li ng-repeat="(index, contact) in contacts" ng-if="index">' +
' <a title="{{ ts(\'View Contact\') }}" href="{{ url(\'civicrm/contact/view\', {cid: contact.contact_id}) }}">{{ contact.display_name }}</a>' +
' </li>' +
Expand Down
40 changes: 22 additions & 18 deletions css/activityFeed.css
Original file line number Diff line number Diff line change
Expand Up @@ -457,39 +457,43 @@
}

#bootstrap-theme .act-feed-item a.act-case-info {
background-color: #fff;
border-radius: 4px;
border: 1px solid #ddd;
display: block;
text-decoration: none;
background-color: #FFFFFF;
border-radius: 3px;
border: 1px solid #E8EEF0;
color: inherit;
clear: both;
cursor: pointer;
}
#bootstrap-theme .act-feed-item a.act-case-info:hover {
border: 1px solid #666;
display: block;
text-decoration: none;
}
#bootstrap-theme .act-feed-item a.act-case-info span {
display: inline-block;
padding: 4px 6px;
height: 28px;
border-radius: 4px 0 0 0;
border-radius: 3px 0 0 3px;
}
#bootstrap-theme .act-feed-item a.act-case-info span:first-child {
#bootstrap-theme .act-feed-item a.act-case-info > span:first-child {
color: #fff;
font-weight: 600;
padding-right: 12px;
margin-right: 12px;
position: relative;
}
#bootstrap-theme .act-feed-item a.act-case-info span:first-child:after {
#bootstrap-theme .act-feed-item a.act-case-info span:first-child span.arrow {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I prefer the simplicity of the previous css using :after but if you want to define a new element let's do it properly. Give it a name like civicase-crayon-tip and define it in its own right (there's no need for the specificity of .act-feed-item a.act-case-info span:first-child since a generic css element ought to work anywhere not just in that one place.

border-color: transparent;
border-radius: 2px;
border-style: solid;
border-width: 10px;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 14px 0 14px 10px;
border-color: white transparent white transparent;
position: absolute;
right: 0;
top: 0;
right: -10px;
top: 4px;
transform: rotate(45deg);
width: 0;
}
#bootstrap-theme .act-feed-item a.act-case-info > span:first-child span {
font-weight: normal;
padding: 0;
}
#bootstrap-theme .activity-timeline .act-feed-item {
margin: 0px 22px;
Expand Down
21 changes: 21 additions & 0 deletions css/dashboard.css
Original file line number Diff line number Diff line change
Expand Up @@ -246,6 +246,15 @@
#bootstrap-theme .dashboard-case-wrapper .panel-title .badge {
margin-left: 5px;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .act-star {
margin-top: -7px;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .cb-dot {
margin-left: -13px;
}
#bootstrap-theme .dashboard-case-wrapper .recent-communication-panel .act-feed-item-content {
padding: 5px 15px 15px;
}
#bootstrap-theme .dashboard-case-wrapper .act-category-milestone.act-feed-item .act-feed-inner {
margin-left: 0;
padding-left: 0;
Expand All @@ -254,6 +263,18 @@
margin-left: 3em;
padding-left: 2em;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .act-category-milestone .act-feed-item-content > div {
margin-left: 1.2em;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .act-contacts-target strong {
display: none;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .act-date {
float: left;
}
#bootstrap-theme .dashboard-case-wrapper .next-milestone-panel .act-contacts {
float: right;
}
#bootstrap-theme .dashboard-case-wrapper .act-category-milestone.act-feed-item .act-feed-item-content h4 {
margin-bottom: 0;
}
Expand Down
1 change: 1 addition & 0 deletions css/general.css
Original file line number Diff line number Diff line change
Expand Up @@ -213,6 +213,7 @@
background: #F3F6F7;
border-left: 1px solid #E8EEF0;
border-top: 1px solid #E8EEF0;
border-top-left-radius: 2px;
content: ' ';
height: 8px;
left: 31px;
Expand Down