mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-11 09:28:27 -04:00
245 lines
5.3 KiB
SCSS
245 lines
5.3 KiB
SCSS
// GOV.UK icons
|
|
|
|
.icon {
|
|
background-position: 0 0;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.icon-calendar {
|
|
width: 27px;
|
|
height: 27px;
|
|
background-image: file-url("icons/icon-calendar.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-calendar-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-download {
|
|
width: 30px;
|
|
height: 39px;
|
|
background-image: file-url("icons/icon-file-download.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-file-download-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-important {
|
|
width: 34px;
|
|
height: 34px;
|
|
background-image: file-url("icons/icon-important.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-important-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-information {
|
|
width: 27px;
|
|
height: 27px;
|
|
background-image: file-url("icons/icon-information.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-information-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-locator {
|
|
width: 26px;
|
|
height: 36px;
|
|
background-image: file-url("icons/icon-locator.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-locator-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-search {
|
|
width: 30px;
|
|
height: 22px;
|
|
background-color: $black;
|
|
background-image: file-url("icons/icon-search.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-search-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
// GOV.UK arrow icons
|
|
.icon-pointer {
|
|
width: 30px;
|
|
height: 19px;
|
|
background-color: $black;
|
|
background-image: file-url("icons/icon-pointer.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-pointer-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-pointer-black {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-pointer-black.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-pointer-black-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
// GOV.UK external link icons
|
|
// TODO (Are these provided by the template?)
|
|
|
|
// GOV.UK step icons
|
|
.icon-step-1 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-1.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-1-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-2 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-2.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-2-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-3 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-3.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-3-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-4 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-4.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-4-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-5 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-5.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-5-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-6 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-6.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-6-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-7 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-7.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-7-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-8 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-8.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-8-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-9 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-9.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-9-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-10 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-10.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-10-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-11 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-11.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-11-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-12 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-12.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-12-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.icon-step-13 {
|
|
width: 23px;
|
|
height: 23px;
|
|
background-image: file-url("icons/icon-steps/icon-step-13.png");
|
|
|
|
@include device-pixel-ratio() {
|
|
background-image: file-url("icons/icon-steps/icon-step-13-2x.png");
|
|
background-size: 100%;
|
|
}
|
|
}
|