mirror of
https://github.com/node-red/node-red.git
synced 2025-03-01 10:36:34 +00:00
Update tooltip style and add to some editor buttons
This commit is contained in:
@@ -67,3 +67,6 @@ $editor-button-color: #999;
|
||||
$editor-button-background: #fff;
|
||||
|
||||
$shade-color: rgba(160,160,160,0.5);
|
||||
|
||||
$popover-background: #333;
|
||||
$popover-color: #eee;
|
||||
|
@@ -21,12 +21,14 @@
|
||||
width: auto;
|
||||
padding: 10px;
|
||||
height: auto;
|
||||
background: #fff;
|
||||
|
||||
background: $popover-background;
|
||||
color: $popover-color;
|
||||
border-radius: 4px;
|
||||
z-index: 1000;
|
||||
font-size: 14px;
|
||||
line-height: 1.4em;
|
||||
@include component-shadow;
|
||||
border-color: $popover-background;
|
||||
}
|
||||
|
||||
.red-ui-popover:after, .red-ui-popover:before {
|
||||
@@ -51,28 +53,33 @@
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.red-ui-popover.red-ui-popover-top:after, .red-ui-popover.red-ui-popover-top:before {
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.red-ui-popover.red-ui-popover-right:after {
|
||||
border-color: rgba(136, 183, 213, 0);
|
||||
border-right-color: #fff;
|
||||
border-right-color: $popover-background;
|
||||
border-width: 10px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
.red-ui-popover.red-ui-popover-right:before {
|
||||
border-color: rgba(194, 225, 245, 0);
|
||||
border-right-color: $primary-border-color;
|
||||
border-right-color: $popover-background;
|
||||
border-width: 11px;
|
||||
margin-top: -11px;
|
||||
}
|
||||
|
||||
.red-ui-popover.red-ui-popover-left:after {
|
||||
border-color: rgba(136, 183, 213, 0);
|
||||
border-left-color: #fff;
|
||||
border-left-color: $popover-background;
|
||||
border-width: 10px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
.red-ui-popover.red-ui-popover-left:before {
|
||||
border-color: rgba(194, 225, 245, 0);
|
||||
border-left-color: $primary-border-color;
|
||||
border-left-color: $popover-background;
|
||||
border-width: 11px;
|
||||
margin-top: -11px;
|
||||
}
|
||||
@@ -80,45 +87,61 @@
|
||||
|
||||
.red-ui-popover.red-ui-popover-bottom:after {
|
||||
border-color: rgba(136, 183, 213, 0);
|
||||
border-bottom-color: #fff;
|
||||
border-bottom-color: $popover-background;
|
||||
border-width: 10px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
.red-ui-popover.red-ui-popover-bottom:before {
|
||||
border-color: rgba(194, 225, 245, 0);
|
||||
border-bottom-color: $primary-border-color;
|
||||
border-bottom-color: $popover-background;
|
||||
border-width: 11px;
|
||||
margin-left: -11px;
|
||||
}
|
||||
|
||||
.red-ui-popover.red-ui-popover-top:after {
|
||||
border-color: rgba(136, 183, 213, 0);
|
||||
border-top-color: $popover-background;
|
||||
border-width: 10px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
.red-ui-popover.red-ui-popover-top:before {
|
||||
border-color: rgba(194, 225, 245, 0);
|
||||
border-top-color: $popover-background;
|
||||
border-width: 11px;
|
||||
margin-left: -11px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.red-ui-popover-size-small {
|
||||
font-size: 11px;
|
||||
padding: 5px;
|
||||
font-size: 12px;
|
||||
padding: 5px 7px;
|
||||
line-height: 1.8em;
|
||||
|
||||
&.red-ui-popover-right:after {
|
||||
border-width: 5px;
|
||||
margin-top: -5px;
|
||||
&.red-ui-popover-right:after, &.red-ui-popover-left:after {
|
||||
border-width: 7px;
|
||||
margin-top: -7px;
|
||||
}
|
||||
&.red-ui-popover-right:before {
|
||||
border-width: 6px;
|
||||
margin-top: -6px;
|
||||
&.red-ui-popover-right:before, &.red-ui-popover-left:before {
|
||||
border-width: 8px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
&.red-ui-popover-left:after {
|
||||
border-width: 5px;
|
||||
margin-top: -5px;
|
||||
&.red-ui-popover-bottom:after, &.red-ui-popover-top:after {
|
||||
border-width: 7px;
|
||||
margin-left: -7px;
|
||||
}
|
||||
&.red-ui-popover-left:before {
|
||||
border-width: 6px;
|
||||
margin-top: -6px;
|
||||
}
|
||||
&.red-ui-popover-bottom:after {
|
||||
border-width: 5px;
|
||||
margin-left: -5px;
|
||||
}
|
||||
&.red-ui-popover-bottom:before {
|
||||
border-width: 6px;
|
||||
margin-left: -6px;
|
||||
&.red-ui-popover-bottom:before, &.red-ui-popover-top:before {
|
||||
border-width: 8px;
|
||||
margin-left: -8px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.red-ui-popover-key {
|
||||
font-family: monospace;
|
||||
margin-left: 5px;
|
||||
border: 1px solid #999;
|
||||
border-radius:3px;
|
||||
padding: 2px 3px;
|
||||
}
|
||||
|
Reference in New Issue
Block a user