darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-23 07:46:23 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1088 from alphagov/fix-tick-cross-ie8

Browse Source 
Fix ticks and crosses on team page in IE8
This commit is contained in:
Chris Hill-Scott
2017-01-23 15:24:23 +00:00
committed by GitHub
parent 6a61fe0674 e56433e1f8
commit e50ca05105
5 changed files with 22 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/images/cross-grey-16px.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 239 B

BIN
app/assets/images/tick-16px.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 213 B

BIN
app/assets/images/tick-white-16px.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 190 B

3
app/assets/stylesheets/components/banner.scss
View File

@@ -30,6 +30,9 @@
.banner-with-tick { .banner-with-tick {
padding: $gutter-half ($gutter + $gutter-half); padding: $gutter-half ($gutter + $gutter-half);
background-image: file-url('tick-white.png'); background-image: file-url('tick-white.png');
@include ie-lte(8) {
background-image: file-url('tick-white-16px.png');
}
background-size: 19px; background-size: 19px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: $gutter-half $gutter-half; background-position: $gutter-half $gutter-half;

20
app/assets/stylesheets/components/tick-cross.scss
View File

@@ -1,23 +1,41 @@
%tick-cross { %tick-cross {
@include core-16; @include core-16;
display: inline-block; display: inline-block;
background-size: 19px 19px; background-size: 19px 19px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 0 0; background-position: 0 0;
padding: 1px 0 0 25px; padding: 1px 0 0 25px;
@include ie-lte(8) {
background-position: 0 3px;
}
} }
.tick-cross { .tick-cross {
&-tick { &-tick {
@extend %tick-cross; @extend %tick-cross;
background-image: file-url('tick.png'); background-image: file-url('tick.png');
@include ie-lte(8) {
background-image: file-url('tick-16px.png');
}
} }
&-cross { &-cross {
@extend %tick-cross; @extend %tick-cross;
background-image: file-url('cross-grey.png');
color: $secondary-text-colour; color: $secondary-text-colour;
background-image: file-url('cross-grey.png');
@include ie-lte(8) {
background-image: file-url('cross-grey-16px.png');
}
} }
&-list { &-list {