dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #35845
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 18360: tracker-capture: new UI for dealing with events
------------------------------------------------------------
revno: 18360
committer: Abyot Asalefew Gizaw <abyota@xxxxxxxxx>
branch nick: dhis2
timestamp: Fri 2015-02-20 13:08:37 +0100
message:
tracker-capture: new UI for dealing with events
added:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/new-event.html
modified:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/profile/profile-controller.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css
--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk
Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js 2015-02-19 15:42:18 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js 2015-02-20 12:08:37 +0000
@@ -1,5 +1,6 @@
trackerCapture.controller('DataEntryController',
function($scope,
+ $modal,
DateUtils,
EventUtils,
orderByFilter,
@@ -8,7 +9,6 @@
DHIS2EventFactory,
OptionSetService,
ModalService,
- DialogService,
CurrentSelection,
CustomFormService) {
@@ -43,8 +43,6 @@
$scope.$on('dashboardWidgets', function() {
$scope.showDataEntryDiv = false;
$scope.showEventCreationDiv = false;
- $scope.showDummyEventDiv = false;
- $scope.currentDummyEvent = null;
$scope.currentEvent = null;
$scope.currentStage = null;
$scope.totalEvents = 0;
@@ -121,12 +119,12 @@
}
$scope.dhis2Events = orderByFilter($scope.dhis2Events, '-sortingDate');
- $scope.dummyEvents = $scope.checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
+ $scope.dummyEventsByStage = checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
sortEventsByStage();
});
};
- $scope.checkForEventCreation = function(availableEvents, program){
+ var checkForEventCreation = function(availableEvents, program){
var dummyEvents = [];
if($scope.selectedEnrollment.status === 'ACTIVE'){
@@ -182,93 +180,67 @@
}
});
}
- }
- return dummyEvents;
- };
-
- $scope.showEventCreation = function(){
- $scope.showEventCreationDiv = !$scope.showEventCreationDiv;
- };
+ }
+
+ var dummyEventsByStage = [];
+ angular.forEach(dummyEvents, function(ev){
+ dummyEventsByStage[ev.programStage] = ev;
+ });
+
+ return dummyEventsByStage;
+ };
$scope.enableRescheduling = function(){
$scope.schedulingEnabled = !$scope.schedulingEnabled;
};
- $scope.showDummyEventCreation = function(dummyEvent){
-
- if(dummyEvent){
-
- if(angular.equals($scope.currentDummyEvent,dummyEvent)){
- //clicked on the same stage, do toggling
- $scope.currentDummyEvent = null;
- $scope.showDummyEventDiv = !$scope.showDummyEventDiv;
+ $scope.showCreateEvent = function(dummyEvent, stage){
+ var modalInstance = $modal.open({
+ templateUrl: 'components/dataentry/new-event.html',
+ controller: 'EventCreationController',
+ resolve: {
+ dummyEvent: function(){
+ return dummyEvent;
+ },
+ programId: function () {
+ return $scope.selectedProgram.id;
+ },
+ trackedEntityInstanceId: function(){
+ return $scope.selectedEntity.trackedEntityInstance;
+ }
}
- else{
- $scope.currentDummyEvent = dummyEvent;
- $scope.showDummyEventDiv = !$scope.showDummyEventDiv;
- }
- }
- };
-
- $scope.createEvent = function(){
- //check for form validity
- $scope.eventCreationForm.submitted = true;
- if( $scope.eventCreationForm.$invalid ){
- return false;
- }
-
- //form is valid, proceed to event creation
- var newEvent =
- {
- trackedEntityInstance: $scope.selectedEntity.trackedEntityInstance,
- program: $scope.selectedProgram.id,
- programStage: $scope.currentDummyEvent.programStage,
- orgUnit: $scope.currentDummyEvent.orgUnit,
- eventDate: DateUtils.formatFromUserToApi( $scope.currentDummyEvent.eventDate),
- dueDate: DateUtils.formatFromUserToApi( $scope.currentDummyEvent.dueDate),
- status: 'SCHEDULE',
- notes: [],
- dataValues: []
- };
-
- DHIS2EventFactory.create(newEvent).then(function(data) {
- if (data.importSummaries[0].status === 'ERROR') {
- var dialogOptions = {
- headerText: 'event_creation_error',
- bodyText: data.importSummaries[0].description
- };
+ });
- DialogService.showDialog({}, dialogOptions);
- }
- else {
- newEvent.event = data.importSummaries[0].reference;
- newEvent.orgUnitName = $scope.currentDummyEvent.orgUnitName;
- newEvent.name = $scope.currentDummyEvent.name;
- newEvent.reportDateDescription = $scope.currentDummyEvent.reportDateDescription;
- newEvent.sortingDate = $scope.currentDummyEvent.dueDate,
- newEvent.statusColor = $scope.currentDummyEvent.statusColor;
- newEvent.eventDate = $scope.currentDummyEvent.eventDate;
- newEvent.dueDate = $scope.currentDummyEvent.dueDate;
- newEvent.enrollmentStatus = $scope.currentDummyEvent.enrollmentStatus;
+ modalInstance.result.then(function (ev) {
+ if(angular.isObject(ev)){
+ var newEvent = ev;
+ newEvent.orgUnitName = dummyEvent.orgUnitName;
+ newEvent.name = dummyEvent.name;
+ newEvent.reportDateDescription = dummyEvent.reportDateDescription;
+ newEvent.sortingDate = ev.eventDate ? ev.eventDate : ev.dueDate,
+ newEvent.statusColor = EventUtils.getEventStatusColor(ev);
+ newEvent.eventDate = DateUtils.formatFromApiToUser(ev.eventDate);
+ newEvent.dueDate = DateUtils.formatFromApiToUser(ev.dueDate);
+ newEvent.enrollmentStatus = dummyEvent.enrollmentStatus;
- if($scope.currentDummyEvent.coordinate){
+ if(dummyEvent.coordinate){
newEvent.coordinate = {};
}
- $scope.dummyEvents = $scope.checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
-
if(!angular.isObject($scope.dhis2Events)){
$scope.dhis2Events = [newEvent];
}
else{
$scope.dhis2Events.splice(0,0,newEvent);
}
-
+
+ $scope.dummyEventsByStage = checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
$scope.eventsByStage[newEvent.programStage].push(newEvent);
$scope.showDataEntry(newEvent, false);
- }
+ }
+ }, function () {
});
- };
+ };
$scope.showDataEntry = function(event, rightAfterEnrollment){
@@ -283,8 +255,7 @@
else{
$scope.currentElement = {};
$scope.currentEvent = event;
- $scope.showDataEntryDiv = true;
- $scope.showDummyEventDiv = false;
+ $scope.showDataEntryDiv = true;
$scope.showEventCreationDiv = false;
if($scope.currentEvent.notes){
@@ -594,11 +565,6 @@
return '';
}
return 'form-control';
- };
-
- $scope.closeEventCreation = function(){
- $scope.currentDummyEvent = null;
- $scope.showDummyEventDiv = !$scope.showDummyEventDiv;
};
$scope.completeIncompleteEvent = function(){
@@ -727,10 +693,9 @@
$scope.currentEvent = null;
if($scope.dhis2Events.length < 1){
- $scope.dhis2Events = '';
- $scope.currentDummyEvent = null;
- $scope.dummyEvents = $scope.checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
+ $scope.dhis2Events = '';
}
+ $scope.dummyEventsByStage = checkForEventCreation($scope.dhis2Events, $scope.selectedProgram);
});
});
};
@@ -739,19 +704,12 @@
$scope.showEventColors = !$scope.showEventColors;
};
- $scope.getEventStyle = function(ev, dummy){
+ $scope.getEventStyle = function(ev){
var style = EventUtils.getEventStatusColor(ev);
- if(dummy){
- if($scope.currentDummyEvent && $scope.currentDummyEvent.programStage === ev.programStage){
- style = style + ' ' + 'current-stage';
- }
- }
- else{
- if($scope.currentEvent && $scope.currentEvent.event === ev.event){
- style = style + ' ' + 'current-stage';
- }
- }
+ if($scope.currentEvent && $scope.currentEvent.event === ev.event){
+ style = style + ' ' + 'current-stage';
+ }
return style;
};
@@ -772,4 +730,87 @@
}
}
};
+})
+
+.controller('EventCreationController',
+ function($scope,
+ $modalInstance,
+ DateUtils,
+ DHIS2EventFactory,
+ DialogService,
+ dummyEvent,
+ programId,
+ trackedEntityInstanceId){
+ $scope.programStageId = dummyEvent.programStage;
+ $scope.programId = programId;
+ $scope.orgUnitId = dummyEvent.orgUnit;
+ $scope.trackedEntityInstanceId = trackedEntityInstanceId;
+
+ $scope.dhis2Event = {eventDate: '', dueDate: dummyEvent.dueDate, reportDateDescription: dummyEvent.reportDateDescription, name: dummyEvent.name, invalid: true};
+
+ $scope.dueDateInvalid = false;
+ $scope.eventDateInvalid = false;
+
+ //watch for changes in eventDate
+ $scope.$watchCollection('[dhis2Event.dueDate, dhis2Event.eventDate]', function() {
+ if(angular.isObject($scope.dhis2Event)){
+ if(!$scope.dhis2Event.dueDate){
+ $scope.dueDateInvalid = true;
+ return;
+ }
+
+ if($scope.dhis2Event.dueDate){
+ var rDueDate = $scope.dhis2Event.dueDate;
+ var cDueDate = DateUtils.format($scope.dhis2Event.dueDate);
+ $scope.dueDateInvalid = rDueDate !== cDueDate;
+ }
+
+ if($scope.dhis2Event.eventDate){
+ var rEventDate = $scope.dhis2Event.eventDate;
+ var cEventDate = DateUtils.format($scope.dhis2Event.eventDate);
+ $scope.eventDateInvalid = rEventDate !== cEventDate;
+ }
+ }
+ });
+
+ $scope.save = function () {
+ //check for form validity
+ if($scope.dueDateInvalid || $scope.eventDateInvalid){
+ return false;
+ }
+
+ var eventDate = DateUtils.formatFromUserToApi($scope.dhis2Event.eventDate);
+ var dueDate = DateUtils.formatFromUserToApi($scope.dhis2Event.dueDate);
+ var newEvents = {events: []};
+ var newEvent = {
+ trackedEntityInstance: $scope.trackedEntityInstanceId,
+ program: $scope.programId,
+ programStage: $scope.programStageId,
+ orgUnit: $scope.orgUnitId,
+ dueDate: dueDate,
+ eventDate: eventDate,
+ notes: [],
+ dataValues: [],
+ status: 'ACTIVE'
+ };
+ newEvents.events.push(newEvent);
+ DHIS2EventFactory.create(newEvents).then(function(data){
+ if (data.importSummaries[0].status === 'ERROR') {
+ var dialogOptions = {
+ headerText: 'event_creation_error',
+ bodyText: data.importSummaries[0].description
+ };
+
+ DialogService.showDialog({}, dialogOptions);
+ }
+ else {
+ newEvent.event = data.importSummaries[0].reference;
+ $modalInstance.close(newEvent);
+ }
+ });
+ };
+
+ $scope.cancel = function(){
+ $modalInstance.close();
+ };
});
\ No newline at end of file
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-02-19 15:42:18 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-02-20 12:08:37 +0000
@@ -1,9 +1,6 @@
<div class="panel panel-info" ng-controller="DataEntryController">
<div class="panel-heading handle bold">
- {{dataentryWidget.title| translate}}
- <span class="nav-pills" ng-if="allowEventCreation">
- | <a href ng-click="showEventCreation()"><span ng-class="{true: 'widget - link - active', false: 'widget - link'} [showEventCreationDiv]">{{'create_new_event'| translate}}</span></a>
- </span>
+ {{dataentryWidget.title| translate}}
<span class="pull-right widget-link">
<a href ng-click="toggleLegend()" title="{{'event_color_legend'| translate}}"><i class="fa fa-info-circle vertical-center"></i></a>
@@ -27,13 +24,24 @@
</table>
</div>
- <div ng-if="dhis2Events && !showEventCreationDiv">
-
- <table class="table table-bordered table-with-fixed-layout">
+ <div class="table-responsive" ng-if="selectedEnrollment">
+ <table class="table table-bordered">
<thead>
<tr>
- <th class="active align-center" ng-class="getColumnWidth(eventsByStage[stage.id].length)" ng-repeat="stage in programStages| orderBy:'sortOrder':reverse">
+ <th class="active" ng-class="getColumnWidth(eventsByStage[stage.id].length)" ng-repeat="stage in programStages| orderBy:'sortOrder':reverse">
{{stage.name}}
+
+ <!-- event add/filter icon begins -->
+ <span class='pull-right'>
+ <span ng-if="dummyEventsByStage[stage.id]">
+ <a href title="{{'create_new_event'| translate}}" ng-click="showCreateEvent(dummyEventsByStage[stage.id])"><i class="fa fa-plus"></i></a>
+ </span>
+ <span class="small-horizonal-spacing" ng-if="eventsByStage[stage.id].length > 1">
+ <a href title="{{'filter'| translate}}"><i class="fa fa-search"></i></a>
+ </span>
+ </span>
+ <!-- event add/filter icon ends -->
+
</th>
</tr>
</thead>
@@ -41,76 +49,24 @@
<tr>
<td ng-repeat="stage in programStages| orderBy:'sortOrder':reverse">
<div class="inline-block" ng-repeat="dhis2Event in eventsByStage[stage.id]">
- <div class="stage-container alert"
- ng-class="getEventStyle(dhis2Event, false)"
+ <div class="event-container"
+ ng-class="getEventStyle(dhis2Event)"
ng-click="showDataEntry(dhis2Event, false)">
{{dhis2Event.orgUnitName}}<br/>
- {{dhis2Event.sortingDate}}
+ {{dhis2Event.sortingDate}}<br>
+ <span ng-if="eventsByStage[stage.id].length > 1">[{{$index + 1}}]</span>
</div>
- <i class="fa fa-arrow-right" ng-if="$index < eventsByStage[stage.id].length - 1"></i>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
-
- <!--<table class="table-borderless table-with-fixed-layout">
- <tbody>
- <tr>
- <td class="inline-block" ng-repeat="dhis2Event in dhis2Events| orderBy:'sortingDate':reverse">
- <div class="stage-container alert" ng-class='getEventStyle(dhis2Event, false)' ng-click="showDataEntry(dhis2Event, false)">
- {{dhis2Event.name}}<br/>
- {{dhis2Event.orgUnitName}}<br/>
- {{dhis2Event.sortingDate}}
- </div>
- <i class="fa fa-arrow-right" ng-if="$index < dhis2Events.length - 1"></i>
- </td>
- </tr>
- </tbody>
- </table>-->
-
- </div>
- <div ng-if="!dhis2Events && selectedEnrollment" class="alert alert-danger">{{'no_event_is_yet_created'| translate}}</div>
- <div ng-if="dhis2Events && showEventCreationDiv" class="alert alert-warning">{{'event_creation'| translate}}</div>
- <div ng-if="!selectedEnrollment" class="alert alert-danger">{{'not_yet_enrolled_data_entry'| translate}}</div>
- <div ng-show="dummyEvents && showEventCreationDiv">
- <table class="table-borderless">
- <tbody>
- <tr>
- <td class="inline-block" ng-repeat="dummyEvent in dummyEvents| orderBy:'sortingDate':reverse">
- <span class="stage-container alert" ng-class='getEventStyle(dummyEvent, true)' ng-click="showDummyEventCreation(dummyEvent)">
- {{dummyEvent.name}}<br/>
- {{dummyEvent.dueDate}}
- </span>
- <i class="fa fa-arrow-right" ng-if="$index < dummyEvents.length - 1"></i>
- </td>
- </tr>
- </tbody>
- </table>
- <form name="eventCreationForm" novalidate ng-show="currentDummyEvent">
- <div class="row">
- <div class="col-md-6">
- {{currentDummyEvent.reportDateDescription}}
- <input type="text" placeholder="{{dhis2CalendarFormat.keyDateFormat}}" name="eventDate" class="form-control" d2-date ng-model="currentDummyEvent.eventDate" ng-required="false"/>
- <span ng-if="eventCreationForm.submitted && eventCreationForm.eventDate.$invalid" class="error">{{'required'| translate}}</span>
- </div>
- <div class="col-md-6">
- {{'due_date'| translate}}
- <input type="text" placeholder="{{dhis2CalendarFormat.keyDateFormat}}" name="dueDate" class="form-control" d2-date ng-model="currentDummyEvent.dueDate" ng-required="true"/>
- <span ng-if="eventCreationForm.submitted && eventCreationForm.dueDate.$invalid" class="error">{{'required'| translate}}</span>
- </div>
- </div>
- <div class="row vertical-spacing">
- <div class="col-md-6">
- <button type="button" class="btn btn-primary" ng-click="createEvent()">{{'create'| translate}}</button>
- <button type="button" class="btn btn-default small-horizonal-spacing" ng-click="closeEventCreation()">{{'cancel'| translate}}</button>
- </div>
- </div>
- </form>
- </div>
+ <!--<i class="fa fa-arrow-right" ng-if="$index < eventsByStage[stage.id].length - 1"></i>-->
+ </div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div ng-if="!selectedEnrollment" class="alert alert-danger">{{'not_yet_enrolled_data_entry'| translate}}</div>
<form name="outerForm" novalidate>
- <div ng-if="currentEvent && !showEventCreationDiv">
+ <div ng-if="currentEvent">
<!-- event dates begin -->
<div class="row">
<div class="col-md-6">
@@ -209,7 +165,7 @@
</div>
</form>
- <div ng-show="currentEvent && !showEventCreationDiv" class='remove-default-padding overflow-ellipsis'>
+ <div ng-show="currentEvent" class='remove-default-padding overflow-ellipsis'>
<div class='row'><hr></div>
<textarea class="form-control" rows="3" ng-model="note" placeholder="{{'add_new_note_here'| translate}}"></textarea>
<div class="vertical-spacing">
=== added file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/new-event.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/new-event.html 1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/new-event.html 2015-02-20 12:08:37 +0000
@@ -0,0 +1,37 @@
+<div class="modal-header page">
+ <h3>{{'new_event'| translate}} - {{dhis2Event.name}}</h3>
+</div>
+<div class="modal-body page">
+ <form name="eventCreationForm" class="form-horizontal" role="form" novalidate>
+ <div class="form-group">
+ <label class="col-sm-2 control-label">{{'due_date'| translate}}</label>
+ <div class="col-sm-10">
+ <input type="text"
+ class="form-control"
+ name="dueDate"
+ placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
+ ng-rquired="true"
+ d2-date
+ ng-model="dhis2Event.dueDate">
+ <span ng-if="dueDateInvalid" class="error">{{'required'| translate}}</span>
+ </div>
+ </div>
+ <div class="form-group">
+ <label class="col-sm-2 control-label">{{dhis2Event.reportDateDescription}}</label>
+ <div class="col-sm-10">
+ <input type="text"
+ class="form-control"
+ name="eventDate"
+ placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
+ ng-rquired="false"
+ d2-date
+ ng-model="dhis2Event.eventDate">
+ <span ng-if="eventDateInvalid" class="error">{{'required'| translate}}</span>
+ </div>
+ </div>
+ </form>
+</div>
+<div class="modal-footer page">
+ <button class="btn btn-primary" data-ng-click="save()">{{'save'| translate}}</button>
+ <button class="btn btn-default" data-ng-click="cancel()">{{'cancel'| translate}}</button>
+</div>
\ No newline at end of file
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/profile/profile-controller.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/profile/profile-controller.js 2015-02-11 11:52:21 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/profile/profile-controller.js 2015-02-20 12:08:37 +0000
@@ -60,8 +60,7 @@
});
//listen for enrollment editing
- $scope.$on('enrollmentEditing', function(event, args) {
- console.log('the editing: ', args.enrollmentEditing);
+ $scope.$on('enrollmentEditing', function(event, args){
$scope.enrollmentEditing = args.enrollmentEditing;
});
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js 2015-02-19 15:42:18 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js 2015-02-20 12:08:37 +0000
@@ -74,7 +74,6 @@
var promise = $http.get( '../api/userSettings/dhis2-tracker-dashboard' ).then(function(response){
return response.data === "" ? defaultLayout: response.data;
}, function(){
- console.log('has failed....');
return defaultLayout;
});
return promise;
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css 2015-02-19 15:42:18 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css 2015-02-20 12:08:37 +0000
@@ -107,6 +107,9 @@
padding-top: 5px;
text-align: center;
border: 2px dotted;
+ margin: 2px;
+ padding: 5px;
+ border-radius: 4px;
}
.stage-container:hover {
@@ -117,10 +120,11 @@
.event-container {
cursor: pointer;
opacity: 1.0;
- //white-space: normal;
+ text-align: center;
+ margin: 2px;
padding: 5px;
border: 2px dotted;
- border-radius: 4px
+ border-radius: 4px;
}
.event-container:hover {
