aboutsummaryrefslogtreecommitdiffstats
path: root/assets
diff options
context:
space:
mode:
authorMartin Wright <martin@mynameismartin.com>2015-08-06 11:56:16 +0100
committerGareth Rees <gareth@mysociety.org>2015-08-21 11:03:26 +0100
commit582f2f62ca05f7b35d8a7ec155b19201658fc3f6 (patch)
treee46e24113828f6be6bedd54ffec5635a10537535 /assets
parent6d2a9040afeb70fbd347148e2477d147e8f5c60f (diff)
style existing buttons
Diffstat (limited to 'assets')
-rw-r--r--assets/stylesheets/responsive/custom.scss59
1 files changed, 42 insertions, 17 deletions
diff --git a/assets/stylesheets/responsive/custom.scss b/assets/stylesheets/responsive/custom.scss
index cdd6456..88631d1 100644
--- a/assets/stylesheets/responsive/custom.scss
+++ b/assets/stylesheets/responsive/custom.scss
@@ -143,19 +143,21 @@ input.use-datepicker[type=text] {
}
@if $disabled {
opacity: 0.333;
+ transition: none;
&:hover,
&:active,
&:focus {
background-color: inherit;
color: inherit;
cursor: default;
+ transition: none;
}
}
}
@mixin button-primary($args...) {
@include button-base($args...);
- color: #fff;
+ color: $color_white;
background-color: $button-bg;
border: none;
&:hover,
@@ -164,36 +166,36 @@ input.use-datepicker[type=text] {
&:visited:hover,
&:visited:active,
&:visited:focus {
- background-color: darken($button-bg, 10%);
- color: #fff;
+ background-color: darken($button-bg, 10%);
+ color: $color_white;
}
}
@mixin button-secondary($args...) {
@include button-base($args...);
- background-color: $color_light_grey;
+ background-color: desaturate(darken($color_sand, 10%), 5%);
color: $color_black;
font-weight: normal;
&:hover,
&:active,
&:focus {
- color: #333;
- background-color: darken($color_light_grey, 7.5%);
+ color: $color_black;
+ background-color: desaturate(darken($color_sand, 15%), 5%);
color: $color_black;
}
}
@mixin button-tertiary($args...) {
@include button-base($args...);
- background-color: transparent;
- color: #333;
+ background-color: desaturate(darken($color_sand, 5%), 5%);;
+ color: $color_black;
font-weight: normal;
- border: 1px solid #e9e9e9;
+ border: 1px solid desaturate(darken($color_sand, 15%),5%);
&:hover,
&:active,
&:focus {
- background-color: darken(#edece8, 7.5%);
- border: 1px solid #ddd;
+ background-color: darken($color_sand, 7.5%);
+ border: 1px solid desaturate(darken($color_sand, 25%),5%);
}
}
@@ -636,6 +638,14 @@ a.link_to_this {
}
}
+.feed_link_sidebar .link_button_green {
+ @include button-secondary();
+}
+
+.report-this-request {
+ @include button-secondary();
+}
+
/* Status lines and icons */
.icon_waiting_classification,
.icon_waiting_response,
@@ -679,6 +689,12 @@ a.link_to_this {
}
}
+#header_right {
+ .link_button_green {
+ @include button-secondary;
+ }
+}
+
/* User page */
#user_photo_on_profile {
img, #set_photo {
@@ -710,7 +726,6 @@ dt {
}
}
-<<<<<<< HEAD
/* How it works section */
.steps__list {
li {
@@ -751,25 +766,35 @@ dt {
}
.learn-more-foi {
- @extend .button-secondary;
@include respond-min( $main_menu-mobile_menu_cutoff ){
- margin-top: 2em;
+ margin-top: 3em;
+ }
+ a {
+ @include button-secondary;
}
}
-=======
.latest-requests {
.button-secondary {
- @include button-secondary();
+ @include button-secondary;
}
}
->>>>>>> wire up homepage buttons
+
/* Authority page */
.action-bar__follower-count {
padding: 3px;
font-size: 1.1rem;
}
+.action-bar__follow-button {
+ .link_button_green {
+ @include button-secondary();
+ }
+}
+
+.authority__body__sidebar form input[type=submit] {
+ @include button-secondary();
+}
.homepage-hero {
background-color: $color_neutral_dark;