rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00
Code Issues Actions Packages Releases Activity

redo control icons to use open iconic svgs inlined

Browse Source
This commit is contained in:
Mark Otto 2016-12-04 21:54:45 -08:00
parent d157fcebba
commit 1abe4c83a8
2 changed files with 12 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
scss/_carousel.scss
View File

@ -83,9 +83,9 @@
right: 0; right: 0;
} }
// Toggles // Icons for within
.carousel-control-icon-prev, .carousel-control-prev-icon,
.carousel-control-icon-next { .carousel-control-next-icon {
position: absolute; position: absolute;
top: 50%; top: 50%;
z-index: 5; z-index: 5;
@ -95,25 +95,18 @@
margin-top: -($carousel-icon-width / 2); margin-top: -($carousel-icon-width / 2);
font-family: serif; font-family: serif;
line-height: 1; line-height: 1;
background: transparent no-repeat center center;
background-size: 100% 100%;
} }
.carousel-control-icon-prev { .carousel-control-prev-icon {
left: 50%; left: 50%;
margin-left: -($carousel-icon-width / 2); margin-left: -($carousel-icon-width / 2);
background-image: $carousel-control-prev-icon-bg;
} }
.carousel-control-icon-next { .carousel-control-next-icon {
right: 50%; right: 50%;
margin-right: -($carousel-icon-width / 2); margin-right: -($carousel-icon-width / 2);
} background-image: $carousel-control-next-icon-bg;
.carousel-control-icon-prev {
&::before {
content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
}
}
.carousel-control-icon-next {
&::before {
content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
}
} }

3
scss/_variables.scss
View File

@ -900,6 +900,9 @@ $carousel-caption-color: #fff !default;
$carousel-icon-width: 20px !default; $carousel-icon-width: 20px !default;
$carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M4 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"), "#", "%23") !default;
$carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"), "#", "%23") !default;
// 34. Close // 34. Close