Commit e77ecf62 authored by Clement Ho's avatar Clement Ho

Merge branch '41748-vertical-misalignment-login-box' into 'master'

Vertical misalignment of login box header

Closes #41748

See merge request gitlab-org/gitlab-ce!16275
parents 54691d3d 21e6c7ac
......@@ -5,7 +5,7 @@ import AccessorUtilities from '~/lib/utils/accessor';
* Does that setting the current selected tab in the localStorage
*/
export default class SigninTabsMemoizer {
constructor({ currentTabKey = 'current_signin_tab', tabSelector = 'ul.nav-tabs' } = {}) {
constructor({ currentTabKey = 'current_signin_tab', tabSelector = 'ul.new-session-tabs' } = {}) {
this.currentTabKey = currentTabKey;
this.tabSelector = tabSelector;
this.isLocalStorageAvailable = AccessorUtilities.isLocalStorageAccessSafe();
......
......@@ -154,26 +154,10 @@
a {
width: 100%;
font-size: 18px;
margin-right: 0;
&:hover {
border: 1px solid transparent;
}
}
&.active {
border-bottom: 1px solid $border-color;
a {
border: 0;
border-bottom: 2px solid $link-underline-blue;
margin-right: 0;
color: $black;
&:hover {
border-bottom: 2px solid $link-underline-blue;
}
}
&.active > a {
cursor: default;
}
}
}
......
%ul.nav-links.nav-tabs.new-session-tabs.single-tab
%ul.nav-links.new-session-tabs.single-tab
%li.active
%a= tab_title
%ul.new-session-tabs.nav-links.nav-tabs{ class: ('custom-provider-tabs' if form_based_providers.any?) }
%ul.nav-links.new-session-tabs{ class: ('custom-provider-tabs' if form_based_providers.any?) }
- if crowd_enabled?
%li.active
= link_to "Crowd", "#crowd", 'data-toggle' => 'tab'
......
%ul.nav-links.new-session-tabs.nav-tabs{ role: 'tablist' }
%ul.nav-links.new-session-tabs{ role: 'tablist' }
%li.active{ role: 'presentation' }
%a{ href: '#login-pane', data: { toggle: 'tab' }, role: 'tab' } Sign in
- if allow_signup?
......
---
title: Refactor CSS to eliminate vertical misalignment of login nav
merge_request: 16275
author: Takuya Noguchi
type: fixed
......@@ -392,7 +392,7 @@ feature 'Login' do
end
def ensure_one_active_tab
expect(page).to have_selector('.nav-tabs > li.active', count: 1)
expect(page).to have_selector('ul.new-session-tabs > li.active', count: 1)
end
def ensure_one_active_pane
......
%ul.nav.nav-tabs.linked-tabs
%ul.nav-links.new-session-tabs.linked-tabs
%li
%a{ href: 'foo/bar/1', data: { target: 'div#tab1', action: 'tab1', toggle: 'tab' } }
Tab 1
......
%ul.nav-tabs
%ul.nav-links.new-session-tabs
%li.active
%a{ href: '#ldap' } LDAP
%li
%a.active{ id: 'standard', href: '#standard'} Standard
%li
%a{ id: 'ldap', href: '#ldap'} Ldap
%a{ href: '#login-pane'} Standard
......@@ -4,7 +4,7 @@ import SigninTabsMemoizer from '~/pages/sessions/new/signin_tabs_memoizer';
(() => {
describe('SigninTabsMemoizer', () => {
const fixtureTemplate = 'static/signin_tabs.html.raw';
const tabSelector = 'ul.nav-tabs';
const tabSelector = 'ul.new-session-tabs';
const currentTabKey = 'current_signin_tab';
let memo;
......@@ -27,7 +27,7 @@ import SigninTabsMemoizer from '~/pages/sessions/new/signin_tabs_memoizer';
it('does nothing if no tab was previously selected', () => {
createMemoizer();
expect(document.querySelector('li a.active').getAttribute('id')).toEqual('standard');
expect(document.querySelector(`${tabSelector} > li.active a`).getAttribute('href')).toEqual('#ldap');
});
it('shows last selected tab on boot', () => {
......@@ -48,9 +48,9 @@ import SigninTabsMemoizer from '~/pages/sessions/new/signin_tabs_memoizer';
it('saves last selected tab on change', () => {
createMemoizer();
document.getElementById('standard').click();
document.querySelector('a[href="#login-pane"]').click();
expect(memo.readData()).toEqual('#standard');
expect(memo.readData()).toEqual('#login-pane');
});
it('overrides last selected tab with hash tag when given', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment