1diff --git a/scss/main.scss b/scss/main.scss
  2index b25af7b4fa7bfb2f6a5d4affddc5f0624ef00ec2..7a1fff2fc1aea6edaded5d02c7ce4340fa8bc9f9 100644
  3--- a/scss/main.scss
  4+++ b/scss/main.scss
  5@@ -35,57 +35,43 @@ @import "bootstrap/scss/_alert.scss";
  6 
  7 // overwrite to reduce the ammount of css generated by loading all utilities
  8 $utilities: (
  9-  "order": (
 10-    responsive: true,
 11-    property: order,
 12-    values: (
 13-      first: -1,
 14-      0: 0,
 15-      1: 1,
 16-      2: 2,
 17-      3: 3,
 18-      4: 4,
 19-      5: 5,
 20-      last: 6,
 21+    "order": (responsive: true,
 22+        property: order,
 23+        values: (first: -1,
 24+            0: 0,
 25+            1: 1,
 26+            2: 2,
 27+            3: 3,
 28+            4: 4,
 29+            5: 5,
 30+            last: 6,
 31+        ),
 32     ),
 33-  ),
 34-  "float": (
 35-    responsive: true,
 36-    property: float,
 37-    values: (
 38-      start: left,
 39-      end: right,
 40-      none: none,
 41-    )
 42-  ),
 43-  "text-align": (
 44-    responsive: true,
 45-    property: text-align,
 46-    class: text,
 47-    values: (
 48-      start: left,
 49-      end: right,
 50-      center: center,
 51-    )
 52-  ),
 53-  "margin": (
 54-    responsive: true,
 55-    property: margin,
 56-    class: m,
 57-    values: map-merge($spacers, (auto: auto))
 58-  ),
 59-  "margin-end": (
 60-    responsive: true,
 61-    property: margin-right,
 62-    class: me,
 63-    values: map-merge($spacers, (auto: auto))
 64-  ),
 65-  "margin-start": (
 66-    responsive: true,
 67-    property: margin-left,
 68-    class: ms,
 69-    values: map-merge($spacers, (auto: auto))
 70-  ),
 71+    "float": (responsive: true,
 72+        property: float,
 73+        values: (start: left,
 74+            end: right,
 75+            none: none,
 76+        )),
 77+    "text-align": (responsive: true,
 78+        property: text-align,
 79+        class: text,
 80+        values: (start: left,
 81+            end: right,
 82+            center: center,
 83+        )),
 84+    "margin": (responsive: true,
 85+        property: margin,
 86+        class: m,
 87+        values: map-merge($spacers, (auto: auto))),
 88+    "margin-end": (responsive: true,
 89+        property: margin-right,
 90+        class: me,
 91+        values: map-merge($spacers, (auto: auto))),
 92+    "margin-start": (responsive: true,
 93+        property: margin-left,
 94+        class: ms,
 95+        values: map-merge($spacers, (auto: auto))),
 96 );
 97 
 98 @import "bootstrap/scss/utilities/_api.scss";
 99@@ -100,14 +86,14 @@ }
100 
101 // prevert wierd input overflowing 100%
102 input {
103-     width: 100%; 
104-     box-sizing: border-box;
105-     -webkit-box-sizing:border-box;
106-     -moz-box-sizing: border-box;
107+    width: 100%;
108+    box-sizing: border-box;
109+    -webkit-box-sizing: border-box;
110+    -moz-box-sizing: border-box;
111 }
112 
113 .navbar-nav {
114-  margin-top: 0px
115+    margin-top: 0px
116 }
117 
118 .event-list {
119@@ -126,29 +112,50 @@     margin: 0.5rem 0;
120     background: #f8f9fa;
121 }
122 
123+.event-commit {
124+    background: #dadada;
125+    padding: 5px;
126+
127+    a {
128+        white-space: nowrap;
129+        text-overflow: ellipsis;
130+        overflow: hidden;
131+    }
132+}
133+
134+.event-commit a:nth-child(3) {
135+    text-align: end;
136+
137+    @include media-breakpoint-down(xl) {
138+        text-align: start;
139+    }
140+}
141+
142+
143 .selected {
144-  text-decoration: underline;
145+    text-decoration: underline;
146 }
147 
148-.event > h4 {
149-  margin: 0;
150+.event>h4 {
151+    margin: 0;
152 }
153-.event > p {
154-  margin: 0.5rem 0;
155+
156+.event>p {
157+    margin: 0.5rem 0;
158 }
159 
160 .code-view {
161     display: grid;
162     overflow-x: auto;
163 
164-    > pre {
165-      margin: 0;
166+    >pre {
167+        margin: 0;
168     }
169 }
170 
171-.pathing{
172-  margin-left: $spacer;
173-  display: inline-block
174+.pathing {
175+    margin-left: $spacer;
176+    display: inline-block
177 }
178 
179 pre {
180@@ -157,21 +164,22 @@     overflow-x: auto;
181 }
182 
183 #name {
184-  text-overflow: ellipsis;
185-  overflow: hidden;
186-  white-space: nowrap;
187-  padding-left: $spacer;
188-  max-width: calc(100% - calc(2 * #{$spacer}));
189+    text-overflow: ellipsis;
190+    overflow: hidden;
191+    white-space: nowrap;
192+    padding-left: $spacer;
193+    max-width: calc(100% - calc(2 * #{$spacer}));
194 }
195 
196 #about {
197-  padding: 0 $spacer $spacer $spacer;
198-  > p:first-child {
199-    margin-top: 0
200-  }
201+    padding: 0 $spacer $spacer $spacer;
202 
203-  @include media-breakpoint-down(md) { 
204-    padding: $spacer;
205-    max-width: calc(100% - calc(2 * #{$spacer}));
206-  }
207+    >p:first-child {
208+        margin-top: 0
209+    }
210+
211+    @include media-breakpoint-down(md) {
212+        padding: $spacer;
213+        max-width: calc(100% - calc(2 * #{$spacer}));
214+    }
215 }