Commit 9eb87e1e by marco

final css tweaks prior to jquery bug resolution

parent 5f31de2d
...@@ -76,9 +76,10 @@ ...@@ -76,9 +76,10 @@
&.new-component-item { &.new-component-item {
margin: 20px 0px; margin: 20px 0px;
border-top: 1px solid $mediumGrey; border-top: 1px solid $mediumGrey;
box-shadow: 1px 3px 2px rgba(182, 182, 182, 0.75) inset; box-shadow: 0 2px 1px rgba(182, 182, 182, 0.75) inset;
background-color: $lightGrey; background-color: $lightGrey;
margin-bottom: 0px; margin-bottom: 0px;
padding-bottom: 20px;
.new-component-button { .new-component-button {
display: block; display: block;
...@@ -88,7 +89,7 @@ ...@@ -88,7 +89,7 @@
} }
h5 { h5 {
margin: 12px 0px; margin: 20px 0px;
color: #fff; color: #fff;
font-weight: 600; font-weight: 600;
font-size: 18px; font-size: 18px;
...@@ -113,7 +114,7 @@ ...@@ -113,7 +114,7 @@
height: 100px; height: 100px;
color: #fff; color: #fff;
margin-right: 15px; margin-right: 15px;
margin-bottom: 15px; margin-bottom: 20px;
border-radius: 8px; border-radius: 8px;
font-size: 15px; font-size: 15px;
line-height: 14px; line-height: 14px;
...@@ -134,9 +135,10 @@ ...@@ -134,9 +135,10 @@
.new-component-templates { .new-component-templates {
display: none; display: none;
margin: 20px 40px 0px 40px; margin: 20px 40px 20px 40px;
border-radius: 3px; border-radius: 3px;
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
background-color: #fff;
@include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset); @include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset);
@include clearfix; @include clearfix;
...@@ -159,7 +161,6 @@ ...@@ -159,7 +161,6 @@
// specific menu types // specific menu types
&.new-component-problem { &.new-component-problem {
padding-bottom:10px; padding-bottom:10px;
background-color: #fff;
.ss-icon, .editor-indicator { .ss-icon, .editor-indicator {
display: inline-block; display: inline-block;
...@@ -180,7 +181,6 @@ ...@@ -180,7 +181,6 @@
border: 1px solid $darkGreen; border: 1px solid $darkGreen;
background: tint($green,20%); background: tint($green,20%);
color: #fff; color: #fff;
@include transition(background-color .15s);
&:hover { &:hover {
background: $brightGreen; background: $brightGreen;
...@@ -191,12 +191,15 @@ ...@@ -191,12 +191,15 @@
.problem-type-tabs { .problem-type-tabs {
list-style-type: none; list-style-type: none;
width: 100%; width: 100%;
background-color: $lightBluishGrey;
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-top-right-radius: 3px; border-top-right-radius: 3px;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: $lightBluishGrey;
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset);
li:first-child { li:first-child {
border-top-left-radius: 3px; border-top-left-radius: 3px;
margin-left: 20px;
} }
li:last-child { li:last-child {
...@@ -206,26 +209,29 @@ ...@@ -206,26 +209,29 @@
float:left; float:left;
display:inline-block; display:inline-block;
text-align:center; text-align:center;
width: 50%; width: auto;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: $lightBluishGrey; background-color: tint($lightBluishGrey, 20%);
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset); @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset);
opacity:.8;
&:hover { &:hover {
opacity: .7; @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
@include linear-gradient(top, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0)); @include transition(background-color .15s);
opacity:1;
} }
&.current { &.current {
border: 0px; border: 0px;
@include active; @include active;
opacity:1;
} }
} }
a{ a{
display: block; display: block;
padding: 10px 25px; padding: 15px 25px;
font-size: 14px; font-size: 15px;
line-height: 16px; line-height: 16px;
text-align: center; text-align: center;
color: #3c3c3c; color: #3c3c3c;
......
...@@ -65,7 +65,6 @@ ...@@ -65,7 +65,6 @@
% for type, templates in sorted(component_templates.items()): % for type, templates in sorted(component_templates.items()):
<div class="new-component-templates new-component-${type}"> <div class="new-component-templates new-component-${type}">
<div class="tab-group"> <div class="tab-group">
<ul class="problem-type-tabs nav-tabs"> <ul class="problem-type-tabs nav-tabs">
<li class="current"> <li class="current">
<a class="link-tab" href="#tab1">Common Problem Types</a> <a class="link-tab" href="#tab1">Common Problem Types</a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment