[ 
https://issues.apache.org/jira/browse/NIFI-2038?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=15367618#comment-15367618
 ] 

ASF subversion and git services commented on NIFI-2038:
-------------------------------------------------------

Commit fa351a61ab6e79e9ce12ffc0dc660da877de2165 in nifi's branch 
refs/heads/master from [~scottyaslan]
[ https://git-wip-us.apache.org/repos/asf?p=nifi.git;h=fa351a6 ]

[NIFI-2038] Make component buttons larger, add hover icon, and add grip across 
bottom
[NIFI-2031] update global menu styles
[NIFI-2037] Increase header icons font sizes
[NIFI-2036] update logo
[NIFI-2144] consistent view details icons
This closes #604


> 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
>          Components: Core UI
>            Reporter: Rob Moran
>            Assignee: Scott Aslan
>         Attachments: component-button-sample.png
>
>
> *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} within 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)

Reply via email to