Commit 46a1ca28 authored by Tim Zallmann's avatar Tim Zallmann

Added Stylelint Setup

Added stylelint to static-analysis
Updated yarn dependencies
CSS Fixes and rule adoptions of stylelint
Added stylelint-scss
Deduplicated yarn.lock to clear dependencies

First round of advanced stylelint rules

Mainly Vendor prefix updates related to flex

Updates to more webkit specific vendor prefixes

Finished all vendor specific fixes

Moved now 4 rules to warning

Fixed the new scss lint problems

More stylelint adaptions after rebase
parent 09adc0f6
{ {
"extends": "stylelint-config-recommended", "plugins":[
"plugins": [ "stylelint-scss"
"stylelint-scss" ],
], "rules":{
"rules": { "at-rule-blacklist":[
"no-descending-specificity": null, "debug"
"font-family-no-missing-generic-family-keyword": null, ],
"at-rule-no-unknown": [ true, { "at-rule-no-unknown":null,
ignoreAtRules: ["include", "each", "mixin", "extend", "if", "function", "for", "else", "return"] "at-rule-no-vendor-prefix":true,
}], "block-no-empty":true,
"selector-type-no-unknown": [true, { "block-opening-brace-space-before":"always",
"ignoreTypes": ["gl-emoji"] "color-hex-case":"lower",
}], "color-hex-length":"short",
"unit-no-unknown" : [true, { "color-named":"never",
"ignoreFunctions": ["-webkit-image-set"] "color-no-invalid-hex":true,
}], "declaration-bang-space-after":"never",
"scss/at-extend-no-missing-placeholder": null, "declaration-bang-space-before":"always",
"scss/at-function-pattern": "^[a-z]+([a-z0-9-]+[a-z0-9]+)?$", "declaration-block-semicolon-newline-after":"always",
"scss/at-import-no-partial-leading-underscore": true, "declaration-block-semicolon-space-before":"never",
"scss/at-import-partial-extension-blacklist": ["scss"], "declaration-block-single-line-max-declarations":1,
"scss/at-mixin-pattern": "^[a-z]+([a-z0-9-]+[a-z0-9]+)?$", "declaration-block-trailing-semicolon":"always",
"scss/at-rule-no-unknown": true, "declaration-colon-space-after":"always-single-line",
"scss/dollar-variable-colon-space-after": "always", "declaration-colon-space-before":"never",
"scss/dollar-variable-colon-space-before": "never", "declaration-property-value-blacklist":{
"scss/dollar-variable-pattern": "^[_]?[a-z]+([a-z0-9-]+[a-z0-9]+)?$", "border":[
"scss/percent-placeholder-pattern": "^[a-z]+([a-z0-9-]+[a-z0-9]+)?$", "none"
"scss/selector-no-redundant-nesting-selector": true, ],
} "border-top":[
"none"
],
"border-right":[
"none"
],
"border-bottom":[
"none"
],
"border-left":[
"none"
]
},
"function-comma-space-after":"always-single-line",
"function-parentheses-space-inside":"never",
"function-url-quotes":"always",
"indentation":2,
"length-zero-no-unit":true,
"max-nesting-depth":[
3,
{
"ignoreAtRules":[
"each",
"media",
"supports",
"include"
],
"severity":"warning"
}
],
"media-feature-name-no-vendor-prefix":true,
"media-feature-parentheses-space-inside":"never",
"no-missing-end-of-source-newline":true,
"number-leading-zero":"always",
"number-no-trailing-zeros":true,
"property-no-unknown":true,
"property-no-vendor-prefix":true,
"rule-empty-line-before":[
"always-multi-line",
{
"except":[
"first-nested"
],
"ignore":[
"after-comment"
]
}
],
"scss/at-extend-no-missing-placeholder":[true,{ "severity": "warning" }],
"scss/at-function-pattern":"^[a-z]+([a-z0-9-]+[a-z0-9]+)?$",
"scss/at-import-no-partial-leading-underscore":true,
"scss/at-import-partial-extension-blacklist":[
"scss"
],
"scss/at-mixin-pattern":"^[a-z]+([a-z0-9-]+[a-z0-9]+)?$",
"scss/at-rule-no-unknown":true,
"scss/dollar-variable-colon-space-after":"always",
"scss/dollar-variable-colon-space-before":"never",
"scss/dollar-variable-pattern":"^[_]?[a-z]+([a-z0-9-]+[a-z0-9]+)?$",
"scss/percent-placeholder-pattern":"^[a-z]+([a-z0-9-]+[a-z0-9]+)?$",
"scss/selector-no-redundant-nesting-selector":true,
"selector-class-pattern":[
"^[a-z0-9\\-]+$",
{
"message":"Selector should be written in lowercase with hyphens (selector-class-pattern)",
"severity": "warning"
},
],
"selector-list-comma-newline-after":"always",
"selector-max-compound-selectors":[5, { "severity": "warning" }],
"selector-max-id":1,
"selector-no-vendor-prefix":true,
"selector-pseudo-element-colon-notation":"double",
"selector-pseudo-element-no-unknown":true,
"shorthand-property-no-redundant-values":true,
"string-quotes":"single",
"value-no-vendor-prefix":true
}
} }
...@@ -195,8 +195,7 @@ $item-weight-max-width: 48px; ...@@ -195,8 +195,7 @@ $item-weight-max-width: 48px;
} }
.mr-status-wrapper, .mr-status-wrapper,
.mr-ci-status .mr-ci-status {
{
line-height: 0; line-height: 0;
} }
......
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
&.flipOutY, &.flipOutY,
&.bounceIn, &.bounceIn,
&.bounceOut { &.bounceOut {
@include webkit-prefix(animation-duration, .75s); @include webkit-prefix(animation-duration, 0.75s);
} }
&.short { &.short {
...@@ -73,22 +73,10 @@ ...@@ -73,22 +73,10 @@
@mixin disable-all-animation { @mixin disable-all-animation {
/*CSS transitions*/ /*CSS transitions*/
-o-transition-property: none !important;
-moz-transition-property: none !important;
-ms-transition-property: none !important;
-webkit-transition-property: none !important;
transition-property: none !important; transition-property: none !important;
/*CSS transforms*/ /*CSS transforms*/
-o-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
-webkit-transform: none !important;
transform: none !important; transform: none !important;
/*CSS animations*/ /*CSS animations*/
-webkit-animation: none !important;
-moz-animation: none !important;
-o-animation: none !important;
-ms-animation: none !important;
animation: none !important; animation: none !important;
} }
...@@ -202,7 +190,7 @@ a { ...@@ -202,7 +190,7 @@ a {
} }
} }
[class^="skeleton-line-"] { [class^='skeleton-line-'] {
position: relative; position: relative;
background-color: $gray-100; background-color: $gray-100;
height: 10px; height: 10px;
...@@ -218,13 +206,11 @@ a { ...@@ -218,13 +206,11 @@ a {
animation: blockTextShine 1s linear infinite forwards; animation: blockTextShine 1s linear infinite forwards;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
background-image: linear-gradient( background-image: linear-gradient(to right,
to right, $gray-100 0%,
$gray-100 0%, $gray-50 20%,
$gray-50 20%, $gray-100 40%,
$gray-100 40%, $gray-100 100%);
$gray-100 100%
);
height: 10px; height: 10px;
} }
} }
......
.admonitionblock td.icon { .admonitionblock td.icon {
width: 1%; width: 1%;
[class^="fa icon-"] { [class^='fa icon-'] {
@extend .fa-2x; @extend .fa-2x;
} }
......
...@@ -45,7 +45,6 @@ ...@@ -45,7 +45,6 @@
display: inline-block; display: inline-block;
margin-left: 2px; margin-left: 2px;
flex-shrink: 0; flex-shrink: 0;
-webkit-flex-shrink: 0;
&.s16 { margin-right: 4px; } &.s16 { margin-right: 4px; }
&.s24 { margin-right: 4px; } &.s24 { margin-right: 4px; }
...@@ -74,20 +73,48 @@ ...@@ -74,20 +73,48 @@
background-color: $gray-darker; background-color: $gray-darker;
// Sizes // Sizes
&.s16 { font-size: 12px; line-height: 1.33; } &.s16 { font-size: 12px;
&.s24 { font-size: 13px; line-height: 1.8; } line-height: 1.33; }
&.s26 { font-size: 20px; line-height: 1.33; }
&.s32 { font-size: 20px; line-height: 30px; } &.s24 { font-size: 13px;
&.s40 { font-size: 16px; line-height: 38px; } line-height: 1.8; }
&.s48 { font-size: 20px; line-height: 46px; }
&.s60 { font-size: 32px; line-height: 58px; } &.s26 { font-size: 20px;
&.s64 { font-size: 32px; line-height: 64px; } line-height: 1.33; }
&.s70 { font-size: 34px; line-height: 70px; }
&.s90 { font-size: 36px; line-height: 88px; } &.s32 { font-size: 20px;
&.s100 { font-size: 36px; line-height: 98px; } line-height: 30px; }
&.s110 { font-size: 40px; line-height: 108px; font-weight: $gl-font-weight-normal; }
&.s140 { font-size: 72px; line-height: 138px; } &.s40 { font-size: 16px;
&.s160 { font-size: 96px; line-height: 158px; } line-height: 38px; }
&.s48 { font-size: 20px;
line-height: 46px; }
&.s60 { font-size: 32px;
line-height: 58px; }
&.s64 { font-size: 32px;
line-height: 64px; }
&.s70 { font-size: 34px;
line-height: 70px; }
&.s90 { font-size: 36px;
line-height: 88px; }
&.s100 { font-size: 36px;
line-height: 98px; }
&.s110 { font-size: 40px;
line-height: 108px;
font-weight: $gl-font-weight-normal; }
&.s140 { font-size: 72px;
line-height: 138px; }
&.s160 { font-size: 96px;
line-height: 158px; }
// Background colors // Background colors
&.bg1 { background-color: $identicon-red; } &.bg1 { background-color: $identicon-red; }
...@@ -120,8 +147,11 @@ ...@@ -120,8 +147,11 @@
align-self: center; align-self: center;
} }
&.s40 { min-width: 40px; min-height: 40px; } &.s40 { min-width: 40px;
&.s64 { min-width: 64px; min-height: 64px; } min-height: 40px; }
&.s64 { min-width: 64px;
min-height: 64px; }
} }
.rect-avatar { .rect-avatar {
......
...@@ -23,9 +23,9 @@ ...@@ -23,9 +23,9 @@
box-shadow: 0 6px 12px $award-emoji-menu-shadow; box-shadow: 0 6px 12px $award-emoji-menu-shadow;
pointer-events: none; pointer-events: none;
opacity: 0; opacity: 0;
transform: scale(.2); transform: scale(0.2);
transform-origin: 0 -45px; transform-origin: 0 -45px;
transition: .3s cubic-bezier(.67, .06, .19, 1.44); transition: 0.3s cubic-bezier(0.67, 0.06, 0.19, 1.44);
transition-property: transform, opacity; transition-property: transform, opacity;
&.is-rendered { &.is-rendered {
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
} }
.emoji-search { .emoji-search {
background-image: url("data:image/png;base64,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"); background-image: url('data:image/png;base64,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');
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right 5px center; background-position: right 5px center;
background-size: 16px; background-size: 16px;
...@@ -90,7 +90,7 @@ ...@@ -90,7 +90,7 @@
background: none; background: none;
border: 0; border: 0;
border-radius: $border-radius-base; border-radius: $border-radius-base;
transition: transform .15s cubic-bezier(.3, 0, .2, 2); transition: transform 0.15s cubic-bezier(0.3, 0, 0.2, 2);
&:hover { &:hover {
background-color: transparent; background-color: transparent;
......
...@@ -86,11 +86,8 @@ ...@@ -86,11 +86,8 @@
} }
.block-controls { .block-controls {
display: -webkit-flex;
display: flex; display: flex;
-webkit-justify-content: flex-end;
justify-content: flex-end; justify-content: flex-end;
-webkit-flex: 1;
flex: 1; flex: 1;
.control { .control {
...@@ -153,7 +150,7 @@ ...@@ -153,7 +150,7 @@
display: inline-block; display: inline-block;
margin-left: 5px; margin-left: 5px;
font-size: 18px; font-size: 18px;
color: color("gray"); color: color('gray');
} }
p { p {
...@@ -228,7 +225,6 @@ ...@@ -228,7 +225,6 @@
} }
.group-info { .group-info {
h1 { h1 {
display: inline; display: inline;
font-weight: $gl-font-weight-normal; font-weight: $gl-font-weight-normal;
......
...@@ -395,8 +395,6 @@ ...@@ -395,8 +395,6 @@
cursor: default; cursor: default;
&:active { &:active {
-moz-box-shadow: inset 0 0 0 $white-light;
-webkit-box-shadow: inset 0 0 0 $white-light;
box-shadow: inset 0 0 0 $white-light; box-shadow: inset 0 0 0 $white-light;
} }
} }
......
...@@ -57,7 +57,11 @@ ...@@ -57,7 +57,11 @@
text-decoration: underline; text-decoration: underline;
} }
.hint { font-style: italic; color: $gl-gray-400; } .hint {
font-style: italic;
color: $gl-gray-400;
}
.light { color: $gl-text-color; } .light { color: $gl-text-color; }
.slead { .slead {
...@@ -158,13 +162,14 @@ p.time { ...@@ -158,13 +162,14 @@ p.time {
text-shadow: none; text-shadow: none;
} }
.thin_area { .thin-area {
height: 150px; height: 150px;
} }
// Fix issue with notes & lists creating a bunch of bottom borders. // Fix issue with notes & lists creating a bunch of bottom borders.
li.note { li.note {
img { max-width: 100%; } img { max-width: 100%; }
.note-title { .note-title {
li { li {
border-bottom: 0 !important; border-bottom: 0 !important;
...@@ -335,7 +340,7 @@ img.emoji { ...@@ -335,7 +340,7 @@ img.emoji {
.disabled-content { .disabled-content {
pointer-events: none; pointer-events: none;
opacity: .5; opacity: 0.5;
} }
.break-word { .break-word {
...@@ -400,6 +405,7 @@ img.emoji { ...@@ -400,6 +405,7 @@ img.emoji {
.flex-no-shrink { flex-shrink: 0; } .flex-no-shrink { flex-shrink: 0; }
.ws-initial { white-space: initial; } .ws-initial { white-space: initial; }
.overflow-auto { overflow: auto; } .overflow-auto { overflow: auto; }
.d-flex-center { .d-flex-center {
display: flex; display: flex;
align-items: center; align-items: center;
......
...@@ -2,7 +2,7 @@ gl-emoji { ...@@ -2,7 +2,7 @@ gl-emoji {
font-style: normal; font-style: normal;
display: inline-flex; display: inline-flex;
vertical-align: middle; vertical-align: middle;
font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
font-size: 1.4em; font-size: 1.4em;
line-height: 1em; line-height: 1em;
} }
......
...@@ -50,19 +50,15 @@ ...@@ -50,19 +50,15 @@
} }
.filtered-search-wrapper { .filtered-search-wrapper {
display: -webkit-flex;
display: flex; display: flex;
@include media-breakpoint-down(xs) { @include media-breakpoint-down(xs) {
-webkit-flex-direction: column;
flex-direction: column; flex-direction: column;
} }
.tokens-container { .tokens-container {
display: -webkit-flex;
display: flex; display: flex;
flex: 1; flex: 1;
-webkit-flex: 1;
padding-left: 12px; padding-left: 12px;
position: relative; position: relative;
margin-bottom: 0; margin-bottom: 0;
...@@ -82,21 +78,18 @@ ...@@ -82,21 +78,18 @@
.input-token:only-child, .input-token:only-child,
.input-token:last-child { .input-token:last-child {
flex: 1; flex: 1;
-webkit-flex: 1;
max-width: inherit; max-width: inherit;
} }
} }
.filtered-search-token, .filtered-search-token,
.filtered-search-term { .filtered-search-term {
display: -webkit-flex;
display: flex; display: flex;
flex-shrink: 0; flex-shrink: 0;
margin-top: 4px; margin-top: 4px;
margin-bottom: 4px; margin-bottom: 4px;
.selectable { .selectable {
display: -webkit-flex;
display: flex; display: flex;
} }
...@@ -176,7 +169,6 @@ ...@@ -176,7 +169,6 @@
} }
.scroll-container { .scroll-container {
display: -webkit-flex;
display: flex; display: flex;
overflow-x: auto; overflow-x: auto;
white-space: nowrap; white-space: nowrap;
...@@ -186,7 +178,6 @@ ...@@ -186,7 +178,6 @@
.filtered-search-box { .filtered-search-box {
position: relative; position: relative;
flex: 1; flex: 1;
display: -webkit-flex;
display: flex; display: flex;
width: 100%; width: 100%;
min-width: 0; min-width: 0;
...@@ -194,7 +185,6 @@ ...@@ -194,7 +185,6 @@
background-color: $white-light; background-color: $white-light;
@include media-breakpoint-down(xs) { @include media-breakpoint-down(xs) {
-webkit-flex: 1 1 auto;
flex: 1 1 auto; flex: 1 1 auto;
margin-bottom: 10px; margin-bottom: 10px;
} }
...@@ -349,7 +339,6 @@ ...@@ -349,7 +339,6 @@
} }
.filter-dropdown-container { .filter-dropdown-container {
display: -webkit-flex;
display: flex; display: flex;
.dropdown-toggle { .dropdown-toggle {
......
...@@ -156,8 +156,6 @@ label { ...@@ -156,8 +156,6 @@ label {
.select-control { .select-control {
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; appearance: none;
&::-ms-expand { &::-ms-expand {
...@@ -178,7 +176,8 @@ label { ...@@ -178,7 +176,8 @@ label {
font-weight: $gl-font-weight-normal; font-weight: $gl-font-weight-normal;
} }
.form-control::-webkit-input-placeholder {
.form-control::placeholder {
color: $gl-text-color-tertiary; color: $gl-text-color-tertiary;
} }
......
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
height: $chip-size; height: $chip-size;
background: $white-light; background: $white-light;
background-image: linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%), background-image: linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%),
linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%); linear-gradient(135deg, $gray-dark 25%, transparent 0%, transparent 75%, $gray-dark 0%);
background-size: $bg-size $bg-size; background-size: $bg-size $bg-size;
background-position: 0 0, $bg-pos $bg-pos; background-position: 0 0, $bg-pos $bg-pos;
......
...@@ -39,7 +39,6 @@ ...@@ -39,7 +39,6 @@
.header-content { .header-content {
width: 100%; width: 100%;
display: -webkit-flex;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
position: relative; position: relative;
...@@ -47,11 +46,8 @@ ...@@ -47,11 +46,8 @@
padding-left: 0; padding-left: 0;
.title-container { .title-container {
display: -webkit-flex;
display: flex; display: flex;
-webkit-align-items: stretch;
align-items: stretch; align-items: stretch;
-webkit-flex: 1 1 auto;
flex: 1 1 auto; flex: 1 1 auto;
padding-top: 0; padding-top: 0;
overflow: visible; overflow: visible;
...@@ -60,7 +56,6 @@ ...@@ -60,7 +56,6 @@
.title { .title {
padding-right: 0; padding-right: 0;
color: currentColor; color: currentColor;
display: -webkit-flex;
display: flex; display: flex;
position: relative; position: relative;
margin: 0; margin: 0;
...@@ -85,7 +80,6 @@ ...@@ -85,7 +80,6 @@
} }
a { a {
display: -webkit-flex;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 2px 8px; padding: 2px 8px;
...@@ -173,7 +167,6 @@ ...@@ -173,7 +167,6 @@
.navbar-nav { .navbar-nav {
@include media-breakpoint-down(xs) { @include media-breakpoint-down(xs) {
display: -webkit-flex;
display: flex; display: flex;
padding-right: 10px; padding-right: 10px;
flex-direction: row; flex-direction: row;
...@@ -258,7 +251,6 @@ ...@@ -258,7 +251,6 @@
> li { > li {
> a, > a,
> button { > button {
display: -webkit-flex;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
...@@ -294,7 +286,6 @@ ...@@ -294,7 +286,6 @@
} }
.navbar-sub-nav { .navbar-sub-nav {
display: -webkit-flex;
display: flex; display: flex;
margin: 0 0 0 6px; margin: 0 0 0 6px;
...@@ -326,14 +317,12 @@ ...@@ -326,14 +317,12 @@
} }
.breadcrumbs { .breadcrumbs {
display: -webkit-flex;
display: flex; display: flex;
min-height: $breadcrumb-min-height; min-height: $breadcrumb-min-height;
color: $gl-text-color; color: $gl-text-color;
} }
.breadcrumbs-container { .breadcrumbs-container {
display: -webkit-flex;
display: flex; display: flex;
width: 100%; width: 100%;
position: relative; position: relative;
...@@ -344,7 +333,6 @@ ...@@ -344,7 +333,6 @@
} }
.breadcrumbs-links { .breadcrumbs-links {
-webkit-flex: 1;
flex: 1; flex: 1;
min-width: 0; min-width: 0;
align-self: center; align-self: center;
...@@ -379,7 +367,6 @@ ...@@ -379,7 +367,6 @@
} }
.breadcrumbs-list { .breadcrumbs-list {
display: -webkit-flex;
display: flex; display: flex;
margin-bottom: 0; margin-bottom: 0;
line-height: 16px; line-height: 16px;
...@@ -430,7 +417,6 @@ ...@@ -430,7 +417,6 @@
} }
.breadcrumbs-extra { .breadcrumbs-extra {
display: -webkit-flex;
display: flex; display: flex;
flex: 0 0 auto; flex: 0 0 auto;
margin-left: auto; margin-left: auto;
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
word-wrap: break-word; word-wrap: break-word;
&::after { &::after {
content: " "; content: ' ';
display: table; display: table;
clear: both; clear: both;
} }
...@@ -167,7 +167,7 @@ ul.content-list { ...@@ -167,7 +167,7 @@ ul.content-list {
} }
.no-comments { .no-comments {
opacity: .5; opacity: 0.5;
} }
} }
...@@ -196,8 +196,6 @@ ul.content-list { ...@@ -196,8 +196,6 @@ ul.content-list {
// Content list using flexbox // Content list using flexbox
.flex-list { .flex-list {
.flex-row { .flex-row {
display: -webkit-flex;
display: -ms-flexbox;
display: flex; display: flex;
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
......
...@@ -9,7 +9,6 @@ ...@@ -9,7 +9,6 @@
} }
.tanuki-logo { .tanuki-logo {
.tanuki-left-ear, .tanuki-left-ear,
.tanuki-right-ear, .tanuki-right-ear,
.tanuki-nose { .tanuki-nose {
...@@ -34,7 +33,9 @@ ...@@ -34,7 +33,9 @@
.tanuki-left-cheek { .tanuki-left-cheek {
@include include-keyframes(animate-tanuki-left-cheek) { @include include-keyframes(animate-tanuki-left-cheek) {
0%, 10%, 100% { 0%,
10%,
100% {
fill: lighten($tanuki-yellow, 25%); fill: lighten($tanuki-yellow, 25%);
} }
...@@ -46,11 +47,13 @@ ...@@ -46,11 +47,13 @@
.tanuki-left-eye { .tanuki-left-eye {
@include include-keyframes(animate-tanuki-left-eye) { @include include-keyframes(animate-tanuki-left-eye) {
10%, 80% { 10%,
80% {
fill: $tanuki-orange; fill: $tanuki-orange;
} }
20%, 90% { 20%,
90% {
fill: lighten($tanuki-orange, 25%); fill: lighten($tanuki-orange, 25%);
} }
} }
...@@ -58,11 +61,13 @@ ...@@ -58,11 +61,13 @@
.tanuki-left-ear { .tanuki-left-ear {
@include include-keyframes(animate-tanuki-left-ear) { @include include-keyframes(animate-tanuki-left-ear) {
10%, 80% { 10%,
80% {
fill: $tanuki-red; fill: $tanuki-red;
} }
20%, 90% { 20%,
90% {
fill: lighten($tanuki-red, 25%); fill: lighten($tanuki-red, 25%);
} }
} }
...@@ -70,11 +75,13 @@ ...@@ -70,11 +75,13 @@
.tanuki-nose { .tanuki-nose {
@include include-keyframes(animate-tanuki-nose) { @include include-keyframes(animate-tanuki-nose) {
20%, 70% { 20%,
70% {
fill: $tanuki-red; fill: $tanuki-red;
} }
30%, 80% { 30%,
80% {
fill: lighten($tanuki-red, 25%); fill: lighten($tanuki-red, 25%);
} }
} }
...@@ -82,11 +89,13 @@ ...@@ -82,11 +89,13 @@
.tanuki-right-eye { .tanuki-right-eye {
@include include-keyframes(animate-tanuki-right-eye) { @include include-keyframes(animate-tanuki-right-eye) {
30%, 60% { 30%,
60% {
fill: $tanuki-orange; fill: $tanuki-orange;
} }
40%, 70% { 40%,
70% {
fill: lighten($tanuki-orange, 25%); fill: lighten($tanuki-orange, 25%);
} }
} }
...@@ -94,11 +103,13 @@ ...@@ -94,11 +103,13 @@
.tanuki-right-ear { .tanuki-right-ear {
@include include-keyframes(animate-tanuki-right-ear) { @include include-keyframes(animate-tanuki-right-ear) {
30%, 60% { 30%,
60% {
fill: $tanuki-red; fill: $tanuki-red;
} }
40%, 70% { 40%,
70% {
fill: lighten($tanuki-red, 25%); fill: lighten($tanuki-red, 25%);
} }
} }
......
...@@ -120,16 +120,13 @@ ...@@ -120,16 +120,13 @@
/* http://phrappe.com/css/conditional-css-for-webkit-based-browsers/ */ /* http://phrappe.com/css/conditional-css-for-webkit-based-browsers/ */
@mixin on-webkit-only { @mixin on-webkit-only {
/* stylelint-disable-next-line media-feature-name-no-vendor-prefix */
@media screen and (-webkit-min-device-pixel-ratio: 0) { @media screen and (-webkit-min-device-pixel-ratio: 0) {
@content; @content;
} }
} }
@mixin keyframes($animation-name) { @mixin keyframes($animation-name) {
@-webkit-keyframes #{$animation-name} {
@content;
}
@keyframes #{$animation-name} { @keyframes #{$animation-name} {
@content; @content;
} }
...@@ -169,12 +166,10 @@ ...@@ -169,12 +166,10 @@
width: 43px; width: 43px;
height: 30px; height: 30px;
transition-duration: 0.3s; transition-duration: 0.3s;
-webkit-transform: translateZ(0); transform: translateZ(0);
background: linear-gradient( background: linear-gradient(to $gradient-direction,
to $gradient-direction, $gradient-color 45%,
$gradient-color 45%, rgba($gradient-color, 0.4));
rgba($gradient-color, 0.4)
);
&.scrolling { &.scrolling {
visibility: visible; visibility: visible;
...@@ -270,7 +265,6 @@ ...@@ -270,7 +265,6 @@
border: 1px solid $border-color; border: 1px solid $border-color;
color: $gl-text-color; color: $gl-text-color;
position: sticky; position: sticky;
position: -webkit-sticky;
top: $header-height; top: $header-height;
padding: $grid-size; padding: $grid-size;
......
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
} }
&::after { &::after {
content: "\f078"; content: '\f078';
position: absolute; position: absolute;
z-index: 1; z-index: 1;
text-align: center; text-align: center;
......
...@@ -13,7 +13,6 @@ ...@@ -13,7 +13,6 @@
.card { .card {
.card-header { .card-header {
display: -webkit-flex;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
......
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
background: $gl-gray-400; background: $gl-gray-400;
border-radius: 12px; border-radius: 12px;
padding: 3px; padding: 3px;
transition: all .4s ease; transition: all 0.4s ease;
&::selection, &::selection,
&::before::selection, &::before::selection,
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
left: 0; left: 0;
border-radius: 9px; border-radius: 9px;
background: $feature-toggle-color; background: $feature-toggle-color;
transition: all .2s ease; transition: all 0.2s ease;
&, &,
.toggle-icon-svg { .toggle-icon-svg {
...@@ -135,12 +135,18 @@ ...@@ -135,12 +135,18 @@
} }
@keyframes animate-enabled { @keyframes animate-enabled {
0%, 35% { opacity: 0; } 0%,
35% { opacity: 0; }
100% { opacity: 1; } 100% { opacity: 1; }
} }
@keyframes animate-disabled { @keyframes animate-disabled {
0%, 35% { opacity: 0; } 0%,
35% { opacity: 0; }
100% { opacity: 1; } 100% { opacity: 1; }
} }
} }
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
color: $gl-text-color; color: $gl-text-color;
word-wrap: break-word; word-wrap: break-word;
[dir="auto"] { [dir='auto'] {
text-align: initial; text-align: initial;
} }
...@@ -224,8 +224,8 @@ ...@@ -224,8 +224,8 @@
} }
} }
a[href*="/uploads/"], a[href*='/uploads/'],
a[href*="storage.googleapis.com/google-code-attachments/"] { a[href*='storage.googleapis.com/google-code-attachments/'] {
&::before { &::before {
margin-right: 4px; margin-right: 4px;
...@@ -233,7 +233,7 @@ ...@@ -233,7 +233,7 @@
font-size: inherit; font-size: inherit;
text-rendering: auto; text-rendering: auto;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
content: "\f0c6"; content: '\f0c6';
} }
&:hover::before { &:hover::before {
...@@ -423,6 +423,7 @@ h4 { ...@@ -423,6 +423,7 @@ h4 {
/** /**
* form text input i.e. search bar, comments, forms, etc. * form text input i.e. search bar, comments, forms, etc.
*/ */
/* stylelint-disable selector-no-vendor-prefix */
input, input,
textarea { textarea {
&::-webkit-input-placeholder { &::-webkit-input-placeholder {
...@@ -447,5 +448,6 @@ textarea { ...@@ -447,5 +448,6 @@ textarea {
color: $gl-text-color-tertiary; color: $gl-text-color-tertiary;
} }
} }
/* stylelint-enable */
.lh-100 { line-height: 1; } .lh-100 { line-height: 1; }
...@@ -41,13 +41,13 @@ $t-gray-a-04: rgba($black, 0.04); ...@@ -41,13 +41,13 @@ $t-gray-a-04: rgba($black, 0.04);
$t-gray-a-06: rgba($black, 0.06); $t-gray-a-06: rgba($black, 0.06);
$t-gray-a-08: rgba($black, 0.08); $t-gray-a-08: rgba($black, 0.08);
$gl-gray-100: #dddddd; $gl-gray-100: #ddd;
$gl-gray-200: #cccccc; $gl-gray-200: #ccc;
$gl-gray-350: #aaaaaa; $gl-gray-350: #aaa;
$gl-gray-400: #999999; $gl-gray-400: #999;
$gl-gray-500: #777777; $gl-gray-500: #777;
$gl-gray-600: #666666; $gl-gray-600: #666;
$gl-gray-700: #555555; $gl-gray-700: #555;
$green-50: #f1fdf6; $green-50: #f1fdf6;
$green-100: #dcf5e7; $green-100: #dcf5e7;
...@@ -100,7 +100,7 @@ $red-950: #4b140b; ...@@ -100,7 +100,7 @@ $red-950: #4b140b;
$gray-50: #fafafa; $gray-50: #fafafa;
$gray-100: #f2f2f2; $gray-100: #f2f2f2;
$gray-200: #dfdfdf; $gray-200: #dfdfdf;
$gray-300: #cccccc; $gray-300: #ccc;
$gray-400: #bababa; $gray-400: #bababa;
$gray-500: #a7a7a7; $gray-500: #a7a7a7;
$gray-600: #919191; $gray-600: #919191;
...@@ -323,8 +323,8 @@ $line-select-yellow: #fcf8e7; ...@@ -323,8 +323,8 @@ $line-select-yellow: #fcf8e7;
$line-select-yellow-dark: #f0e2bd; $line-select-yellow-dark: #f0e2bd;
$dark-diff-match-bg: rgba(255, 255, 255, 0.3); $dark-diff-match-bg: rgba(255, 255, 255, 0.3);
$dark-diff-match-color: rgba(255, 255, 255, 0.1); $dark-diff-match-color: rgba(255, 255, 255, 0.1);
$diff-image-info-color: gray; $diff-image-info-color: #808080;
$diff-view-modes-color: gray; $diff-view-modes-color: #808080;
$diff-view-modes-border: #c1c1c1; $diff-view-modes-border: #c1c1c1;
$diff-jagged-border-gradient-color: darken($white-normal, 8%); $diff-jagged-border-gradient-color: darken($white-normal, 8%);
......
...@@ -37,7 +37,7 @@ $h6-font-size: 14px; ...@@ -37,7 +37,7 @@ $h6-font-size: 14px;
$spacer: $grid-size; $spacer: $grid-size;
$spacers: ( $spacers: (
0: 0, 0: 0,
1: ($spacer * .5), 1: ($spacer * 0.5),
2: ($spacer), 2: ($spacer),
3: ($spacer * 2), 3: ($spacer * 2),
4: ($spacer * 3), 4: ($spacer * 3),
......
@import "../framework/variables"; @import '../framework/variables';
@mixin diff-background($background, $idiff, $border) { @mixin diff-background($background, $idiff, $border) {
background: $background; background: $background;
......
.code { .code {
@import "white_base"; @import 'white_base';
} }
/* https://github.com/aahan/pygments-github-style */ /* https://github.com/aahan/pygments-github-style */
@import "./common"; @import './common';
/* /*
* White Syntax Colors * White Syntax Colors
...@@ -37,16 +37,16 @@ $white-kt: #458; ...@@ -37,16 +37,16 @@ $white-kt: #458;
$white-m: #099; $white-m: #099;
$white-s: #d14; $white-s: #d14;
$white-n: #333; $white-n: #333;
$white-na: teal; $white-na: #008080;
$white-nb: #0086b3; $white-nb: #0086b3;
$white-nc: #458; $white-nc: #458;
$white-no: teal; $white-no: #008080;
$white-ni: purple; $white-ni: #800080;
$white-ne: #900; $white-ne: #900;
$white-nf: #900; $white-nf: #900;
$white-nn: #555; $white-nn: #555;
$white-nt: navy; $white-nt: #000080;
$white-nv: teal; $white-nv: #008080;
$white-w: #bbb; $white-w: #bbb;
$white-mf: #099; $white-mf: #099;
$white-mh: #099; $white-mh: #099;
...@@ -64,9 +64,9 @@ $white-sr: #009926; ...@@ -64,9 +64,9 @@ $white-sr: #009926;
$white-s1: #d14; $white-s1: #d14;
$white-ss: #990073; $white-ss: #990073;
$white-bp: #999; $white-bp: #999;
$white-vc: teal; $white-vc: #008080;
$white-vg: teal; $white-vg: #008080;
$white-vi: teal; $white-vi: #008080;
$white-il: #099; $white-il: #099;
$white-gc-color: #999; $white-gc-color: #999;
$white-gc-bg: #eaf2f5; $white-gc-bg: #eaf2f5;
...@@ -77,7 +77,7 @@ $white-gc-bg: #eaf2f5; ...@@ -77,7 +77,7 @@ $white-gc-bg: #eaf2f5;
background-color: $gray-light; background-color: $gray-light;
} }
// Line numbers // Line numbers
.line-numbers, .line-numbers,
.diff-line-num { .diff-line-num {
background-color: $gray-light; background-color: $gray-light;
...@@ -103,7 +103,6 @@ pre.code, ...@@ -103,7 +103,6 @@ pre.code,
// Diff line // Diff line
.line_holder { .line_holder {
&.match .line_content, &.match .line_content,
.new-nonewline.line_content, .new-nonewline.line_content,
.old-nonewline.line_content { .old-nonewline.line_content {
...@@ -201,25 +200,38 @@ pre .hll { ...@@ -201,25 +200,38 @@ pre .hll {
background-color: $white-pre-hll-bg !important; background-color: $white-pre-hll-bg !important;
} }
// Search result highlight // Search result highlight
span.highlight_word { span.highlight_word {
background-color: $white-highlight !important; background-color: $white-highlight !important;
} }
// Links to URLs, emails, or dependencies // Links to URLs, emails, or dependencies
.line a { .line a {
color: $white-nb; color: $white-nb;
} }
.hll { background-color: $white-hll-bg; } .hll { background-color: $white-hll-bg; }
.c { color: $white-c; font-style: italic; }
.err { color: $white-err; background-color: $white-err-bg; } .c { color: $white-c;
font-style: italic; }
.err { color: $white-err;
background-color: $white-err-bg; }
.k { font-weight: $gl-font-weight-bold; } .k { font-weight: $gl-font-weight-bold; }
.o { font-weight: $gl-font-weight-bold; } .o { font-weight: $gl-font-weight-bold; }
.cm { color: $white-cm; font-style: italic; }
.cp { color: $white-cp; font-weight: $gl-font-weight-bold; } .cm { color: $white-cm;
.c1 { color: $white-c1; font-style: italic; } font-style: italic; }
.cs { color: $white-cs; font-weight: $gl-font-weight-bold; font-style: italic; }
.cp { color: $white-cp;
font-weight: $gl-font-weight-bold; }
.c1 { color: $white-c1;
font-style: italic; }
.cs { color: $white-cs;
font-weight: $gl-font-weight-bold;
font-style: italic; }
.gd { .gd {
color: $white-gd; color: $white-gd;
...@@ -248,24 +260,34 @@ span.highlight_word { ...@@ -248,24 +260,34 @@ span.highlight_word {
.go { color: $white-go; } .go { color: $white-go; }
.gp { color: $white-gp; } .gp { color: $white-gp; }
.gs { font-weight: $gl-font-weight-bold; } .gs { font-weight: $gl-font-weight-bold; }
.gu { color: $white-gu; font-weight: $gl-font-weight-bold; }
.gu { color: $white-gu;
font-weight: $gl-font-weight-bold; }
.gt { color: $white-gt; } .gt { color: $white-gt; }
.kc { font-weight: $gl-font-weight-bold; } .kc { font-weight: $gl-font-weight-bold; }
.kd { font-weight: $gl-font-weight-bold; } .kd { font-weight: $gl-font-weight-bold; }
.kn { font-weight: $gl-font-weight-bold; } .kn { font-weight: $gl-font-weight-bold; }
.kp { font-weight: $gl-font-weight-bold; } .kp { font-weight: $gl-font-weight-bold; }
.kr { font-weight: $gl-font-weight-bold; } .kr { font-weight: $gl-font-weight-bold; }
.kt { color: $white-kt; font-weight: $gl-font-weight-bold; }
.kt { color: $white-kt;
font-weight: $gl-font-weight-bold; }
.m { color: $white-m; } .m { color: $white-m; }
.s { color: $white-s; } .s { color: $white-s; }
.n { color: $white-n; } .n { color: $white-n; }
.na { color: $white-na; } .na { color: $white-na; }
.nb { color: $white-nb; } .nb { color: $white-nb; }
.nc { color: $white-nc; font-weight: $gl-font-weight-bold; }
.nc { color: $white-nc;
font-weight: $gl-font-weight-bold; }
.no { color: $white-no; } .no { color: $white-no; }
.ni { color: $white-ni; } .ni { color: $white-ni; }
.ne { color: $white-ne; font-weight: $gl-font-weight-bold; }
.nf { color: $white-nf; font-weight: $gl-font-weight-bold; } .ne { color: $white-ne;
font-weight: $gl-font-weight-bold; }
.nf { color: $white-nf;
font-weight: $gl-font-weight-bold; }
.nn { color: $white-nn; } .nn { color: $white-nn; }
.nt { color: $white-nt; } .nt { color: $white-nt; }
.nv { color: $white-nv; } .nv { color: $white-nv; }
...@@ -291,4 +313,6 @@ span.highlight_word { ...@@ -291,4 +313,6 @@ span.highlight_word {
.vg { color: $white-vg; } .vg { color: $white-vg; }
.vi { color: $white-vi; } .vi { color: $white-vi; }
.il { color: $white-il; } .il { color: $white-il; }
.gc { color: $white-gc-color; background-color: $white-gc-bg; }
.gc { color: $white-gc-color;
background-color: $white-gc-bg; }
@import "framework/variables"; @import 'framework/variables';
// This file is largely copied from `highlight/white.scss`, but modified to // This file is largely copied from `highlight/white.scss`, but modified to
// avoid all descendant selectors (`table td`). This is because the CSS inlining // avoid all descendant selectors (`table td`). This is because the CSS inlining
...@@ -40,16 +40,16 @@ $highlighted-kt: #458; ...@@ -40,16 +40,16 @@ $highlighted-kt: #458;
$highlighted-m: #099; $highlighted-m: #099;
$highlighted-s: #d14; $highlighted-s: #d14;
$highlighted-n: #333; $highlighted-n: #333;
$highlighted-na: teal; $highlighted-na: #008080;
$highlighted-nb: #0086b3; $highlighted-nb: #0086b3;
$highlighted-nc: #458; $highlighted-nc: #458;
$highlighted-no: teal; $highlighted-no: #008080;
$highlighted-ni: purple; $highlighted-ni: #800080;
$highlighted-ne: #900; $highlighted-ne: #900;
$highlighted-nf: #900; $highlighted-nf: #900;
$highlighted-nn: #555; $highlighted-nn: #555;
$highlighted-nt: navy; $highlighted-nt: #000080;
$highlighted-nv: teal; $highlighted-nv: #008080;
$highlighted-w: #bbb; $highlighted-w: #bbb;
$highlighted-mf: #099; $highlighted-mf: #099;
$highlighted-mh: #099; $highlighted-mh: #099;
...@@ -67,9 +67,9 @@ $highlighted-sr: #009926; ...@@ -67,9 +67,9 @@ $highlighted-sr: #009926;
$highlighted-s1: #d14; $highlighted-s1: #d14;
$highlighted-ss: #990073; $highlighted-ss: #990073;
$highlighted-bp: #999; $highlighted-bp: #999;
$highlighted-vc: teal; $highlighted-vc: #008080;
$highlighted-vg: teal; $highlighted-vg: #008080;
$highlighted-vi: teal; $highlighted-vi: #008080;
$highlighted-il: #099; $highlighted-il: #099;
$highlighted-gc: #999; $highlighted-gc: #999;
$highlighted-gc-bg: #eaf2f5; $highlighted-gc-bg: #eaf2f5;
...@@ -151,14 +151,27 @@ span.highlight_word { ...@@ -151,14 +151,27 @@ span.highlight_word {
} }
.hll { background-color: $highlighted-hll-bg; } .hll { background-color: $highlighted-hll-bg; }
.c { color: $highlighted-c; font-style: italic; }
.err { color: $highlighted-err; background-color: $highlighted-err-bg; } .c { color: $highlighted-c;
font-style: italic; }
.err { color: $highlighted-err;
background-color: $highlighted-err-bg; }
.k { font-weight: $gl-font-weight-bold; } .k { font-weight: $gl-font-weight-bold; }
.o { font-weight: $gl-font-weight-bold; } .o { font-weight: $gl-font-weight-bold; }
.cm { color: $highlighted-cm; font-style: italic; }
.cp { color: $highlighted-cp; font-weight: $gl-font-weight-bold; } .cm { color: $highlighted-cm;
.c1 { color: $highlighted-c1; font-style: italic; } font-style: italic; }
.cs { color: $highlighted-cs; font-weight: $gl-font-weight-bold; font-style: italic; }
.cp { color: $highlighted-cp;
font-weight: $gl-font-weight-bold; }
.c1 { color: $highlighted-c1;
font-style: italic; }
.cs { color: $highlighted-cs;
font-weight: $gl-font-weight-bold;
font-style: italic; }
.gd { .gd {
color: $highlighted-gd; color: $highlighted-gd;
...@@ -187,24 +200,34 @@ span.highlight_word { ...@@ -187,24 +200,34 @@ span.highlight_word {
.go { color: $highlighted-go; } .go { color: $highlighted-go; }
.gp { color: $highlighted-gp; } .gp { color: $highlighted-gp; }
.gs { font-weight: $gl-font-weight-bold; } .gs { font-weight: $gl-font-weight-bold; }
.gu { color: $highlighted-gu; font-weight: $gl-font-weight-bold; }
.gu { color: $highlighted-gu;
font-weight: $gl-font-weight-bold; }
.gt { color: $highlighted-gt; } .gt { color: $highlighted-gt; }
.kc { font-weight: $gl-font-weight-bold; } .kc { font-weight: $gl-font-weight-bold; }
.kd { font-weight: $gl-font-weight-bold; } .kd { font-weight: $gl-font-weight-bold; }
.kn { font-weight: $gl-font-weight-bold; } .kn { font-weight: $gl-font-weight-bold; }
.kp { font-weight: $gl-font-weight-bold; } .kp { font-weight: $gl-font-weight-bold; }
.kr { font-weight: $gl-font-weight-bold; } .kr { font-weight: $gl-font-weight-bold; }
.kt { color: $highlighted-kt; font-weight: $gl-font-weight-bold; }
.kt { color: $highlighted-kt;
font-weight: $gl-font-weight-bold; }
.m { color: $highlighted-m; } .m { color: $highlighted-m; }
.s { color: $highlighted-s; } .s { color: $highlighted-s; }
.n { color: $highlighted-n; } .n { color: $highlighted-n; }
.na { color: $highlighted-na; } .na { color: $highlighted-na; }
.nb { color: $highlighted-nb; } .nb { color: $highlighted-nb; }
.nc { color: $highlighted-nc; font-weight: $gl-font-weight-bold; }
.nc { color: $highlighted-nc;
font-weight: $gl-font-weight-bold; }
.no { color: $highlighted-no; } .no { color: $highlighted-no; }
.ni { color: $highlighted-ni; } .ni { color: $highlighted-ni; }
.ne { color: $highlighted-ne; font-weight: $gl-font-weight-bold; }
.nf { color: $highlighted-nf; font-weight: $gl-font-weight-bold; } .ne { color: $highlighted-ne;
font-weight: $gl-font-weight-bold; }
.nf { color: $highlighted-nf;
font-weight: $gl-font-weight-bold; }
.nn { color: $highlighted-nn; } .nn { color: $highlighted-nn; }
.nt { color: $highlighted-nt; } .nt { color: $highlighted-nt; }
.nv { color: $highlighted-nv; } .nv { color: $highlighted-nv; }
...@@ -230,4 +253,6 @@ span.highlight_word { ...@@ -230,4 +253,6 @@ span.highlight_word {
.vg { color: $highlighted-vg; } .vg { color: $highlighted-vg; }
.vi { color: $highlighted-vi; } .vi { color: $highlighted-vi; }
.il { color: $highlighted-il; } .il { color: $highlighted-il; }
.gc { color: $highlighted-gc; background-color: $highlighted-gc-bg; }
.gc { color: $highlighted-gc;
background-color: $highlighted-gc-bg; }
...@@ -6,11 +6,11 @@ ...@@ -6,11 +6,11 @@
$black: #000; $black: #000;
$red: #ea1010; $red: #ea1010;
$green: #009900; $green: #090;
$yellow: #999900; $yellow: #990;
$blue: #0073e6; $blue: #0073e6;
$magenta: #d411d4; $magenta: #d411d4;
$cyan: #009999; $cyan: #099;
$white: #ccc; $white: #ccc;
$l-black: #373b41; $l-black: #373b41;
$l-red: #ff6161; $l-red: #ff6161;
......
...@@ -3,7 +3,6 @@ ...@@ -3,7 +3,6 @@
} }
.user-can-drag { .user-can-drag {
cursor: -webkit-grab;
cursor: grab; cursor: grab;
} }
...@@ -12,12 +11,8 @@ ...@@ -12,12 +11,8 @@
opacity: 1 !important; opacity: 1 !important;
* { * {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none; user-select: none;
// !important to make sure no style can override this when dragging // !important to make sure no style can override this when dragging
cursor: -webkit-grabbing !important;
cursor: grabbing !important; cursor: grabbing !important;
} }
} }
...@@ -501,7 +496,6 @@ ...@@ -501,7 +496,6 @@
} }
.add-issues-modal { .add-issues-modal {
display: -webkit-flex;
display: flex; display: flex;
position: fixed; position: fixed;
top: 0; top: 0;
...@@ -513,9 +507,7 @@ ...@@ -513,9 +507,7 @@
} }
.add-issues-container { .add-issues-container {
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex-direction: column;
flex-direction: column; flex-direction: column;
width: 90vw; width: 90vw;
height: 85vh; height: 85vh;
...@@ -528,16 +520,12 @@ ...@@ -528,16 +520,12 @@
box-shadow: 0 2px 12px rgba($black, 0.5); box-shadow: 0 2px 12px rgba($black, 0.5);
.empty-state { .empty-state {
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex: 1;
flex: 1; flex: 1;
margin-top: 0; margin-top: 0;
&.add-issues-empty-state-filter { &.add-issues-empty-state-filter {
-webkit-flex-direction: column;
flex-direction: column; flex-direction: column;
-webkit-justify-content: center;
justify-content: center; justify-content: center;
} }
...@@ -566,11 +554,9 @@ ...@@ -566,11 +554,9 @@
} }
.add-issues-search { .add-issues-search {
display: -webkit-flex;
display: flex; display: flex;
.issues-filters { .issues-filters {
-webkit-flex: 1;
flex: 1; flex: 1;
} }
} }
...@@ -588,9 +574,7 @@ ...@@ -588,9 +574,7 @@
} }
.add-issues-list { .add-issues-list {
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex: 1;
flex: 1; flex: 1;
padding-top: 3px; padding-top: 3px;
margin-left: -$gl-vert-padding; margin-left: -$gl-vert-padding;
...@@ -609,7 +593,6 @@ ...@@ -609,7 +593,6 @@
} }
.add-issues-list-loading { .add-issues-list-loading {
-webkit-align-self: center;
align-self: center; align-self: center;
width: 100%; width: 100%;
padding-left: $gl-vert-padding; padding-left: $gl-vert-padding;
......
...@@ -342,11 +342,11 @@ ...@@ -342,11 +342,11 @@
} }
&.invalid { &.invalid {
@include status-color($gray-dark, color("gray"), $gray-darkest); @include status-color($gray-dark, color('gray'), $gray-darkest);
border-color: $gray-darkest; border-color: $gray-darkest;
&:not(span):hover { &:not(span):hover {
color: color("gray"); color: color('gray');
} }
} }
} }
......
...@@ -330,7 +330,6 @@ ...@@ -330,7 +330,6 @@
// Custom Styles for stage items // Custom Styles for stage items
.item-build-component { .item-build-component {
.item-title { .item-title {
.icon-build-status { .icon-build-status {
float: left; float: left;
......
...@@ -9,7 +9,6 @@ ...@@ -9,7 +9,6 @@
@media (min-width: map-get($grid-breakpoints, md)) { @media (min-width: map-get($grid-breakpoints, md)) {
$mr-file-header-top: $mr-version-controls-height + $header-height + $mr-tabs-height; $mr-file-header-top: $mr-version-controls-height + $header-height + $mr-tabs-height;
position: -webkit-sticky;
position: sticky; position: sticky;
top: $mr-file-header-top; top: $mr-file-header-top;
z-index: 102; z-index: 102;
...@@ -239,22 +238,18 @@ ...@@ -239,22 +238,18 @@
img { img {
border: 1px solid $white-light; border: 1px solid $white-light;
background-image: linear-gradient( background-image: linear-gradient(45deg,
45deg, $border-color 25%,
$border-color 25%, transparent 25%,
transparent 25%, transparent 75%,
transparent 75%, $border-color 75%,
$border-color 75%, $border-color 100%),
$border-color 100% linear-gradient(45deg,
), $border-color 25%,
linear-gradient( transparent 25%,
45deg, transparent 75%,
$border-color 25%, $border-color 75%,
transparent 25%, $border-color 100%);
transparent 75%,
$border-color 75%,
$border-color 100%
);
background-size: 10px 10px; background-size: 10px 10px;
background-position: 0 0, 5px 5px; background-position: 0 0, 5px 5px;
max-width: 100%; max-width: 100%;
...@@ -510,10 +505,10 @@ ...@@ -510,10 +505,10 @@
.diff-stats { .diff-stats {
align-items: center; align-items: center;
padding: 0 .25rem; padding: 0 0.25rem;
.diff-stats-group { .diff-stats-group {
padding: 0 .25rem; padding: 0 0.25rem;
} }
svg.diff-stats-icon { svg.diff-stats-icon {
...@@ -522,7 +517,7 @@ ...@@ -522,7 +517,7 @@
&.is-compare-versions-header { &.is-compare-versions-header {
.diff-stats-group { .diff-stats-group {
padding: 0 .5rem; padding: 0 0.5rem;
} }
} }
} }
...@@ -726,7 +721,6 @@ ...@@ -726,7 +721,6 @@
} }
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
position: -webkit-sticky;
position: sticky; position: sticky;
top: $header-height; top: $header-height;
background-color: $white-light; background-color: $white-light;
...@@ -834,34 +828,26 @@ ...@@ -834,34 +828,26 @@
width: 100%; width: 100%;
height: 10px; height: 10px;
background-color: $white-light; background-color: $white-light;
background-image: linear-gradient( background-image: linear-gradient(45deg,
45deg, transparent,
transparent, transparent 73%,
transparent 73%, $diff-jagged-border-gradient-color 75%,
$diff-jagged-border-gradient-color 75%, $white-light 80%),
$white-light 80% linear-gradient(225deg,
), transparent,
linear-gradient( transparent 73%,
225deg, $diff-jagged-border-gradient-color 75%,
transparent, $white-light 80%),
transparent 73%, linear-gradient(135deg,
$diff-jagged-border-gradient-color 75%, transparent,
$white-light 80% transparent 73%,
), $diff-jagged-border-gradient-color 75%,
linear-gradient( $white-light 80%),
135deg, linear-gradient(-45deg,
transparent, transparent,
transparent 73%, transparent 73%,
$diff-jagged-border-gradient-color 75%, $diff-jagged-border-gradient-color 75%,
$white-light 80% $white-light 80%);
),
linear-gradient(
-45deg,
transparent,
transparent 73%,
$diff-jagged-border-gradient-color 75%,
$white-light 80%
);
background-position: 5px 5px, 0 5px, 0 5px, 5px 5px; background-position: 5px 5px, 0 5px, 0 5px, 5px 5px;
background-size: 10px 10px; background-size: 10px 10px;
background-repeat: repeat; background-repeat: repeat;
...@@ -904,7 +890,7 @@ ...@@ -904,7 +890,7 @@
} }
} }
.files:not([data-can-create-note="true"]) .frame { .files:not([data-can-create-note='true']) .frame {
cursor: auto; cursor: auto;
} }
...@@ -913,15 +899,14 @@ ...@@ -913,15 +899,14 @@
.btn-transparent.image-diff-overlay-add-comment { .btn-transparent.image-diff-overlay-add-comment {
position: relative; position: relative;
cursor: image-url('illustrations/image_comment_light_cursor.svg') cursor: image-url('illustrations/image_comment_light_cursor.svg')
$image-comment-cursor-left-offset $image-comment-cursor-top-offset, $image-comment-cursor-left-offset $image-comment-cursor-top-offset,
auto; auto;
// Retina cursor // Retina cursor
cursor: -webkit-image-set( // scss-lint:disable DuplicateProperty
image-url('illustrations/image_comment_light_cursor.svg') 1x, cursor: image-set(image-url('illustrations/image_comment_light_cursor.svg') 1x,
image-url('illustrations/image_comment_light_cursor@2x.svg') 2x image-url('illustrations/image_comment_light_cursor@2x.svg') 2x)
) $image-comment-cursor-left-offset $image-comment-cursor-top-offset,
$image-comment-cursor-left-offset $image-comment-cursor-top-offset,
auto; auto;
.comment-indicator { .comment-indicator {
...@@ -1026,7 +1011,6 @@ ...@@ -1026,7 +1011,6 @@
} }
.diff-tree-list { .diff-tree-list {
position: -webkit-sticky;
position: sticky; position: sticky;
$top-pos: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px; $top-pos: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px;
top: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px; top: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px;
......
...@@ -71,12 +71,10 @@ ...@@ -71,12 +71,10 @@
.svg-graph-container-with-grab { .svg-graph-container-with-grab {
cursor: grab; cursor: grab;
cursor: -webkit-grab;
} }
.svg-graph-container-grabbed { .svg-graph-container-grabbed {
cursor: grabbing; cursor: grabbing;
cursor: -webkit-grabbing;
} }
@keyframes flickerAnimation { @keyframes flickerAnimation {
......
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
.key { .key {
@extend .badge.badge-pill; @extend .badge.badge-pill;
background-color: $label-inverse-bg; background-color: $label-inverse-bg;
font: 11px Consolas, "Liberation Mono", Menlo, Courier, monospace; font: 11px Consolas, 'Liberation Mono', Menlo, Courier, monospace;
padding: 3px 5px; padding: 3px 5px;
} }
} }
......
...@@ -136,7 +136,7 @@ ...@@ -136,7 +136,7 @@
color: $blue-800; color: $blue-800;
.avatar { .avatar {
border-color: rgba($gray-normal, .2); border-color: rgba($gray-normal, 0.2);
} }
} }
...@@ -223,7 +223,7 @@ ...@@ -223,7 +223,7 @@
} }
a.edit-link:not([href]):hover { a.edit-link:not([href]):hover {
color: rgba($gray-normal, .2); color: rgba($gray-normal, 0.2);
} }
.lock-edit, // uses same style, different js behaviour .lock-edit, // uses same style, different js behaviour
...@@ -711,14 +711,11 @@ ...@@ -711,14 +711,11 @@
.issuable-list { .issuable-list {
li { li {
.issue-box { .issue-box {
display: -webkit-flex;
display: flex; display: flex;
} }
.issuable-info-container { .issuable-info-container {
-webkit-flex: 1;
flex: 1; flex: 1;
display: flex; display: flex;
padding-right: $gl-padding; padding-right: $gl-padding;
...@@ -813,7 +810,6 @@ ...@@ -813,7 +810,6 @@
.sidebar-collapsed-icon { .sidebar-collapsed-icon {
> .stopwatch-svg { > .stopwatch-svg {
display: inline-block; display: inline-block;
} }
...@@ -871,11 +867,11 @@ ...@@ -871,11 +867,11 @@
} }
.help-state-toggle-enter-active { .help-state-toggle-enter-active {
transition: all .8s ease; transition: all 0.8s ease;
} }
.help-state-toggle-leave-active { .help-state-toggle-leave-active {
transition: all .5s ease; transition: all 0.5s ease;
} }
.help-state-toggle-enter, .help-state-toggle-enter,
......
...@@ -58,8 +58,6 @@ form.edit-issue { ...@@ -58,8 +58,6 @@ form.edit-issue {
} }
ul.related-merge-requests > li { ul.related-merge-requests > li {
display: -ms-flexbox;
display: -webkit-flex;
display: flex; display: flex;
align-items: center; align-items: center;
......
...@@ -95,13 +95,11 @@ ...@@ -95,13 +95,11 @@
.prioritized-labels & { .prioritized-labels & {
box-shadow: 0 1px 2px $issue-boards-card-shadow; box-shadow: 0 1px 2px $issue-boards-card-shadow;
cursor: move; cursor: move;
cursor: -webkit-grab; cursor: grab;
cursor: -moz-grab;
border: 0; border: 0;
&:active { &:active {
cursor: -webkit-grabbing; cursor: grabbing;
cursor: -moz-grabbing;
} }
} }
} }
......
...@@ -120,7 +120,6 @@ ...@@ -120,7 +120,6 @@
} }
.new-session-tabs { .new-session-tabs {
display: -webkit-flex;
display: flex; display: flex;
box-shadow: 0 0 0 1px $border-color; box-shadow: 0 0 0 1px $border-color;
border-top-right-radius: $border-radius-default; border-top-right-radius: $border-radius-default;
...@@ -190,7 +189,7 @@ ...@@ -190,7 +189,7 @@
margin-top: 16px; margin-top: 16px;
} }
input[type="submit"] { input[type='submit'] {
@extend .btn-block; @extend .btn-block;
margin-bottom: 0; margin-bottom: 0;
} }
......
...@@ -27,7 +27,6 @@ ...@@ -27,7 +27,6 @@
.controls { .controls {
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
display: -webkit-flex;
display: flex; display: flex;
} }
......
...@@ -20,81 +20,81 @@ $colors: ( ...@@ -20,81 +20,81 @@ $colors: (
white-header-not-chosen : #f0f0f0, white-header-not-chosen : #f0f0f0,
white-line-not-chosen : $gray-light, white-line-not-chosen : $gray-light,
dark-header-head-neutral : rgba(#3f3, .2), dark-header-head-neutral : rgba(#3f3, 0.2),
dark-line-head-neutral : rgba(#3f3, .1), dark-line-head-neutral : rgba(#3f3, 0.1),
dark-button-head-neutral : #40874f, dark-button-head-neutral : #40874f,
dark-header-head-chosen : rgba(#3f3, .33), dark-header-head-chosen : rgba(#3f3, 0.33),
dark-line-head-chosen : rgba(#3f3, .2), dark-line-head-chosen : rgba(#3f3, 0.2),
dark-button-head-chosen : #258537, dark-button-head-chosen : #258537,
dark-header-origin-neutral : rgba(#2878c9, .4), dark-header-origin-neutral : rgba(#2878c9, 0.4),
dark-line-origin-neutral : rgba(#2878c9, .3), dark-line-origin-neutral : rgba(#2878c9, 0.3),
dark-button-origin-neutral : #2a5c8c, dark-button-origin-neutral : #2a5c8c,
dark-header-origin-chosen : rgba(#2878c9, .6), dark-header-origin-chosen : rgba(#2878c9, 0.6),
dark-line-origin-chosen : rgba(#2878c9, .4), dark-line-origin-chosen : rgba(#2878c9, 0.4),
dark-button-origin-chosen : #1d6cbf, dark-button-origin-chosen : #1d6cbf,
dark-header-not-chosen : rgba(#fff, .25), dark-header-not-chosen : rgba(#fff, 0.25),
dark-line-not-chosen : rgba(#fff, .1), dark-line-not-chosen : rgba(#fff, 0.1),
monokai-header-head-neutral : rgba(#a6e22e, .25), monokai-header-head-neutral : rgba(#a6e22e, 0.25),
monokai-line-head-neutral : rgba(#a6e22e, .1), monokai-line-head-neutral : rgba(#a6e22e, 0.1),
monokai-button-head-neutral : #376b20, monokai-button-head-neutral : #376b20,
monokai-header-head-chosen : rgba(#a6e22e, .4), monokai-header-head-chosen : rgba(#a6e22e, 0.4),
monokai-line-head-chosen : rgba(#a6e22e, .25), monokai-line-head-chosen : rgba(#a6e22e, 0.25),
monokai-button-head-chosen : #39800d, monokai-button-head-chosen : #39800d,
monokai-header-origin-neutral : rgba(#60d9f1, .35), monokai-header-origin-neutral : rgba(#60d9f1, 0.35),
monokai-line-origin-neutral : rgba(#60d9f1, .15), monokai-line-origin-neutral : rgba(#60d9f1, 0.15),
monokai-button-origin-neutral : #38848c, monokai-button-origin-neutral : #38848c,
monokai-header-origin-chosen : rgba(#60d9f1, .5), monokai-header-origin-chosen : rgba(#60d9f1, 0.5),
monokai-line-origin-chosen : rgba(#60d9f1, .35), monokai-line-origin-chosen : rgba(#60d9f1, 0.35),
monokai-button-origin-chosen : #3ea4b2, monokai-button-origin-chosen : #3ea4b2,
monokai-header-not-chosen : rgba(#76715d, .24), monokai-header-not-chosen : rgba(#76715d, 0.24),
monokai-line-not-chosen : rgba(#76715d, .1), monokai-line-not-chosen : rgba(#76715d, 0.1),
solarized-light-header-head-neutral : rgba(#859900, .37), solarized-light-header-head-neutral : rgba(#859900, 0.37),
solarized-light-line-head-neutral : rgba(#859900, .2), solarized-light-line-head-neutral : rgba(#859900, 0.2),
solarized-light-button-head-neutral : #afb262, solarized-light-button-head-neutral : #afb262,
solarized-light-header-head-chosen : rgba(#859900, .5), solarized-light-header-head-chosen : rgba(#859900, 0.5),
solarized-light-line-head-chosen : rgba(#859900, .37), solarized-light-line-head-chosen : rgba(#859900, 0.37),
solarized-light-button-head-chosen : #94993d, solarized-light-button-head-chosen : #94993d,
solarized-light-header-origin-neutral : rgba(#2878c9, .37), solarized-light-header-origin-neutral : rgba(#2878c9, 0.37),
solarized-light-line-origin-neutral : rgba(#2878c9, .15), solarized-light-line-origin-neutral : rgba(#2878c9, 0.15),
solarized-light-button-origin-neutral : #60a1bf, solarized-light-button-origin-neutral : #60a1bf,
solarized-light-header-origin-chosen : rgba(#2878c9, .6), solarized-light-header-origin-chosen : rgba(#2878c9, 0.6),
solarized-light-line-origin-chosen : rgba(#2878c9, .37), solarized-light-line-origin-chosen : rgba(#2878c9, 0.37),
solarized-light-button-origin-chosen : #2482b2, solarized-light-button-origin-chosen : #2482b2,
solarized-light-header-not-chosen : rgba(#839496, .37), solarized-light-header-not-chosen : rgba(#839496, 0.37),
solarized-light-line-not-chosen : rgba(#839496, .2), solarized-light-line-not-chosen : rgba(#839496, 0.2),
solarized-dark-header-head-neutral : rgba(#859900, .35), solarized-dark-header-head-neutral : rgba(#859900, 0.35),
solarized-dark-line-head-neutral : rgba(#859900, .15), solarized-dark-line-head-neutral : rgba(#859900, 0.15),
solarized-dark-button-head-neutral : #376b20, solarized-dark-button-head-neutral : #376b20,
solarized-dark-header-head-chosen : rgba(#859900, .5), solarized-dark-header-head-chosen : rgba(#859900, 0.5),
solarized-dark-line-head-chosen : rgba(#859900, .35), solarized-dark-line-head-chosen : rgba(#859900, 0.35),
solarized-dark-button-head-chosen : #39800d, solarized-dark-button-head-chosen : #39800d,
solarized-dark-header-origin-neutral : rgba(#2878c9, .35), solarized-dark-header-origin-neutral : rgba(#2878c9, 0.35),
solarized-dark-line-origin-neutral : rgba(#2878c9, .15), solarized-dark-line-origin-neutral : rgba(#2878c9, 0.15),
solarized-dark-button-origin-neutral : #086799, solarized-dark-button-origin-neutral : #086799,
solarized-dark-header-origin-chosen : rgba(#2878c9, .6), solarized-dark-header-origin-chosen : rgba(#2878c9, 0.6),
solarized-dark-line-origin-chosen : rgba(#2878c9, .35), solarized-dark-line-origin-chosen : rgba(#2878c9, 0.35),
solarized-dark-button-origin-chosen : #0082cc, solarized-dark-button-origin-chosen : #0082cc,
solarized_dark_header_not_chosen : rgba(#839496, .25), solarized_dark_header_not_chosen : rgba(#839496, 0.25),
solarized_dark_line_not_chosen : rgba(#839496, .15), solarized_dark_line_not_chosen : rgba(#839496, 0.15),
none_header_head_neutral : $gray-normal, none_header_head_neutral : $gray-normal,
none_line_head_neutral : $gray-normal, none_line_head_neutral : $gray-normal,
...@@ -210,26 +210,20 @@ $colors: ( ...@@ -210,26 +210,20 @@ $colors: (
} }
#conflicts { #conflicts {
.white { .white {
@include color-scheme('white') @include color-scheme('white'); }
}
.dark { .dark {
@include color-scheme('dark') @include color-scheme('dark'); }
}
.monokai { .monokai {
@include color-scheme('monokai') @include color-scheme('monokai'); }
}
.solarized-light { .solarized-light {
@include color-scheme('solarized-light') @include color-scheme('solarized-light'); }
}
.solarized-dark { .solarized-dark {
@include color-scheme('solarized-dark') @include color-scheme('solarized-dark'); }
}
.diff-wrap-lines .line_content { .diff-wrap-lines .line_content {
white-space: normal; white-space: normal;
......
...@@ -491,11 +491,9 @@ ...@@ -491,11 +491,9 @@
.merge-request { .merge-request {
padding: 10px 0 10px 15px; padding: 10px 0 10px 15px;
position: relative; position: relative;
display: -webkit-flex;
display: flex; display: flex;
.issuable-info-container { .issuable-info-container {
-webkit-flex: 1;
flex: 1; flex: 1;
} }
...@@ -786,7 +784,6 @@ ...@@ -786,7 +784,6 @@
} }
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
position: -webkit-sticky;
position: sticky; position: sticky;
top: $header-height + $mr-tabs-height; top: $header-height + $mr-tabs-height;
width: 100%; width: 100%;
...@@ -814,7 +811,6 @@ ...@@ -814,7 +811,6 @@
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
position: sticky; position: sticky;
position: -webkit-sticky;
} }
&.affix { &.affix {
......
...@@ -67,18 +67,14 @@ $status-box-line-height: 26px; ...@@ -67,18 +67,14 @@ $status-box-line-height: 26px;
.card-header { .card-header {
line-height: $line-height-base; line-height: $line-height-base;
padding: 14px 16px; padding: 14px 16px;
display: -webkit-flex;
display: flex; display: flex;
.title { .title {
-webkit-flex: 1;
-webkit-flex-grow: 1;
flex: 1; flex: 1;
flex-grow: 2; flex-grow: 2;
} }
.counter { .counter {
-webkit-flex: 1;
flex: 0; flex: 0;
padding-left: 16px; padding-left: 16px;
} }
......
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: $border-radius-base; border-radius: $border-radius-base;
transition: border-color ease-in-out 0.15s, transition: border-color ease-in-out 0.15s,
box-shadow ease-in-out 0.15s; box-shadow ease-in-out 0.15s;
&.is-focused { &.is-focused {
@extend .form-control:focus; @extend .form-control:focus;
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
&.is-dropzone-hover { &.is-dropzone-hover {
border-color: $green-500; border-color: $green-500;
box-shadow: 0 0 2px $black-transparent, box-shadow: 0 0 2px $black-transparent,
0 0 4px $green-500-focus; 0 0 4px $green-500-focus;
.comment-toolbar, .comment-toolbar,
.nav-links { .nav-links {
...@@ -84,9 +84,7 @@ ...@@ -84,9 +84,7 @@
.md-header .nav-links { .md-header .nav-links {
display: flex; display: flex;
display: -webkit-flex;
flex-flow: row wrap; flex-flow: row wrap;
-webkit-flex-flow: row wrap;
width: 100%; width: 100%;
.float-right { .float-right {
...@@ -444,7 +442,7 @@ table { ...@@ -444,7 +442,7 @@ table {
.uploading-error-message { .uploading-error-message {
@include media-breakpoint-down(xs) { @include media-breakpoint-down(xs) {
&::after { &::after {
content: "\a"; content: '\a';
white-space: pre; white-space: pre;
} }
} }
......
...@@ -905,7 +905,6 @@ $note-form-margin-left: 72px; ...@@ -905,7 +905,6 @@ $note-form-margin-left: 72px;
} }
.discussion-filter-container { .discussion-filter-container {
.btn > svg { .btn > svg {
width: $gl-col-padding; width: $gl-col-padding;
height: $gl-col-padding; height: $gl-col-padding;
...@@ -927,7 +926,6 @@ $note-form-margin-left: 72px; ...@@ -927,7 +926,6 @@ $note-form-margin-left: 72px;
//This needs to be deleted when Snippet/Commit comments are convered to Vue //This needs to be deleted when Snippet/Commit comments are convered to Vue
// See https://gitlab.com/gitlab-org/gitlab-ce/issues/53918#note_117038785 // See https://gitlab.com/gitlab-org/gitlab-ce/issues/53918#note_117038785
.unstyled-comments { .unstyled-comments {
.discussion-header { .discussion-header {
padding: $gl-padding; padding: $gl-padding;
border-bottom: 1px solid $border-color; border-bottom: 1px solid $border-color;
......
...@@ -994,7 +994,6 @@ button.mini-pipeline-graph-dropdown-toggle { ...@@ -994,7 +994,6 @@ button.mini-pipeline-graph-dropdown-toggle {
* Top arrow in the dropdown in the mini pipeline graph * Top arrow in the dropdown in the mini pipeline graph
*/ */
.mini-pipeline-graph-dropdown-menu { .mini-pipeline-graph-dropdown-menu {
&::before, &::before,
&::after { &::after {
content: ''; content: '';
......
...@@ -270,11 +270,9 @@ ...@@ -270,11 +270,9 @@
position: static; position: static;
padding: 0 16px; padding: 0 16px;
margin-bottom: 20px; margin-bottom: 20px;
display: -webkit-flex;
display: flex; display: flex;
.btn { .btn {
-webkit-flex-grow: 1;
flex-grow: 1; flex-grow: 1;
&:first-child { &:first-child {
......
...@@ -571,9 +571,7 @@ ...@@ -571,9 +571,7 @@
.import-buttons { .import-buttons {
padding-left: 0; padding-left: 0;
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap; flex-wrap: wrap;
.btn { .btn {
......
...@@ -84,9 +84,7 @@ input[type='checkbox']:hover { ...@@ -84,9 +84,7 @@ input[type='checkbox']:hover {
.search-icon { .search-icon {
transition: color $default-transition-duration; transition: color $default-transition-duration;
-webkit-user-select: none; user-select: none;
-moz-user-select: none;
-ms-user-select: none;
} }
.clear-icon { .clear-icon {
...@@ -185,13 +183,11 @@ input[type='checkbox']:hover { ...@@ -185,13 +183,11 @@ input[type='checkbox']:hover {
.search-holder { .search-holder {
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
display: -webkit-flex;
display: flex; display: flex;
} }
.search-field-holder, .search-field-holder,
.project-filter-form { .project-filter-form {
-webkit-flex: 1 0 auto;
flex: 1 0 auto; flex: 1 0 auto;
position: relative; position: relative;
margin-right: 0; margin-right: 0;
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
border-color: $gl-text-color; border-color: $gl-text-color;
&:not(span):hover { &:not(span):hover {
background-color: rgba($gl-text-color, .07); background-color: rgba($gl-text-color, 0.07);
} }
} }
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
border-color: $gl-text-color-secondary; border-color: $gl-text-color-secondary;
&:not(span):hover { &:not(span):hover {
background-color: rgba($gl-text-color-secondary, .07); background-color: rgba($gl-text-color-secondary, 0.07);
} }
} }
} }
......
...@@ -6,9 +6,7 @@ ...@@ -6,9 +6,7 @@
.todos-list > .todo { .todos-list > .todo {
// workaround because we cannot use border-colapse // workaround because we cannot use border-colapse
border-top: 1px solid transparent; border-top: 1px solid transparent;
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex-direction: row;
flex-direction: row; flex-direction: row;
&:hover { &:hover {
...@@ -29,23 +27,18 @@ ...@@ -29,23 +27,18 @@
.todo-avatar, .todo-avatar,
.todo-actions { .todo-actions {
@include transition(opacity); @include transition(opacity);
-webkit-flex: 0 0 auto;
flex: 0 0 auto; flex: 0 0 auto;
} }
.todo-actions { .todo-actions {
display: -webkit-flex;
display: flex; display: flex;
-webkit-justify-content: center;
justify-content: center; justify-content: center;
-webkit-flex-direction: column;
flex-direction: column; flex-direction: column;
margin-left: 10px; margin-left: 10px;
min-width: 55px; min-width: 55px;
} }
.todo-item { .todo-item {
-webkit-flex: 0 1 100%;
flex: 0 1 100%; flex: 0 1 100%;
min-width: 0; min-width: 0;
} }
...@@ -60,13 +53,13 @@ ...@@ -60,13 +53,13 @@
.todo-avatar, .todo-avatar,
.todo-item { .todo-item {
opacity: .6; opacity: 0.6;
} }
} }
.todo-avatar, .todo-avatar,
.todo-item { .todo-item {
opacity: .2; opacity: 0.2;
} }
.btn { .btn {
...@@ -82,7 +75,6 @@ ...@@ -82,7 +75,6 @@
display: flex; display: flex;
> .title-item { > .title-item {
-webkit-flex: 0 0 auto;
flex: 0 0 auto; flex: 0 0 auto;
margin: 0 2px; margin: 0 2px;
...@@ -96,7 +88,6 @@ ...@@ -96,7 +88,6 @@
} }
.todo-label { .todo-label {
-webkit-flex: 0 1 auto;
flex: 0 1 auto; flex: 0 1 auto;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
...@@ -222,23 +213,19 @@ ...@@ -222,23 +213,19 @@
} }
.todos-empty { .todos-empty {
display: -webkit-flex;
display: flex; display: flex;
-webkit-flex-direction: column;
flex-direction: column; flex-direction: column;
max-width: 900px; max-width: 900px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
-webkit-flex-direction: row;
flex-direction: row; flex-direction: row;
padding-top: 80px; padding-top: 80px;
} }
} }
.todos-empty-content { .todos-empty-content {
-webkit-align-self: center;
align-self: center; align-self: center;
max-width: 480px; max-width: 480px;
margin-right: 20px; margin-right: 20px;
...@@ -252,7 +239,6 @@ ...@@ -252,7 +239,6 @@
@include media-breakpoint-up(sm) { @include media-breakpoint-up(sm) {
width: 300px; width: 300px;
margin-right: 0; margin-right: 0;
-webkit-order: 2;
order: 2; order: 2;
} }
} }
......
...@@ -172,26 +172,6 @@ ...@@ -172,26 +172,6 @@
text-decoration: inherit; text-decoration: inherit;
} }
} }
.tree_commit {
max-width: 320px;
.str-truncated {
max-width: 100%;
}
}
.tree_time_ago {
min-width: 135px;
}
}
.tree_author {
padding-right: 8px;
.commit-author-name {
color: $gl-text-color;
}
} }
.tree-truncated-warning { .tree-truncated-warning {
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
margin-bottom: 15px; margin-bottom: 15px;
&::before { &::before {
content: "Example"; content: 'Example';
color: $ui-dev-kit-example-color; color: $ui-dev-kit-example-color;
} }
} }
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
%p.light %p.light
Paste a machine public key here. Read more about how to generate it Paste a machine public key here. Read more about how to generate it
= link_to 'here', help_page_path('ssh/README') = link_to 'here', help_page_path('ssh/README')
= form.text_area :key, class: 'form-control thin_area', rows: 5 = form.text_area :key, class: 'form-control thin-area', rows: 5
- else - else
= form.label :fingerprint, class: 'col-form-label col-sm-2' = form.label :fingerprint, class: 'col-form-label col-sm-2'
.col-sm-10 .col-sm-10
......
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