Mirrors/xod
2
0
Fork 0
mirror of https://github.com/xodio/xod.git synced 2026-03-18 22:56:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

style(xod-client): stylize occupied input pins highlighting while linking pins (less opacity)

Browse Source
This commit is contained in:
Kirill Shumilov
2018-03-13 13:59:48 +03:00
parent ac4a6ead30
commit 22dd4fba4f
2 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/xod-client/src/core/styles/components/Pin.scss
View File

@@ -67,6 +67,10 @@
fill: $color-canvas-selected;
}
}
&.is-connected.is-input .linkingHighlight {
fill-opacity: 0.3;
}
}
.PinOverlay {

6
packages/xod-client/src/project/components/Pin.jsx
View File

@@ -1,6 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { PIN_DIRECTION } from 'xod-project';
import {
PIN_RADIUS,
PIN_RADIUS_WITH_OUTER_STROKE,
@@ -11,6 +13,9 @@ const Pin = props => {
const cls = classNames('Pin', {
'is-selected': props.isSelected,
'is-accepting-links': props.isAcceptingLinks,
'is-connected': props.isConnected,
'is-input': props.direction === PIN_DIRECTION.INPUT,
'is-output': props.direction === PIN_DIRECTION.OUTPUT,
});
const symbolClassNames = classNames('symbol', props.type, {
@@ -60,6 +65,7 @@ Pin.propTypes = {
keyName: PropTypes.string.isRequired,
label: PropTypes.string,
type: PropTypes.string,
direction: PropTypes.string,
position: PropTypes.object.isRequired,
isSelected: PropTypes.bool,
isConnected: PropTypes.bool,