tests/fixtures/less/buttons.less


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

/*
Your standard form button.

:hover    - Highlights when hovering.
:disabled - Dims the button when disabled.
.primary  - Indicates button is the primary action.
.smaller  - A little bit smaller now.
 
Styleguide 2.1.1.
*/
button, .button {
  padding:5px 15px;

  &.primary, &.primary:hover{
    color:#fff;
  }

  &.smaller{
    font-size:9px;
  }

  &:hover{
    color:#337797;
  }

  &:disabled{
    opacity:0.5;
  }
}

/*
A button suitable for giving stars to someone.
 
.star-given - A highlight indicating you've already given a star.
.disabled   - Dims the button to indicate it cannot be used.

Styleguide 2.2.1.
*/
a.button.star{
  display:inline-block;

  .star{ font-size:10px; }

  &.star-given{
    color:#ae7e00;
  }

  &.disabled{
    opacity:0.5;
  }
}