lucas.mathieu/cachet-docker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move component/incident color lookups into actual CSS.

Browse Source
This commit is contained in:
James Brooks
2014-11-25 09:16:00 +00:00
parent 7dd54010a2
commit 8736db957c
10 changed files with 62 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -8,3 +8,4 @@ composer.phar
Thumbs.db
rev-manifest.json
config.codekit
npm-debug.log

13
app/models/Component.php
View File

@@ -22,19 +22,6 @@
}
}
/**
* Color of the label for each status.
* @return string HTML class name
*/
public function getColorAttribute() {
switch ($this->status) {
case 1: return 'text-success';
case 2: return 'text-info';
case 3: return 'text-alert';
case 4: return 'text-danger';
}
}
/**
* Get the transformer instance.
*

13
app/models/Incident.php
View File

@@ -22,19 +22,6 @@
}
}
/**
* Looks up the class name for the status.
* @return string
*/
public function getColorAttribute() {
switch ($this->status) {
case 1: return 'warning';
case 2: return 'alert';
case 3: return 'info';
case 4: return 'success';
}
}
/**
* Finds the icon to use for each status.
* @return string

2
app/views/imports/components.blade.php
View File

@@ -3,7 +3,7 @@
<ul class='list-group components'>
@foreach($components as $component)
<li class='list-group-item component '>
<h4>{{ $component->name }} <small class='{{ $component->color }}'>{{ $component->humanStatus }}</small></h4>
<h4>{{ $component->name }} <small class='text-component-{{ $component->status }}'>{{ $component->humanStatus }}</small></h4>
<p>{{ $component->description }}</p>
</li>
@endforeach

2
app/views/imports/incident.blade.php
View File

@@ -13,7 +13,7 @@
@foreach($incidents as $incidentID => $incident)
<li class='list-group-item'>
<span class='badge badge-{{ $incident->color }}'><i class='glyphicon {{ $incident->icon }}'></i></span>
<span class='badge badge-incident-{{ $incident->status }}'><i class='glyphicon {{ $incident->icon }}'></i></span>
<h4>{{ $incident->name }} <small><time>{{ $incident->created_at->format('H:i:s A') }}</time></small></h4>
{{ $incident->message }}
@if($incidentID < ($incident->count() - 1))

31
public/assets/sass/application.scss
View File

@@ -13,18 +13,22 @@ h1 {
margin-bottom: 20px;
}
.text-success {
.text-success, .text-component-1 {
color: #4cae4c;
}
.text-danger {
color: #D91E18;
.text-info, .text-component-2 {
color: #46b8da;
}
.text-alert {
.text-alert, .text-component-3 {
color: #F9BF3B;
}
.text-danger, .text-component-4 {
color: #D91E18;
}
.container {
max-width: 960px;
}
@@ -61,20 +65,17 @@ h1 {
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px;
&.badge-success {
background-color: #4cae4c;
}
&.badge-info {
background-color: #46b8da;
}
&.badge-warning {
&.badge-incident-1 {
background-color: #F27935;
}
&.badge-alert {
&.badge-incident-2 {
background-color: #F9BF3B;
}
&.badge-danger {
background-color: #CF000F;
&.badge-incident-3 {
background-color: #46b8da;
}
&.badge-incident-4 {
background-color: #4cae4c;
}
}
@@ -118,7 +119,7 @@ h1 {
time {
color: #6C7A89;
// letter-spacing: 0.02em;
font-weight: 600;
font-weight: 300;
font-size: 1.1em;
}

27
public/build/css/application-52640275.css → public/build/css/application-4c5cd8a5.css
View File

@@ -10,15 +10,18 @@ hr {
h1 {
margin-bottom: 20px; }
.text-success {
.text-success, .text-component-1 {
color: #4cae4c; }
.text-danger {
color: #D91E18; }
.text-info, .text-component-2 {
color: #46b8da; }
.text-alert {
.text-alert, .text-component-3 {
color: #F9BF3B; }
.text-danger, .text-component-4 {
color: #D91E18; }
.container {
max-width: 960px; }
@@ -47,16 +50,14 @@ h1 {
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px; }
.badge.badge-success {
background-color: #4cae4c; }
.badge.badge-info {
background-color: #46b8da; }
.badge.badge-warning {
.badge.badge-incident-1 {
background-color: #F27935; }
.badge.badge-alert {
.badge.badge-incident-2 {
background-color: #F9BF3B; }
.badge.badge-danger {
background-color: #CF000F; }
.badge.badge-incident-3 {
background-color: #46b8da; }
.badge.badge-incident-4 {
background-color: #4cae4c; }
.list-group {
margin-bottom: 20px;
@@ -85,7 +86,7 @@ h1 {
line-height: 1.3em; }
.list-group .list-group-item time {
color: #6C7A89;
font-weight: 600;
font-weight: 300;
font-size: 1.1em; }
.list-group .list-group-item.active {
background-color: #F2F1EF; }

27
public/build/css/application.css
View File

@@ -10,15 +10,18 @@ hr {
h1 {
margin-bottom: 20px; }
.text-success {
.text-success, .text-component-1 {
color: #4cae4c; }
.text-danger {
color: #D91E18; }
.text-info, .text-component-2 {
color: #46b8da; }
.text-alert {
.text-alert, .text-component-3 {
color: #F9BF3B; }
.text-danger, .text-component-4 {
color: #D91E18; }
.container {
max-width: 960px; }
@@ -47,16 +50,14 @@ h1 {
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px; }
.badge.badge-success {
background-color: #4cae4c; }
.badge.badge-info {
background-color: #46b8da; }
.badge.badge-warning {
.badge.badge-incident-1 {
background-color: #F27935; }
.badge.badge-alert {
.badge.badge-incident-2 {
background-color: #F9BF3B; }
.badge.badge-danger {
background-color: #CF000F; }
.badge.badge-incident-3 {
background-color: #46b8da; }
.badge.badge-incident-4 {
background-color: #4cae4c; }
.list-group {
margin-bottom: 20px;
@@ -85,7 +86,7 @@ h1 {
line-height: 1.3em; }
.list-group .list-group-item time {
color: #6C7A89;
font-weight: 600;
font-weight: 300;
font-size: 1.1em; }
.list-group .list-group-item.active {
background-color: #F2F1EF; }

2
public/build/rev-manifest.json
View File

@@ -1,3 +1,3 @@
{
"css/application.css": "css/application-52640275.css"
"css/application.css": "css/application-4c5cd8a5.css"
}

27
public/css/application.css
View File

@@ -10,15 +10,18 @@ hr {
h1 {
margin-bottom: 20px; }
.text-success {
.text-success, .text-component-1 {
color: #4cae4c; }
.text-danger {
color: #D91E18; }
.text-info, .text-component-2 {
color: #46b8da; }
.text-alert {
.text-alert, .text-component-3 {
color: #F9BF3B; }
.text-danger, .text-component-4 {
color: #D91E18; }
.container {
max-width: 960px; }
@@ -47,16 +50,14 @@ h1 {
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px; }
.badge.badge-success {
background-color: #4cae4c; }
.badge.badge-info {
background-color: #46b8da; }
.badge.badge-warning {
.badge.badge-incident-1 {
background-color: #F27935; }
.badge.badge-alert {
.badge.badge-incident-2 {
background-color: #F9BF3B; }
.badge.badge-danger {
background-color: #CF000F; }
.badge.badge-incident-3 {
background-color: #46b8da; }
.badge.badge-incident-4 {
background-color: #4cae4c; }
.list-group {
margin-bottom: 20px;
@@ -85,7 +86,7 @@ h1 {
line-height: 1.3em; }
.list-group .list-group-item time {
color: #6C7A89;
font-weight: 600;
font-weight: 300;
font-size: 1.1em; }
.list-group .list-group-item.active {
background-color: #F2F1EF; }