Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Design10 #979

Merged
merged 12 commits into from Sep 27, 2016
Merged

Design10 #979

merged 12 commits into from Sep 27, 2016

Conversation

ellisonbg
Copy link
Contributor

Lots of design changes across all of JupyterLab.

@ellisonbg
Copy link
Contributor Author

Fixes #974 #971 #970 #968 #966

#jp-main-dock-panel {
padding: 4px;
padding: 5px;
Copy link
Contributor

Choose a reason for hiding this comment

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

I thought we wanted dimensions to be a multiple of 4?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

In general I am trying to do that, but tried it at 4px for a long time and it just felt too crowded...there are a few other places in the notebook where we are using 5px increments because of this as well...

}

.p-TabBar.p-mod-top .p-TabBar-tab.p-mod-current,
.p-TabBar.p-mod-bottom .p-TabBar-tab.p-mod-current {
min-height: calc(var(--jp-private-horizontal-tab-height) - var(--jp-border-width));
overflow: visible;
Copy link
Contributor

Choose a reason for hiding this comment

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

The overflow rule should probably be set the same for all tabs, not just the current tab.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

done

|----------------------------------------------------------------------------*/


#jp-main-dock-panel .p-TabBar-tab.jp-mod-current:before {
Copy link
Contributor

Choose a reason for hiding this comment

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

this rule will select all tab bar tabs which are descendant from the dock panel (even ones used by ipywidgets for example). We probably want to selected only the tab bars created by the main dock panel. .p-DockPanel-tabPanel > .p-TabBar .p-TabBar-tab would get you there, albeit it's a bit long.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

fixed

}


.p-CommandPalette-input:-ms-input-placeholder {
Copy link
Contributor

Choose a reason for hiding this comment

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

:: instead of :?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Copy link
Contributor Author

Choose a reason for hiding this comment

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

don't have IE to test...and we use CSS variables...

}


.jp-Inspector .p-TabBar .p-TabBar-tab {
Copy link
Contributor

Choose a reason for hiding this comment

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

the .p-TabBar part of this selector is redundant. a .p-TabBar-tab is always a descendant of a .p-TabBar

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Needed for specificiy to override default styling

Copy link
Contributor

Choose a reason for hiding this comment

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

This is now merged, but the cheaper way to increase specificity would be to do something like .jp-Inspector.p-Widget .p-TabBar-tab. Descendant selectors are the most expensive for the browser to match, so should be used as little as possible.

}


.jp-Inspector .p-TabBar .p-TabBar-tab.p-mod-current {
Copy link
Contributor

Choose a reason for hiding this comment

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

ditto

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Same specificity issue

@ellisonbg
Copy link
Contributor Author

OK @sccolbert I think I have addressed all your comments.

@ellisonbg
Copy link
Contributor Author

LGTM

@afshin afshin merged commit 17607ed into jupyterlab:master Sep 27, 2016
@ellisonbg ellisonbg deleted the design10 branch June 14, 2017 04:12
@lock lock bot added the status:resolved-locked Closed issues are locked after 30 days inactivity. Please open a new issue for related discussion. label Aug 10, 2019
@lock lock bot locked as resolved and limited conversation to collaborators Aug 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
status:resolved-locked Closed issues are locked after 30 days inactivity. Please open a new issue for related discussion. tag:Design and UX
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants