listing.css in servel-0.12.0

- old
+ new
@@ -1,55 +1,71 @@
-#listing {
-  padding: 20px;
-}
-
-#listing h1 {
-  margin-top: 0;
-}
-
-.table-wrapper {
-  overflow: auto;
-}
-
-table {
-  width: 100%;
-  min-width: 800px;
-  border-collapse: collapse;
-  border: 1px solid #ddd;
-  table-layout: fixed;
-}
-
-th, td {
-  padding: 5px;
-  border: 1px solid #ddd;
-}
-
-tbody > tr:nth-of-type(odd) {
-  background-color: #f9f9f9;
-}
-
-th.new-tab {
-  width: 6em;
-}
-
-th.type {
-  width: 4em;
-}
-
-th.size {
-  width: 6em;
-}
-
-th.modified {
-  width: 12em;
-}
-
-span.icon {
-  display: inline-block;
-  margin-right: 0.2em;
-  width: 1.4em;
-  text-align: center;
-}
-
-a.default.home, a.default.top, a.default.parent {
-  font-style: oblique;
-}
+#listing {
+  padding: 20px;
+}
+
+#listing h1 {
+  margin-top: 0;
+}
+
+.table-wrapper {
+  overflow: auto;
+}
+
+table {
+  width: 100%;
+  min-width: 800px;
+  border-collapse: collapse;
+  border: 1px solid #ddd;
+  table-layout: fixed;
+}
+
+th {
+  font-weight: normal;
+}
+
+th, td {
+  padding: 5px;
+  border: 1px solid #ddd;
+}
+
+tbody > tr:nth-of-type(odd) {
+  background-color: #f9f9f9;
+}
+
+th.new-tab {
+  width: 6em;
+}
+
+th.type {
+  width: 4em;
+}
+
+th.size {
+  width: 6em;
+}
+
+th.modified {
+  width: 12em;
+}
+
+th.sortable.sort-active {
+  font-weight: bold;
+}
+
+th.sortable.sort-active.sort-asc a::after {
+  content: " ⬇️";
+}
+
+th.sortable.sort-active.sort-desc a::after {
+  content: " ⬆️";
+}
+
+span.icon {
+  display: inline-block;
+  margin-right: 0.2em;
+  width: 1.4em;
+  text-align: center;
+}
+
+a.default.home, a.default.top, a.default.parent {
+  font-style: oblique;
+}