use sass for the CSS files

1 files changed, 146 insertions, 0 deletions

diff --git a/asset-sources/theme.scss b/asset-sources/theme.scss
new file mode 100644
index 0000000..40aa55d
--- /dev/null
+++ b/asset-sources/theme.scss
@@ -0,0 +1,146 @@
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #101010;
+  background: #efefef;
+}
+
+strong {
+  font-weight: 700;
+}
+
+.badge-container {
+  width: 50px;
+  height: 50px;
+  border: 1px solid #dee2e6;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.carousel-item img {
+  max-height: 700px;
+  margin: auto;
+}
+
+.track-image-caption {
+  text-align: center;
+}
+
+#trackImageList {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.track-image-preview {
+  .delete-image {
+    position: absolute;
+    z-index: 5;
+    background-color: white;
+    right: 0px;
+  }
+
+  .edit-image-description {
+    position: absolute;
+    z-index: 5;
+    right: 0px;
+    top: 2em;
+    width: 1em;
+    height: 1em;
+    border-radius: 0.375em;
+    border: 0;
+    box-sizing: content-box;
+    color: #000;
+    opacity: 0.5;
+    padding: 0.25em 0.25em;
+  }
+
+  .edit-image-description i {
+    position: relative;
+    top: -0.25em;
+  }
+
+  img {
+    max-width: 100%;
+    max-height: 100%;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+
+  position: relative;
+  width: min(317px, 100%);
+  height: calc(9 / 16 * 317px);
+  border: 1px solid grey;
+  margin-right: 5px;
+  margin-bottom: 5px;
+}
+
+.track-description img {
+    max-width: 100%;
+}
+
+.summary-toggler {
+  cursor: pointer;
+}
+
+.admin-badge-list * {
+  margin-left: 5px;
+  margin-right: 5px;
+}
+
+.badge-container img {
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.tooltip-inner {
+  max-width: 400px;
+}
+
+.friendlist-control {
+  padding: 0px;
+  display: flex;
+  align-items: center;
+
+  button {
+    border-top-right-radius: 0px;
+    border-bottom-right-radius: 0px;
+  }
+
+  span {
+    padding-left: 1em;
+  }
+}
+
+/* Ensure a consistent width of the cells in the browse view. */
+.browse-summary th, .browse-summary td {
+  width: 25%;
+}
+
+.list-group.list-group-root {
+  padding: 0;
+  overflow: hidden;
+}
+
+.list-group.list-group-root .list-group {
+  margin-bottom: 0;
+}
+
+.list-group.list-group-root .list-group-item {
+  border-radius: 0;
+  border-width: 1px 0 0 0;
+}
+
+.list-group.list-group-root > .list-group-item:first-child {
+  border-top-width: 0;
+}
+
+.list-group.list-group-root > .list-group > .list-group-item {
+  padding-left: 30px;
+}
+
+.list-group.list-group-root > .list-group > .list-group > .list-group-item {
+  padding-left: 45px;
+}