Rob Moran created NIFI-2038:
-------------------------------
Summary: Make component buttons larger and add grip across bottom
Key: NIFI-2038
URL: https://issues.apache.org/jira/browse/NIFI-2038
Project: Apache NiFi
Issue Type: Sub-task
Reporter: Rob Moran
*For #header .component-button*
REMOVE
background-color: #aabbc3;
border-radius: 2px;
ADD
background: none;
height: 56px;
position: relative;
width: 56px;
*Could not find CSS where current hover state is being applied to
.component-button, but need to change background-color and and box-shadow*
(FOR COMPONENT-BUTTON HOVER STATE)
background-color: #e3e8eb;
box-shadow: 0 3px 6px rgba(0,0,0,0.3);
*For the button grip*
See the attached image (*component-button-sample.png*) mocked up using browser
dev tools.
This was created by adding {code}<span
class="component-button-grip"></span>{code} to each {code}<button>{code} and
applying this CSS class:
{code}.component-button-grip {
background:
repeating-linear-gradient(90deg,rgba(170,187,195,1),rgba(170,187,195,1)
4px,rgba(170,187,195,0) 4px,rgba(170,187,195,0) 6px);
bottom: 2px;
height: 4px;
left: 2px;
position: absolute;
width: 52px;
}{code}
The grip should also drag onto the canvas along with the icon. I don't believe
any changes are needed for this to happen.
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)
