aboutsummaryrefslogtreecommitdiff
path: root/app/assets/sass
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/sass')
-rw-r--r--app/assets/sass/_buttons.scss141
-rw-r--r--app/assets/sass/_menu.scss20
-rw-r--r--app/assets/sass/_plan-node.scss2
-rw-r--r--app/assets/sass/_plan.scss2
4 files changed, 94 insertions, 71 deletions
diff --git a/app/assets/sass/_buttons.scss b/app/assets/sass/_buttons.scss
index 747b1f7..2d0bb6d 100644
--- a/app/assets/sass/_buttons.scss
+++ b/app/assets/sass/_buttons.scss
@@ -1,68 +1,97 @@
.btn {
- border-radius: $border-radius-base;
- padding: $padding-base $padding-lg;
- font-size: $font-size-base;
- line-height: 1.2;
- text-decoration: none;
- text-transform: uppercase;
- cursor: pointer;
- margin-left: $padding-base;
+ border-radius: $border-radius-base;
+ padding: $padding-base $padding-lg;
+ font-size: $font-size-base;
+ line-height: 1.2;
+ text-decoration: none;
+ text-transform: uppercase;
+ cursor: pointer;
+ margin-left: $padding-base;
- &-default {
- border: 1px solid $blue;
- color: $blue;
- background-color: #fff;
+ &-default {
+ border: 1px solid $blue;
+ color: $blue;
+ background-color: #fff;
- &:hover {
- background-color: $light-blue;
- color: #fff;
- }
- }
+ &:hover {
+ background-color: $light-blue;
+ color: #fff;
+ }
+ }
- &-lg {
- padding: $padding-base $padding-lg*2;
- font-size: round($font-size-base * 1.2);
- }
+ &-lg {
+ padding: $padding-base $padding-lg*2;
+ font-size: round($font-size-base * 1.2);
+ }
- &-sm {
- padding: $padding-base $padding-base;
- font-size: round($font-size-base * 0.9);
- }
+ &-sm {
+ padding: $padding-base $padding-base;
+ font-size: round($font-size-base * 0.9);
+ }
- &-slim {
- .fa { margin: 0};
-}
+ &-slim {
+ .fa { margin: 0};
+ }
+
+ &-link {
+ border: 0;
+ background-color: transparent;
+ color: $link-color;
+ padding: 0;
+ }
+
+ &-danger {
+ border: 1px solid $red;
+ color: $red;
+ text-transform: uppercase;
+ background-color: #fff;
+
+ &:hover {
+ background-color: $light-red;
+ }
+ }
- &-danger {
- border: 1px solid $red;
- color: $red;
- text-transform: uppercase;
- background-color: #fff;
+ &-primary {
+ border: 0;
+ background: $blue;
+ box-shadow: 1px 1px 1px $gray;
+ color: #ffffff;
- &:hover {
- background-color: $light-red;
- }
- }
+ &:hover {
+ background: $dark-blue;
+ }
+ }
- &-primary {
- border: 0;
- background: $blue;
- // background-image: linear-gradient(to bottom, $blue, $dark-blue);
- box-shadow: 1px 1px 1px $gray;
- color: #ffffff;
+ &-close {
+ @extend .btn-slim;
+ border-radius: 50%;
+ box-shadow: 0;
+ line-height: 1.5;
+ border: 1px solid $line-color;
+ background-color: #fff;
+ }
+ }
- &:hover {
- background: $dark-blue;
- // background-image: linear-gradient(to bottom, $dark-blue, $blue);
- }
- }
+.button-group {
+ button {
+ margin: 0;
+ background-color: $gray-lightest;
+ border-radius: 0;
+ float: left;
+ border: 1px solid $line-color;
+ cursor: pointer;
- &-close {
- @extend .btn-slim;
- border-radius: 50%;
- box-shadow: 0;
- line-height: 1.5;
- border: 1px solid $line-color;
- background-color: #fff;
- }
+ &:first-of-type {
+ border-top-left-radius: $border-radius-lg;
+ border-bottom-left-radius: $border-radius-lg;
+ }
+ &:last-of-type {
+ border-top-right-radius: $border-radius-lg;
+ border-bottom-right-radius: $border-radius-lg;
+ }
+ }
+
+ .selected {
+ background-color: $gray-light;
+ }
}
diff --git a/app/assets/sass/_menu.scss b/app/assets/sass/_menu.scss
index 66394ed..baf03b9 100644
--- a/app/assets/sass/_menu.scss
+++ b/app/assets/sass/_menu.scss
@@ -3,7 +3,7 @@ $menu-toggle-height: 45px;
.menu {
width: 190px;
- height: 230px;
+ height: 240px;
position: absolute;
font-size: $font-size-sm;
top: $menu-offset - 5;
@@ -18,7 +18,7 @@ $menu-toggle-height: 45px;
header {
h3 {
padding-top: $padding-lg;
- margin-bottom: $padding-lg * 2;
+ margin-bottom: $padding-base;
font-size: round($font-size-base * 1.2);
font-weight: 600;
line-height: 2;
@@ -36,16 +36,16 @@ $menu-toggle-height: 45px;
}
&-toggle {
- font-size: round($font-size-lg * 1.5);
+ font-size: round($font-size-lg * 1.3);
float: left;
- padding-left: $padding-lg;
+ padding-left: $padding-base;
line-height: 2;
cursor: pointer;
}
&-hidden {
- width: 50px;
- height: 50px;
+ width: $menu-toggle-height;
+ height: $menu-toggle-height;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
@@ -54,11 +54,3 @@ $menu-toggle-height: 45px;
}
}
}
-
-.menu button {
- border: 1px solid #fff;
- background-color: #544D4D;
- color: #fff;
- padding: 2px;
- border-radius: 3px;
-}
diff --git a/app/assets/sass/_plan-node.scss b/app/assets/sass/_plan-node.scss
index 1bd99cb..988264e 100644
--- a/app/assets/sass/_plan-node.scss
+++ b/app/assets/sass/_plan-node.scss
@@ -13,7 +13,7 @@
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
- width: 220px;
+ width: 240px;
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.1);
header {
diff --git a/app/assets/sass/_plan.scss b/app/assets/sass/_plan.scss
index f93ee70..ccf4064 100644
--- a/app/assets/sass/_plan.scss
+++ b/app/assets/sass/_plan.scss
@@ -6,6 +6,8 @@ $connector-line: 2px solid darken($line-color, 10%);
overflow: auto;
height: 100%;
min-height: 550px;
+ margin-left: 50px;
+ margin-right: 50px;
width: 100%;
ul {