initial commit

app/assets/less/components/callback-list.less

@@ -0,0 +1,79 @@
+
+.callback-list-item {
+
+    position: relative;
+    &:extend(.clearfix all);
+
+    padding: .6em 1em;
+
+    &:hover {
+        background: @lightest-gray;
+    }
+
+    // Borders.
+    // --------
+
+    border: solid @callback-list-border-color @callback-list-border-size;
+
+    // Remove top border for all except first child.
+    &:not(:first-child) {
+        border-top: 0;
+    }
+
+    // top border radius for first child.
+    &:first-child {
+        border-top-left-radius: @callback-list-border-radius;
+        border-top-right-radius: @callback-list-border-radius;
+    }
+
+    // bottom border radius for first child.
+    &:last-child {
+        border-bottom-left-radius: @callback-list-border-radius;
+        border-bottom-right-radius: @callback-list-border-radius;
+    }
+
+    // Sections.
+    // ---------
+
+    &-header {
+        margin-bottom: .4em;
+    }
+
+    &-info {
+        font-size: @font-size-small;
+        color: @callback-list-info-color;
+
+        > span {
+            display: inline-block;
+            margin-right: 1.6em;
+        }
+
+        .icon {
+            .icon-vcenter();
+            font-size: 20px;
+            padding: .2em;
+        }
+    }
+
+    &-name {
+        margin-right: 1em;
+        font-size: @callback-list-name-text-size;
+        color: @callback-list-name-color;
+
+        &:hover {
+            color: @callback-list-name-hover-color;
+            text-decoration: none;
+        }
+    }
+
+    &-arrow {
+        color: #bcbcbc;
+        position: absolute;
+        right: .8em;
+        top: 50%;
+        > .icon {
+            font-size: 35px;
+            transform: translateY(-50%);
+        }
+    }
+}