Skip to content

Conversation

@Neiko2002
Copy link
Contributor

The design of the arrow icon in the explorer view is a little bit off. This PR adds the Gitbucket color scheme to the icon and removes the outlines when it is focused.

@tomoki1207
Copy link
Collaborator

tomoki1207 commented Mar 15, 2017

@Neiko2002 Thank you contributing.
Is "little bit off" means that the vertical alignment of the button beside the Files tab and the badges beside the other tabs is different?
It looks not fixed by this PR.

About color scheme, the appearance should be differ between the button and other badges for clearly to be able to click or not, imho.
But the gray color might not be nice as you felt. ;)

@Neiko2002
Copy link
Contributor Author

You are right the alignment is also a little bit of. But I was only referring to the color scheme. If we want to make it distinguishable from the other badges, we could use the design of the "+" button in the "files overview".

Adding "btn btn-default" to the class of the button element above is sufficient.

Copy link
Collaborator

@tomoki1207 tomoki1207 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you quickly fix!
I also tried adjusting alignments based on your styles then I wrote it each comments.
Please could you review it?

padding: 2px 2px 0 5px;
right: 5px;
padding: 2px 0px 0 4px;
right: 15px;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The icon content alignment when expanded is little bit off by these style.
And I think the button and badges should be aligned by center rather than right.
The below styles looks good for me.

  padding: 0;
  width: 25px;
  height: 25px;
  right: 10px;

border-radius: 3px;
outline: none;
}
.root-expander > .octicon {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only width: 10px; is enough in this block for apply the style of btn-default and centering the icon contents.

@Neiko2002
Copy link
Contributor Author

I like your suggestions. The btn-default class would give the button a hover effect. We might want to add the effect if we don't want to use the class.

@tomoki1207
Copy link
Collaborator

I think it is better to use btn-default because it style provides us unified design.
Well, could you modify the files with our conversations and then rebase these commits?

@Neiko2002
Copy link
Contributor Author

I've tried a smaller version of the expander button, having the same size as the other badges. I like this version the best. What do you think?

@tomoki1207
Copy link
Collaborator

Sorry for late reply.
The smaller version is nice but I think the normal version is better.
Because the look of normal version is similar to octotree and familiar its users.

@Neiko2002
Copy link
Contributor Author

I have taken a look at the octotree design and changed my commit to resample it. How do you like it?

@tomoki1207
Copy link
Collaborator

It looks nice. Thank you for work!

@tomoki1207 tomoki1207 merged commit 6357eec into gitbucket:master Apr 12, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

2 participants