[Frontend] Styling on Timeline zoom buttons

open #208
Fixed in both themes;
This commit is contained in:
Charles Hacskaylo 2015-11-20 15:42:08 -08:00
parent fc53dbd8a4
commit 3854df27d8
5 changed files with 40 additions and 44 deletions

View File

@ -252,48 +252,39 @@
background-repeat: repeat-x; }
/* line 118, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder {
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjAuNSIgeDI9IjAuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjxzdG9wIG9mZnNldD0iNzAlIiBzdG9wLWNvbG9yPSIjNDA0MDQwIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjNDA0MDQwIiBzdG9wLW9wYWNpdHk9IjAuMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -moz-linear-gradient(180deg, #404040, #404040 70%, rgba(64, 64, 64, 0) 100%);
background-image: -webkit-linear-gradient(180deg, #404040, #404040 70%, rgba(64, 64, 64, 0) 100%);
background-image: linear-gradient(-90deg, #404040, #404040 70%, rgba(64, 64, 64, 0) 100%); }
/* line 123, ../sass/_timeline-thematic.scss */
/* line 124, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder .s-btn {
background-color: #404040;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #a6a6a6;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d4d4d), color-stop(100%, #404040));
background-image: -moz-linear-gradient(#4d4d4d, #404040);
background-image: -webkit-linear-gradient(#4d4d4d, #404040);
background-image: linear-gradient(#4d4d4d, #404040);
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px; }
/* line 129, ../sass/_timeline-thematic.scss */
height: 16px;
line-height: 16px; }
/* line 127, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder .s-btn .icon {
font-size: 0.7rem !important; }
/* line 134, ../sass/_timeline-thematic.scss */
.s-timeline .l-timeline-resource-graph .l-graph {
background: rgba(0, 0, 0, 0.2); }
/* line 132, ../sass/_timeline-thematic.scss */
/* line 137, ../sass/_timeline-thematic.scss */
.s-timeline .l-timeline-resource-graph .l-title {
color: #999; }
/* line 138, ../sass/_timeline-thematic.scss */
/* line 143, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane {
cursor: pointer; }
/* line 140, ../sass/_timeline-thematic.scss */
/* line 145, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane .s-label {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 2px 5px; }
/* line 143, ../sass/_timeline-thematic.scss */
/* line 148, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane .s-label:hover {
background: rgba(255, 255, 255, 0.1);
color: #fff; }

View File

@ -252,39 +252,39 @@
background-repeat: repeat-x; }
/* line 118, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder {
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjAuNSIgeDI9IjAuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VmZWZlZiIvPjxzdG9wIG9mZnNldD0iNzAlIiBzdG9wLWNvbG9yPSIjZWZlZmVmIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZWZlZmVmIiBzdG9wLW9wYWNpdHk9IjAuMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -moz-linear-gradient(180deg, #efefef, #efefef 70%, rgba(239, 239, 239, 0) 100%);
background-image: -webkit-linear-gradient(180deg, #efefef, #efefef 70%, rgba(239, 239, 239, 0) 100%);
background-image: linear-gradient(-90deg, #efefef, #efefef 70%, rgba(239, 239, 239, 0) 100%); }
/* line 123, ../sass/_timeline-thematic.scss */
/* line 124, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder .s-btn {
background-color: white;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #737373;
display: inline-block; }
/* line 129, ../sass/_timeline-thematic.scss */
height: 16px;
line-height: 16px; }
/* line 127, ../sass/_timeline-thematic.scss */
.s-timeline .s-hover-btns-holder .s-btn .icon {
font-size: 0.7rem !important; }
/* line 134, ../sass/_timeline-thematic.scss */
.s-timeline .l-timeline-resource-graph .l-graph {
background: rgba(0, 0, 0, 0.1); }
/* line 132, ../sass/_timeline-thematic.scss */
background: rgba(0, 0, 0, 0.05); }
/* line 137, ../sass/_timeline-thematic.scss */
.s-timeline .l-timeline-resource-graph .l-title {
color: #666; }
/* line 138, ../sass/_timeline-thematic.scss */
/* line 143, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane {
cursor: pointer; }
/* line 140, ../sass/_timeline-thematic.scss */
/* line 145, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane .s-label {
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
padding: 2px 5px; }
/* line 143, ../sass/_timeline-thematic.scss */
/* line 148, ../sass/_timeline-thematic.scss */
.edit-mode .s-swimlane .s-label:hover {
background: rgba(255, 255, 255, 0.1);
color: #fff; }

View File

@ -21,8 +21,8 @@
*****************************************************************************/
// General
$timelineHeaderColorBg: lighten($colorBodyBg, 5%);
$timelineColorAlt1: lighten($timelineHeaderColorBg, 10%);
$timelineHeaderColorBg: pullForward($colorBodyBg, 5%);
$timelineColorAlt1: pullForward($timelineHeaderColorBg, 10%);
$colorGanttBarBg: #5555aa;
$colorGanttBarFg: #fff;
$colorGanttBarSelectedBg: #ccc;

View File

@ -37,6 +37,6 @@ $colorGanttToggle: $colorKey;
$shdwGanttBar: rgba(black, 0.1) 0 1px 3px;
// Resource graphs
$timelineResourceGraphBg: rgba(black, 0.1);
$timelineResourceGraphBg: $colorPlotBg;
$timelineResourceGraphFg: $colorBodyFg;
$timelineResourceGraphLegendFg: $colorBodyFg;

View File

@ -119,9 +119,14 @@
$bg: $timelineHeaderColorBg;
$bga: 1;
$l: 5%;
@include user-select(none);
@include background-image(linear-gradient(-90deg, rgba($bg, $bga), rgba($bg, $bga) 70%, rgba($bg, 0) 100%));
.s-btn {
@include containerSubtle(lighten($colorBodyBg, $l), lighten($colorBodyFg, $l), true);
height: 16px;
line-height: 16px;
.icon {
font-size: 0.7rem !important;
}
}
}