aboutsummaryrefslogtreecommitdiff
path: root/scss/_carousel.scss
AgeCommit message (Collapse)AuthorFilesLines
2020-09-24Carousel enhancements, including .carousel-dark (#31650)Mark Otto1-0/+17
* Replace existing carousel control icons with chevrons from Bootstrap Icons * Add .carousel-dark variant * Test * Add variable for .carousel-dark filter * Update _variables.scss Co-authored-by: XhmikosR <[email protected]>
2020-02-12Shorten if notations so that property order can be appliedMartijn Cuppens1-6/+2
2020-02-12Convert background shorthands to separate propertiesMartijn Cuppens1-1/+3
2019-10-12Carousel variables (#29493)leshasmp1-3/+3
2019-10-01Variable carousel indicator opacity (#29468)astrahov1-2/+2
2019-08-26Update z-indices (#29292)Martijn Cuppens1-2/+1
- `.carousel-caption` doesn't need a z-index. There are no non-static element in its containing block (`.carousel-item`) - The `z-index` of `.carousel-indicators` is way higher than it needs to be (`15`), the highest sibling `z-index` is `1`, so it can be set to `2` to be the top layer.
2019-07-30carousel: fix transition properties order. (#29173)XhmikosR1-1/+1
2019-07-29Change property from background to background-image (#29149)Chandan Deep1-2/+2
For Gradient, We have to use the background-image instead of only background.
2019-07-19Use escape-svg() function (#29077)Martijn Cuppens1-2/+2
* Use escape-svg() function * Update theming.md
2019-05-08Drop all hover mixinsMark Otto1-1/+2
Previously deprecated in v4.x, this clears out the now unused Sass option and removes some unused mixins. Arguably we could remove more, but I like the hover-focus mixin and we make extensive use of it across the project.
2019-01-13Fix background size yMartijn Cuppens1-1/+1
2019-01-13Minify background propertyMartijn Cuppens1-2/+1
2018-12-14Remove redundant brackets (#27768)Martijn Cuppens1-2/+2
2018-11-05Prevent white line in Firefox (regression) (#27594)Martijn Cuppens1-0/+1
2018-11-04Replace touch-action: none with pan-y, remove preventDefault from touch ↵patrickhlauke1-1/+1
event handling
2018-10-31Fix Edge bounce and restore original transition easing (#27279)Martijn Cuppens1-29/+6
2018-10-30Prevent the background to be shown when transitioningMartijn Cuppens1-0/+4
2018-10-21Re-add carousel control transition (#27277)Martijn Cuppens1-3/+2
2018-10-21Carousel fade cleanup (#27278)Martijn Cuppens1-13/+1
2018-10-20Set touch-action to "none"patrickhlauke1-5/+8
Firefox currently seems extremely fickle - with `pan-y` if fires pointercancel as soon as a touch strays even a pixel or so vertically. While `touch-action: pan-y` would be ideal (allowing users to scroll the page even when their finger started the scroll on the carousel), this prevents a swipe that isn't perfectly/only horizontal to be recognised by Firefox.
2018-10-20Use correct touch-action valuespatrickhlauke1-1/+1
- my fault, my original advice of using `touch-action: pan-x` is exactly the value we *don't* want to have the browser handle...
2018-10-20use pointer events if availableJohann-S1-0/+4
2018-08-26Simpler carousel indicators css (#26996)Martijn Cuppens1-22/+6
2018-07-24Carousel indicators transition (#26902)Martijn Cuppens1-2/+4
2018-05-18Fix double-transition bug (#26452)domq1-1/+1
By applying the transition: CSS property only to classes that are active during sliding, we avoid an unnecessary, non-zero-time animation that although mostly invisible, does interfere with e.g. z-index based parallax
2018-04-23Closes #26300: Add cursor pointer to carousel indicatorsVarunram1-0/+1
2018-04-01Tiny grammar and punctuation tweaks to a comment.Tom Swirly1-1/+1
1. It's == "it is" 2. The subject of the sentence is "Only one" (not "these") so the verb must agree with it. Feel free to do nothing with this change, use it, etc - I just saw this while reading through the code.
2018-03-12Replace "loose" HEX values with their respective variables (#25672)Jacob Müller1-2/+2
2018-01-21Feature: Add carousel fade option (#22958)Mark Otto1-2/+46
* Move helpful code comments * Add .carousel-fade option to Sass * Document example of the fade carousel * more logical warning of the .active class on carousel items
2017-10-23Enable stylelint's `function-comma-space-after`. (#24501)XhmikosR1-2/+2
The option is set to `always-single-line` in stylelint-config-standard which we extend.
2017-10-19Gradients and shadows (#24429)Mark Otto1-0/+6
* Update the form focus mixin to use a manual `$enable-shadows` check so we can always ensure a focus state for accessibility and consistency * - Add new `$input-btn-focus-width` and `$input-btn-focus-color` variables. - Replace separate `$btn-focus-box-shadow` and `$input-focus-box-shadow` variables with unified `$input-btn-focus-box-shadow` to match our combined variables approach elsewhere. * Put new focus width var to use in buttons mixins * use new button input-box shadow var * Add a new mixin for quickly adding linear gradient to components when $enable-gradients is set to true * use correct var * fix focus shadows in button mixins * Add opt-in gradients to alerts, buttons, carousel, custom radios and checkboxes, custom file input, and dropdown items * Generate .bg-gradient- utilities * add headings to colors page and document bg-gradient utils * update the button color for active status, check with yiq as it's done for basic state and hover state
2017-07-01Update carousel display settingsMark Otto1-2/+2
Use `display: block` since we're not really using any flex styles on the `.carousel-items` (only their controls and indicators). For the indicators, since moving to `width`, our indicators grow to fill available space, so we need to change `flex: 1 0 auto` to `flex: 0 1 auto` to prevent that.
2017-07-01using max-width in flex: 1 0 auto; in ie11 offsets the center-aligned contentsMark Otto1-1/+1
2017-07-01use @supports to apply transform3d to those who can do it, then provide a ↵Mark Otto1-3/+15
non-3d fallback to ie11
2017-04-08property orderMark Otto1-1/+1
2017-04-08Do not stretch images in carousel-itemPierre-Denis Vanduynslager1-0/+1
2017-04-08Ensure carousel works in IE10/11Mark Otto1-19/+14
- Drops the `if-supports-3d-transforms()` mixin since all our browsers do support it - Updates carousel to not rely on that mixin
2017-01-23Remove `cursor: pointer;` (#21812)Mark Otto1-1/+0
* Remove most of custom cursor: pointer; implementations * turns out that's not so much of a thing
2017-01-01Update carousel comments (#21501)Quy1-3/+3
2016-12-22lintingMark Otto1-2/+2
2016-12-22text-align doesn't apply here, so we can nuke itMark Otto1-1/+0
2016-12-22Redo controls in flexboxMark Otto1-10/+4
- Drops the absolute positioning of the icons within the left/right controls. We have to keep the controls themselves positioned though since we're overlapping HTML elements here. - No more position, left, right, or margins involved; just some justify-content and align-items. - Add some comments for explaining which flex property-value pair does what. - Remove the unapplied font and line-height stuff now that we're all SVGs and flexbox here.
2016-12-22flexbox powered indicatorsMark Otto1-2/+6
This revamps the indicators to use flexbox instead of inline-block for added flexbility (hah). Indicators now automatically scale based on the number of elements present, and max out at the `$carousel-indicator-width` instead of always being that wide.
2016-12-22start small--set flex instead of block for active itemsMark Otto1-1/+1
2016-12-19Add variables for transitions (#21345)Tom Lutzenberger1-1/+1
* Add variables for transitions * Add variables for transitions
2016-12-04drop the .carousel-control base classMark Otto1-1/+2
2016-12-04lintingMark Otto1-1/+1
2016-12-04drop the fixed width of the indicators. instead use the carousel-control ↵Mark Otto1-4/+6
width as margins to ensure content doesn't overlap
2016-12-04rename varMark Otto1-5/+5
2016-12-04there's no font, so rip that varMark Otto1-1/+0