Commit d7c0955b authored by Phil Hughes's avatar Phil Hughes

Fixed merge request tabs extra margin

Fixed extra margin when the merge request tabs are affixed

This was caused by some weird padding that was on the container & then
not correctly removed.

The fix involved removing the container from inside the tabs holder div
& then adding the widths through CSS depending on if fixed & whether the
parent is limited width or not.

In reality out container classes need to be fixed as it is getting pretty un-managable at the moment this should of been an easy fix, but in reality turned into something much harder.

Closes #26853
parent b9ff4656
...@@ -26,10 +26,6 @@ ...@@ -26,10 +26,6 @@
border: 0; border: 0;
} }
} }
.container-fluid {
@extend .fixed-width-container;
}
} }
} }
......
...@@ -420,10 +420,6 @@ ...@@ -420,10 +420,6 @@
.merge-request-tabs-holder { .merge-request-tabs-holder {
background-color: $white-light; background-color: $white-light;
.container-limited {
max-width: $limited-layout-width;
}
&.affix { &.affix {
top: 100px; top: 100px;
left: 0; left: 0;
...@@ -433,10 +429,26 @@ ...@@ -433,10 +429,26 @@
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
right: 0; right: 0;
} }
.merge-request-tabs-container {
padding-left: $gl-padding;
padding-right: $gl-padding;
}
} }
}
&:not(.affix) .container-fluid { .limit-container-width {
padding-left: 0; .merge-request-tabs-container {
padding-right: 0; max-width: $limited-layout-width;
margin-left: auto;
margin-right: auto;
}
}
.limit-container-width:not(.container-limited) {
.merge-request-tabs-holder:not(.affix) {
.merge-request-tabs-container {
max-width: $limited-layout-width - ($gl-padding * 2);
}
} }
} }
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
= render 'award_emoji/awards_block', awardable: @merge_request, inline: true = render 'award_emoji/awards_block', awardable: @merge_request, inline: true
.merge-request-tabs-holder{ class: ("js-tabs-affix" unless ENV['RAILS_ENV'] == 'test') } .merge-request-tabs-holder{ class: ("js-tabs-affix" unless ENV['RAILS_ENV'] == 'test') }
%div{ class: container_class } .merge-request-tabs-container
%ul.merge-request-tabs.nav-links.no-top.no-bottom %ul.merge-request-tabs.nav-links.no-top.no-bottom
%li.notes-tab %li.notes-tab
= link_to namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#notes', action: 'notes', toggle: 'tab' } do = link_to namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#notes', action: 'notes', toggle: 'tab' } do
...@@ -115,4 +115,3 @@ ...@@ -115,4 +115,3 @@
}); });
var mrRefreshWidgetUrl = "#{mr_widget_refresh_url(@merge_request)}"; var mrRefreshWidgetUrl = "#{mr_widget_refresh_url(@merge_request)}";
---
title: Fixed merge requests tab extra margin when fixed to window
merge_request:
author:
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