Commit 5196f602 authored by Annabel Dunstone Gray's avatar Annabel Dunstone Gray

Merge branch 'remove-redundant-mixins' into 'master'

Remove redundant mixins

## What does this MR do?
Removes the following redundant mixins
```
@mixin box-shadow($shadow) {
  box-shadow: $shadow;
}

@mixin border-radius($radius) {
  border-radius: $radius;
}
```

## Are there points in the code the reviewer needs to double check?
Just need to make sure the refactor didn't break anything. Last time I did something like this, we faced an edge case where values `.5` would pass correctly in mixins but not when passed directly to the property.

## Why was this MR needed?

*  Reduces redundant code which leads to happier developers 😄 

## Screenshots (if relevant)
None

## Does this MR meet the acceptance criteria?

- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- Tests
  - [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

## What are the relevant issue numbers?
Closes #22012

See merge request !6287
parents a5cd9c9a df4c4833
......@@ -36,6 +36,7 @@ v 8.13.0 (unreleased)
- Add word-wrap to issue title on issue and milestone boards (ClemMakesApps)
- Fix todos page mobile viewport layout (ClemMakesApps)
- Fix inconsistent highlighting of already selected activity nav-links (ClemMakesApps)
- Remove redundant mixins (ClemMakesApps)
- Fix robots.txt disallowing access to groups starting with "s" (Matt Harrison)
- Close open merge request without source project (Katarzyna Kobierska Ula Budziszewska)
- Fix that manual jobs would no longer block jobs in the next stage. !6604
......
......@@ -4,7 +4,7 @@
width: 40px;
height: 40px;
padding: 0;
@include border-radius($avatar_radius);
border-radius: $avatar_radius;
border: 1px solid rgba(0, 0, 0, .1);
&.avatar-inline {
......@@ -17,7 +17,7 @@
}
&.avatar-tile {
@include border-radius(0);
border-radius: 0;
border: none;
}
......
......@@ -133,7 +133,7 @@
}
.identicon {
@include border-radius(50%);
border-radius: 50%;
}
}
......
@mixin btn-default {
@include border-radius(3px);
border-radius: 3px;
font-size: $gl-font-size;
font-weight: 500;
padding: $gl-vert-padding $gl-btn-padding;
......@@ -8,7 +8,7 @@
&:active {
outline: none;
background-color: $btn-active-gray;
@include box-shadow($gl-btn-active-background);
box-shadow: $gl-btn-active-background;
}
}
......@@ -43,7 +43,7 @@
&:active,
&.active {
@include box-shadow ($gl-btn-active-background);
box-shadow: $gl-btn-active-background;
background-color: $dark;
border-color: $border-dark;
......@@ -279,7 +279,7 @@
}
.active {
@include box-shadow($gl-btn-active-background);
box-shadow: $gl-btn-active-background;
border: 1px solid #c6cacf !important;
background-color: #e4e7ed !important;
......
......@@ -73,7 +73,7 @@ label {
}
.form-control {
@include box-shadow(none);
box-shadow: none;
border-radius: 3px;
padding: $gl-vert-padding $gl-input-padding;
}
......
......@@ -16,7 +16,7 @@
margin-top: 5px;
}
@include border-radius(3px);
border-radius: 3px;
display: block;
float: left;
margin-right: 10px;
......
......@@ -86,7 +86,7 @@
}
.markdown-area {
@include border-radius(0);
border-radius: 0;
background: #fff;
border: 1px solid #ddd;
min-height: 140px;
......
/**
* Generic mixins
*/
@mixin box-shadow($shadow) {
box-shadow: $shadow;
}
@mixin border-radius($radius) {
border-radius: $radius;
}
/**
* Prefilled mixins
* Mixins with fixed values
......
......@@ -133,5 +133,5 @@
font-size: 20px;
color: #777;
z-index: 100;
@include box-shadow(0 1px 2px #ddd);
box-shadow: 0 1px 2px #ddd;
}
......@@ -46,8 +46,8 @@
}
.select2-drop {
@include box-shadow(rgba(76, 86, 103, 0.247059) 0 0 1px 0, rgba(31, 37, 50, 0.317647) 0 2px 18px 0);
@include border-radius ($border-radius-default);
box-shadow: rgba(76, 86, 103, 0.247059) 0 0 1px 0, rgba(31, 37, 50, 0.317647) 0 2px 18px 0;
border-radius: $border-radius-default;
border: none;
min-width: 175px;
}
......@@ -72,7 +72,7 @@
.select2-container-active {
.select2-choice, .select2-choices {
@include box-shadow(none);
box-shadow: none;
}
}
......@@ -82,13 +82,13 @@
outline: 0;
background-image: none;
background-color: $white-dark;
@include box-shadow($gl-btn-active-gradient);
box-shadow: $gl-btn-active-gradient;
}
}
.select2-container-multi {
.select2-choices {
@include border-radius($border-radius-default);
border-radius: $border-radius-default;
border-color: $input-border;
background: none;
......@@ -123,7 +123,7 @@
&.select2-container-active .select2-choices,
&.select2-dropdown-open .select2-choices {
border-color: $border-white-normal;
@include box-shadow($gl-btn-active-gradient);
box-shadow: $gl-btn-active-gradient;
}
}
......@@ -157,7 +157,7 @@
background-repeat: no-repeat;
background-position: right 0 bottom 6px;
border: 1px solid $input-border;
@include border-radius($border-radius-default);
border-radius: $border-radius-default;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
&:focus {
......
......@@ -4,7 +4,7 @@
&.page-sidebar-pinned {
.sidebar-wrapper {
@include box-shadow(none);
box-shadow: none;
}
}
......@@ -17,7 +17,7 @@
width: 0;
overflow: hidden;
transition: width $sidebar-transition-duration;
@include box-shadow(2px 0 16px 0 $black-transparent);
box-shadow: 2px 0 16px 0 $black-transparent;
}
}
......@@ -100,7 +100,7 @@
.count {
float: right;
padding: 0 8px;
@include border-radius(6px);
border-radius: 6px;
}
}
......
......@@ -116,7 +116,7 @@
font-size: 13px;
line-height: 1.6em;
overflow-x: auto;
@include border-radius(2px);
border-radius: 2px;
}
p > code {
......
......@@ -50,7 +50,7 @@
.bordered-box {
border: 1px solid $border-color;
@include border-radius($border-radius-default);
border-radius: $border-radius-default;
}
......
.file-editor {
#editor {
border: none;
@include border-radius(0);
border-radius: 0;
height: 500px;
margin: 0;
padding: 0;
......
......@@ -91,7 +91,7 @@
float: right;
border: 1px solid #eee;
padding: 5px;
@include border-radius(5px);
border-radius: 5px;
background: $gray-light;
margin-left: 10px;
top: -6px;
......
.suggest-colors {
margin-top: 5px;
a {
@include border-radius(4px);
border-radius: 4px;
width: 30px;
height: 30px;
display: inline-block;
......@@ -17,7 +17,7 @@
overflow: hidden;
a {
@include border-radius(0);
border-radius: 0;
width: (100% / 7);
margin-right: 0;
margin-bottom: -5px;
......
......@@ -73,12 +73,12 @@
height: auto;
&.top {
@include border-radius(5px 5px 0 0);
border-radius: 5px 5px 0 0;
margin-bottom: 0;
}
&.bottom {
@include border-radius(0 0 5px 5px);
border-radius: 0 0 5px 5px;
border-top: 0;
margin-bottom: 20px;
}
......@@ -86,7 +86,7 @@
&.middle {
border-top: 0;
margin-bottom: 0;
@include border-radius(0);
border-radius: 0;
}
&:active, &:focus {
......
......@@ -6,7 +6,7 @@
background: $background-color;
color: $gl-gray;
border: 1px solid $border-color;
@include border-radius(2px);
border-radius: 2px;
form {
margin-bottom: 0;
......
......@@ -334,7 +334,7 @@ ul.notes {
.add-diff-note {
margin-top: -4px;
@include border-radius(40px);
border-radius: 40px;
background: #fff;
padding: 4px;
font-size: 16px;
......
......@@ -4,7 +4,7 @@
text-align: center;
.preview {
@include border-radius(4px);
border-radius: 4px;
height: 80px;
margin-bottom: 10px;
......@@ -47,7 +47,7 @@
width: 160px;
img {
@include border-radius(4px);
border-radius: 4px;
max-width: 100%;
}
......
......@@ -354,7 +354,7 @@ a.deploy-project-label {
justify-content: flex-start;
.fork-thumbnail {
@include border-radius($border-radius-base);
border-radius: $border-radius-base;
background-color: $white-light;
border: 1px solid $border-white-light;
height: 202px;
......@@ -371,7 +371,7 @@ a.deploy-project-label {
background-color: $gray-light;
border: 1px solid $gray-dark;
margin: 0 auto;
@include border-radius(50%);
border-radius: 50%;
i {
font-size: 100px;
color: $gray-dark;
......@@ -390,7 +390,7 @@ a.deploy-project-label {
}
img {
@include border-radius(50%);
border-radius: 50%;
max-width: 100px;
}
}
......@@ -496,7 +496,7 @@ pre.light-well {
}
.light-well {
@include border-radius (2px);
border-radius: 2px;
color: #5b6169;
font-size: 13px;
......
......@@ -4,7 +4,7 @@
margin-right: 10px;
border: 1px solid #eee;
white-space: nowrap;
@include border-radius(4px);
border-radius: 4px;
&:hover {
text-decoration: none;
......
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