src_js/iconolab-bundle/src/iconolab.scss
changeset 405 6b8a1ae18e91
parent 396 0a4743126d74
child 406 733be8cac793
--- a/src_js/iconolab-bundle/src/iconolab.scss	Tue Feb 28 17:19:04 2017 +0100
+++ b/src_js/iconolab-bundle/src/iconolab.scss	Wed Mar 01 01:41:20 2017 +0100
@@ -103,6 +103,111 @@
 	border: 1px solid #bbb
 }
 
+.comment-form {
+
+    $color-request-for-contribution: #f5e41c;
+    $color-reference: #478ee0;
+    $color-agree: #b8e986;
+    $color-disagree: #ff7284;
+
+    .btn-group-wrapper {
+        text-align: center;
+    }
+
+    .form-group {
+        margin-bottom: 10px;
+    }
+
+    .btn-group-metacategory {
+
+        padding-bottom: 5px;
+        margin-bottom: 5px;
+        border-bottom: 2px solid #969696;
+
+        &.btn-group-request-for-contribution {
+            border-color: $color-request-for-contribution;
+        }
+        &.btn-group-reference {
+            border-color: $color-reference;
+        }
+        &.btn-group-agree {
+            border-color: $color-agree;
+        }
+        &.btn-group-disagree {
+            border-color: $color-disagree;
+        }
+
+        &.active {
+            padding-bottom: 0px;
+        }
+
+        .btn {
+            border: none;
+            padding: 4px 8px;
+            margin: 0 2px;
+            border-radius: 0;
+            border-radius: 4px !important;
+        }
+        .btn:first-child {
+            margin-left: 0;
+        }
+        .btn:last-child {
+            margin-right: 0;
+        }
+        .btn:focus,
+        .btn.focus,
+        .btn:active:focus,
+        .btn:active.focus,
+        .btn.active:focus,
+        .btn.active.focus {
+            outline: none;
+        }
+        .btn.active {
+            padding: 4px 8px 8px;
+            border-bottom-left-radius: 0 !important;
+            border-bottom-right-radius: 0 !important;
+        }
+        .btn-comment {
+            background-color: #969696;
+            color: #fff;
+            padding-left: 20px;
+            padding-right: 20px;
+            &:hover {
+                background-color: darken(#969696, 10%);
+            }
+            &.active {
+                padding-left: 20px;
+                padding-right: 20px;
+            }
+        }
+        .btn-request-for-contribution {
+            background-color: $color-request-for-contribution;
+            &:hover {
+                background-color: darken($color-request-for-contribution, 10%);
+            }
+        }
+        .btn-reference {
+            background-color: $color-reference;
+            color: #fff;
+            &:hover {
+                background-color: darken($color-reference, 10%);
+            }
+        }
+        .btn-agree {
+            background-color: $color-agree;
+            &:hover {
+                background-color: darken($color-agree, 10%);
+            }
+        }
+        .btn-disagree {
+            background-color: $color-disagree;
+            &:hover {
+                background-color: darken($color-disagree, 10%);
+            }
+        }
+    }
+}
+
 .comment-reply-link{
 	cursor: pointer;
 }