Download as
Browse Code »

Commit b8f6d67b96991e8089fb3b139d4e17994af60b17

Authored by Dmitriy Zaporozhets
1 parent 0be06215
Exists in master and in 4 other branches 6-8-stable, 7-0-stable, 7-0-stable-spb, spb-stable

Restyle buttons

Showing 1 changed file with 75 additions and 53 deletions   Show diff stats
app/assets/stylesheets/gitlab_bootstrap/buttons.scss
  Diff comments   View file @b8f6d67
1 1 .btn {
  2 + display: inline-block;
  3 + padding: 6px 12px;
  4 + margin-bottom: 0;
  5 + font-size: 13px;
  6 + line-height: $baseLineHeight;
  7 + text-align: center;
  8 + vertical-align: middle;
  9 + cursor: pointer;
  10 + border: 1px solid #BBB;
  11 + color: $style_color;
  12 + @include border-radius($baseBorderRadius);
  13 + @include box-shadow(inset 0 1px 0 rgba(255,255,255,.2));
2 14 @include linear-gradient(#f1f1f1, #e1e1e1);
3 15 text-shadow: 0 1px 1px #FFF;
4   - border-color: #BBB;
  16 + text-decoration: none;
5 17  
  18 + &.hover,
6 19 &:hover {
  20 + color: $style_color;
7 21 background: #f1f1f1;
8   - @include linear-gradient(#fAfAfA, #f1f1f1);
9 22 border-color: #AAA;
10   - color: #333;
  23 + text-decoration: none;
  24 + @include linear-gradient(#fAfAfA, #f1f1f1);
11 25 }
12 26  
13   - &.btn-primary {
14   - background: #2a79A3;
15   - @include linear-gradient(#47A7b7, #2585b5);
16   - border-color: #2A79A3;
17   - color: #fff;
18   - text-shadow: 0 1px 1px #268;
19   - &:hover {
20   - background: $primary_color;
21   - color: #fff;
22   - }
23   -
24   - &.disabled {
25   - color: #fff;
26   - background: $primary_color;
27   - }
  27 + &.active,
  28 + &:active {
  29 + background-image: none;
  30 + outline: 0;
  31 + @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15));
28 32 }
29 33  
30   - &.btn-info {
31   - background: #5aB9C3;
32   - border-color: $primary_color;
33   - color: #fff;
34   - text-shadow: 0 1px 1px #268;
35   - &:hover {
36   - background: $primary_color;
37   - color: #fff;
38   - }
  34 + &.disabled,
  35 + &[disabled] {
  36 + cursor: default;
  37 + background-image: none;
  38 + @include opacity(65);
  39 + @include box-shadow(none);
  40 + }
39 41  
40   - &.disabled {
41   - color: #fff;
42   - background: $primary_color;
  42 + &.btn-primary {
  43 + color: #FFF;
  44 + border-color: #189;
  45 + text-shadow: 0 1px 1px #189;
  46 + @include linear-gradient(#4AC, #289);
  47 +
  48 + &.hover,
  49 + &:hover,
  50 + &.disabled,
  51 + &[disabled] {
  52 + color: #FFF;
  53 + background: #389;
43 54 }
44 55 }
45 56  
46 57 &.btn-success {
47   - &:hover {
48   - background: #51a351;
  58 + color: #FFF;
  59 + border-color: #1A1;
  60 + text-shadow: 0 1px 1px #FFF;
  61 + text-shadow: 0 1px 1px #181;
  62 + @include linear-gradient(#62C452, #51a351);
  63 +
  64 +
  65 + &.hover,
  66 + &:hover,
  67 + &.disabled,
  68 + &[disabled] {
  69 + color: #FFF;
  70 + background: #2A2;
49 71 }
  72 + }
  73 +
  74 + &.btn-danger {
  75 + color: #FFF;
  76 + text-shadow: 0 1px 1px #811;
  77 + border-color: #BD362F;
  78 + @include linear-gradient(#EE5F5B, #BD362F);
50 79  
51   - &.disabled {
52   - color: #fff;
53   - background: #2b2;
  80 +
  81 + &.hover,
  82 + &:hover,
  83 + &.disabled,
  84 + &[disabled] {
  85 + color: #FFF;
  86 + background: #A22;
54 87 }
55 88 }
56 89  
  90 + &.btn-new {
  91 + @extend .btn-success;
  92 + }
  93 +
57 94 &.btn-create {
58 95 @extend .wide;
59 96 @extend .btn-success;
... ... @@ -67,12 +104,6 @@
67 104 &.btn-close,
68 105 &.btn-remove {
69 106 @extend .btn-danger;
70   - border-color: #BD362F;
71   -
72   - &:hover {
73   - color: #fff;
74   - background: #EE4E49;
75   - }
76 107 }
77 108  
78 109 &.btn-cancel {
... ... @@ -84,13 +115,9 @@
84 115 padding-right: 20px;
85 116 }
86 117  
87   - &.small {
88   - @extend .btn-small;
89   - }
90   -
91   - &.active {
92   - border-color: #aaa;
93   - background-color: #ccc;
  118 + &.btn-small {
  119 + padding: 2px 10px;
  120 + font-size: 12px;
94 121 }
95 122  
96 123 &.btn-tiny {
... ... @@ -104,9 +131,4 @@
104 131 margin-right: 7px;
105 132 float: left;
106 133 }
107   -
108   - &.padded {
109   - margin-right: 3px;
110   - padding: 4px 10px 4px;
111   - }
112 134 }
... ...