diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2017-01-06 11:58:51 +0000 |
---|---|---|
committer | Annabel Dunstone Gray <annabel.dunstone@gmail.com> | 2017-01-19 14:44:06 -0600 |
commit | 5db587a1adb6c51a2e3e5ab44ef35779f9a6917d (patch) | |
tree | bf4e9130347ce45754ad6368e3a42548aa3a710b /app/assets/stylesheets/pages/diff.scss | |
parent | 1c81452a9955bb06515faf26cedbe8e2b28791d5 (diff) | |
download | gitlab-ce-5db587a1adb6c51a2e3e5ab44ef35779f9a6917d.tar.gz |
Responsive title in diffs inline, side by side, with and without sidebar
Adds MR ID to CHANGELOG entry
Diffstat (limited to 'app/assets/stylesheets/pages/diff.scss')
-rw-r--r-- | app/assets/stylesheets/pages/diff.scss | 72 |
1 files changed, 72 insertions, 0 deletions
diff --git a/app/assets/stylesheets/pages/diff.scss b/app/assets/stylesheets/pages/diff.scss index 96ba7c40634..d7bb029cac6 100644 --- a/app/assets/stylesheets/pages/diff.scss +++ b/app/assets/stylesheets/pages/diff.scss @@ -44,6 +44,15 @@ .diff-toggle-caret { padding-right: 6px; } + + .file-title-name { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display: inline-block; + vertical-align: bottom; + max-width: 450px; + } } .diff-content { @@ -480,3 +489,66 @@ } } } + +/** + * Diff file title + */ +.file-holder[data-view="parallel"] .file-title-name, +.file-holder[data-view="inline"] .file-title-name { + @media (max-width: $screen-xs) { + max-width: 140px; + } + + @media (min-width: $screen-xs) and (max-width: $screen-xs-max) { + max-width: 250px; + } + + @media (min-width: $screen-sm) and (max-width: $screen-sm-max) { + max-width: 250px; + } + + @media (min-width: $screen-md) and (max-width: $screen-md-max) { + max-width: 480px; + } +} + +.file-holder[data-view="parallel"] .file-title-name { + @media (min-width: $screen-lg) { + max-width: 760px; + } +} + +.file-holder[data-view="inline"] .file-title-name { + @media (min-width: $screen-lg) { + max-width: 530px; + } +} + +.right-sidebar-expanded { + .file-holder[data-view="parallel"] .file-title-name, + .file-holder[data-view="inline"] .file-title-name { + @media (min-width: $screen-sm) and (max-width: $screen-sm-max) { + max-width: 250px; + } + + @media (min-width: $screen-md) and (max-width: $screen-md-max) { + max-width: 250px; + } + + @media (min-width: $screen-lg) { + max-width: 460px; + } + } + + .file-holder[data-view="parallel"] .file-title-name { + @media (min-width: $screen-xs) and (max-width: $screen-xs-max) { + max-width: 180px; + } + } + + .file-holder[data-view="inline"] .file-title-name { + @media (min-width: $screen-xs) and (max-width: $screen-xs-max) { + max-width: 100px; + } + } +} |