1use crate::{
2 self as gpui, AbsoluteLength, AlignContent, AlignItems, BorderStyle, CursorStyle,
3 DefiniteLength, Display, Fill, FlexDirection, FlexWrap, Font, FontFeatures, FontStyle,
4 FontWeight, GridPlacement, Hsla, JustifyContent, Length, SharedString, StrikethroughStyle,
5 StyleRefinement, TextAlign, TextOverflow, TextStyleRefinement, UnderlineStyle, WhiteSpace, px,
6 relative, rems,
7};
8pub use gpui_macros::{
9 border_style_methods, box_shadow_style_methods, cursor_style_methods, margin_style_methods,
10 overflow_style_methods, padding_style_methods, position_style_methods,
11 visibility_style_methods,
12};
13const ELLIPSIS: SharedString = SharedString::new_static("…");
14
15/// A trait for elements that can be styled.
16/// Use this to opt-in to a utility CSS-like styling API.
17// gate on rust-analyzer so rust-analyzer never needs to expand this macro, it takes up to 10 seconds to expand due to inefficiencies in rust-analyzers proc-macro srv
18#[cfg_attr(
19 all(any(feature = "inspector", debug_assertions), not(rust_analyzer)),
20 gpui_macros::derive_inspector_reflection
21)]
22pub trait Styled: Sized {
23 /// Returns a reference to the style memory of this element.
24 fn style(&mut self) -> &mut StyleRefinement;
25
26 gpui_macros::style_helpers!();
27 gpui_macros::visibility_style_methods!();
28 gpui_macros::margin_style_methods!();
29 gpui_macros::padding_style_methods!();
30 gpui_macros::position_style_methods!();
31 gpui_macros::overflow_style_methods!();
32 gpui_macros::cursor_style_methods!();
33 gpui_macros::border_style_methods!();
34 gpui_macros::box_shadow_style_methods!();
35
36 /// Sets the display type of the element to `block`.
37 /// [Docs](https://tailwindcss.com/docs/display)
38 fn block(mut self) -> Self {
39 self.style().display = Some(Display::Block);
40 self
41 }
42
43 /// Sets the display type of the element to `flex`.
44 /// [Docs](https://tailwindcss.com/docs/display)
45 fn flex(mut self) -> Self {
46 self.style().display = Some(Display::Flex);
47 self
48 }
49
50 /// Sets the display type of the element to `grid`.
51 /// [Docs](https://tailwindcss.com/docs/display)
52 fn grid(mut self) -> Self {
53 self.style().display = Some(Display::Grid);
54 self
55 }
56
57 /// Sets the display type of the element to `none`.
58 /// [Docs](https://tailwindcss.com/docs/display)
59 fn hidden(mut self) -> Self {
60 self.style().display = Some(Display::None);
61 self
62 }
63
64 /// Sets the whitespace of the element to `normal`.
65 /// [Docs](https://tailwindcss.com/docs/whitespace#normal)
66 fn whitespace_normal(mut self) -> Self {
67 self.text_style().white_space = Some(WhiteSpace::Normal);
68 self
69 }
70
71 /// Sets the whitespace of the element to `nowrap`.
72 /// [Docs](https://tailwindcss.com/docs/whitespace#nowrap)
73 fn whitespace_nowrap(mut self) -> Self {
74 self.text_style().white_space = Some(WhiteSpace::Nowrap);
75 self
76 }
77
78 /// Sets the truncate overflowing text with an ellipsis (…) if needed.
79 /// [Docs](https://tailwindcss.com/docs/text-overflow#ellipsis)
80 fn text_ellipsis(mut self) -> Self {
81 self.text_style().text_overflow = Some(TextOverflow::Truncate(ELLIPSIS));
82 self
83 }
84
85 /// Sets the text overflow behavior of the element.
86 fn text_overflow(mut self, overflow: TextOverflow) -> Self {
87 self.text_style().text_overflow = Some(overflow);
88 self
89 }
90
91 /// Set the text alignment of the element.
92 fn text_align(mut self, align: TextAlign) -> Self {
93 self.text_style().text_align = Some(align);
94 self
95 }
96
97 /// Sets the text alignment to left
98 fn text_left(mut self) -> Self {
99 self.text_align(TextAlign::Left)
100 }
101
102 /// Sets the text alignment to center
103 fn text_center(mut self) -> Self {
104 self.text_align(TextAlign::Center)
105 }
106
107 /// Sets the text alignment to right
108 fn text_right(mut self) -> Self {
109 self.text_align(TextAlign::Right)
110 }
111
112 /// Sets the truncate to prevent text from wrapping and truncate overflowing text with an ellipsis (…) if needed.
113 /// [Docs](https://tailwindcss.com/docs/text-overflow#truncate)
114 fn truncate(mut self) -> Self {
115 self.overflow_hidden().whitespace_nowrap().text_ellipsis()
116 }
117
118 /// Sets number of lines to show before truncating the text.
119 /// [Docs](https://tailwindcss.com/docs/line-clamp)
120 fn line_clamp(mut self, lines: usize) -> Self {
121 let mut text_style = self.text_style();
122 text_style.line_clamp = Some(lines);
123 self.overflow_hidden()
124 }
125
126 /// Sets the flex direction of the element to `column`.
127 /// [Docs](https://tailwindcss.com/docs/flex-direction#column)
128 fn flex_col(mut self) -> Self {
129 self.style().flex_direction = Some(FlexDirection::Column);
130 self
131 }
132
133 /// Sets the flex direction of the element to `column-reverse`.
134 /// [Docs](https://tailwindcss.com/docs/flex-direction#column-reverse)
135 fn flex_col_reverse(mut self) -> Self {
136 self.style().flex_direction = Some(FlexDirection::ColumnReverse);
137 self
138 }
139
140 /// Sets the flex direction of the element to `row`.
141 /// [Docs](https://tailwindcss.com/docs/flex-direction#row)
142 fn flex_row(mut self) -> Self {
143 self.style().flex_direction = Some(FlexDirection::Row);
144 self
145 }
146
147 /// Sets the flex direction of the element to `row-reverse`.
148 /// [Docs](https://tailwindcss.com/docs/flex-direction#row-reverse)
149 fn flex_row_reverse(mut self) -> Self {
150 self.style().flex_direction = Some(FlexDirection::RowReverse);
151 self
152 }
153
154 /// Sets the element to allow a flex item to grow and shrink as needed, ignoring its initial size.
155 /// [Docs](https://tailwindcss.com/docs/flex#flex-1)
156 fn flex_1(mut self) -> Self {
157 self.style().flex_grow = Some(1.);
158 self.style().flex_shrink = Some(1.);
159 self.style().flex_basis = Some(relative(0.).into());
160 self
161 }
162
163 /// Sets the element to allow a flex item to grow and shrink, taking into account its initial size.
164 /// [Docs](https://tailwindcss.com/docs/flex#auto)
165 fn flex_auto(mut self) -> Self {
166 self.style().flex_grow = Some(1.);
167 self.style().flex_shrink = Some(1.);
168 self.style().flex_basis = Some(Length::Auto);
169 self
170 }
171
172 /// Sets the element to allow a flex item to shrink but not grow, taking into account its initial size.
173 /// [Docs](https://tailwindcss.com/docs/flex#initial)
174 fn flex_initial(mut self) -> Self {
175 self.style().flex_grow = Some(0.);
176 self.style().flex_shrink = Some(1.);
177 self.style().flex_basis = Some(Length::Auto);
178 self
179 }
180
181 /// Sets the element to prevent a flex item from growing or shrinking.
182 /// [Docs](https://tailwindcss.com/docs/flex#none)
183 fn flex_none(mut self) -> Self {
184 self.style().flex_grow = Some(0.);
185 self.style().flex_shrink = Some(0.);
186 self
187 }
188
189 /// Sets the initial size of flex items for this element.
190 /// [Docs](https://tailwindcss.com/docs/flex-basis)
191 fn flex_basis(mut self, basis: impl Into<Length>) -> Self {
192 self.style().flex_basis = Some(basis.into());
193 self
194 }
195
196 /// Sets the element to allow a flex item to grow to fill any available space.
197 /// [Docs](https://tailwindcss.com/docs/flex-grow)
198 fn flex_grow(mut self) -> Self {
199 self.style().flex_grow = Some(1.);
200 self
201 }
202
203 /// Sets the element to allow a flex item to shrink if needed.
204 /// [Docs](https://tailwindcss.com/docs/flex-shrink)
205 fn flex_shrink(mut self) -> Self {
206 self.style().flex_shrink = Some(1.);
207 self
208 }
209
210 /// Sets the element to prevent a flex item from shrinking.
211 /// [Docs](https://tailwindcss.com/docs/flex-shrink#dont-shrink)
212 fn flex_shrink_0(mut self) -> Self {
213 self.style().flex_shrink = Some(0.);
214 self
215 }
216
217 /// Sets the element to allow flex items to wrap.
218 /// [Docs](https://tailwindcss.com/docs/flex-wrap#wrap-normally)
219 fn flex_wrap(mut self) -> Self {
220 self.style().flex_wrap = Some(FlexWrap::Wrap);
221 self
222 }
223
224 /// Sets the element wrap flex items in the reverse direction.
225 /// [Docs](https://tailwindcss.com/docs/flex-wrap#wrap-reversed)
226 fn flex_wrap_reverse(mut self) -> Self {
227 self.style().flex_wrap = Some(FlexWrap::WrapReverse);
228 self
229 }
230
231 /// Sets the element to prevent flex items from wrapping, causing inflexible items to overflow the container if necessary.
232 /// [Docs](https://tailwindcss.com/docs/flex-wrap#dont-wrap)
233 fn flex_nowrap(mut self) -> Self {
234 self.style().flex_wrap = Some(FlexWrap::NoWrap);
235 self
236 }
237
238 /// Sets the element to align flex items to the start of the container's cross axis.
239 /// [Docs](https://tailwindcss.com/docs/align-items#start)
240 fn items_start(mut self) -> Self {
241 self.style().align_items = Some(AlignItems::FlexStart);
242 self
243 }
244
245 /// Sets the element to align flex items to the end of the container's cross axis.
246 /// [Docs](https://tailwindcss.com/docs/align-items#end)
247 fn items_end(mut self) -> Self {
248 self.style().align_items = Some(AlignItems::FlexEnd);
249 self
250 }
251
252 /// Sets the element to align flex items along the center of the container's cross axis.
253 /// [Docs](https://tailwindcss.com/docs/align-items#center)
254 fn items_center(mut self) -> Self {
255 self.style().align_items = Some(AlignItems::Center);
256 self
257 }
258
259 /// Sets the element to align flex items along the baseline of the container's cross axis.
260 /// [Docs](https://tailwindcss.com/docs/align-items#baseline)
261 fn items_baseline(mut self) -> Self {
262 self.style().align_items = Some(AlignItems::Baseline);
263 self
264 }
265
266 /// Sets the element to justify flex items against the start of the container's main axis.
267 /// [Docs](https://tailwindcss.com/docs/justify-content#start)
268 fn justify_start(mut self) -> Self {
269 self.style().justify_content = Some(JustifyContent::Start);
270 self
271 }
272
273 /// Sets the element to justify flex items against the end of the container's main axis.
274 /// [Docs](https://tailwindcss.com/docs/justify-content#end)
275 fn justify_end(mut self) -> Self {
276 self.style().justify_content = Some(JustifyContent::End);
277 self
278 }
279
280 /// Sets the element to justify flex items along the center of the container's main axis.
281 /// [Docs](https://tailwindcss.com/docs/justify-content#center)
282 fn justify_center(mut self) -> Self {
283 self.style().justify_content = Some(JustifyContent::Center);
284 self
285 }
286
287 /// Sets the element to justify flex items along the container's main axis
288 /// such that there is an equal amount of space between each item.
289 /// [Docs](https://tailwindcss.com/docs/justify-content#space-between)
290 fn justify_between(mut self) -> Self {
291 self.style().justify_content = Some(JustifyContent::SpaceBetween);
292 self
293 }
294
295 /// Sets the element to justify items along the container's main axis such
296 /// that there is an equal amount of space on each side of each item.
297 /// [Docs](https://tailwindcss.com/docs/justify-content#space-around)
298 fn justify_around(mut self) -> Self {
299 self.style().justify_content = Some(JustifyContent::SpaceAround);
300 self
301 }
302
303 /// Sets the element to justify items along the container's main axis such
304 /// that there is an equal amount of space around each item, but also
305 /// accounting for the doubling of space you would normally see between
306 /// each item when using justify-around.
307 /// [Docs](https://tailwindcss.com/docs/justify-content#space-evenly)
308 fn justify_evenly(mut self) -> Self {
309 self.style().justify_content = Some(JustifyContent::SpaceEvenly);
310 self
311 }
312
313 /// Sets the element to pack content items in their default position as if no align-content value was set.
314 /// [Docs](https://tailwindcss.com/docs/align-content#normal)
315 fn content_normal(mut self) -> Self {
316 self.style().align_content = None;
317 self
318 }
319
320 /// Sets the element to pack content items in the center of the container's cross axis.
321 /// [Docs](https://tailwindcss.com/docs/align-content#center)
322 fn content_center(mut self) -> Self {
323 self.style().align_content = Some(AlignContent::Center);
324 self
325 }
326
327 /// Sets the element to pack content items against the start of the container's cross axis.
328 /// [Docs](https://tailwindcss.com/docs/align-content#start)
329 fn content_start(mut self) -> Self {
330 self.style().align_content = Some(AlignContent::FlexStart);
331 self
332 }
333
334 /// Sets the element to pack content items against the end of the container's cross axis.
335 /// [Docs](https://tailwindcss.com/docs/align-content#end)
336 fn content_end(mut self) -> Self {
337 self.style().align_content = Some(AlignContent::FlexEnd);
338 self
339 }
340
341 /// Sets the element to pack content items along the container's cross axis
342 /// such that there is an equal amount of space between each item.
343 /// [Docs](https://tailwindcss.com/docs/align-content#space-between)
344 fn content_between(mut self) -> Self {
345 self.style().align_content = Some(AlignContent::SpaceBetween);
346 self
347 }
348
349 /// Sets the element to pack content items along the container's cross axis
350 /// such that there is an equal amount of space on each side of each item.
351 /// [Docs](https://tailwindcss.com/docs/align-content#space-around)
352 fn content_around(mut self) -> Self {
353 self.style().align_content = Some(AlignContent::SpaceAround);
354 self
355 }
356
357 /// Sets the element to pack content items along the container's cross axis
358 /// such that there is an equal amount of space between each item.
359 /// [Docs](https://tailwindcss.com/docs/align-content#space-evenly)
360 fn content_evenly(mut self) -> Self {
361 self.style().align_content = Some(AlignContent::SpaceEvenly);
362 self
363 }
364
365 /// Sets the element to allow content items to fill the available space along the container's cross axis.
366 /// [Docs](https://tailwindcss.com/docs/align-content#stretch)
367 fn content_stretch(mut self) -> Self {
368 self.style().align_content = Some(AlignContent::Stretch);
369 self
370 }
371
372 /// Sets the background color of the element.
373 fn bg<F>(mut self, fill: F) -> Self
374 where
375 F: Into<Fill>,
376 Self: Sized,
377 {
378 self.style().background = Some(fill.into());
379 self
380 }
381
382 /// Sets the border style of the element.
383 fn border_dashed(mut self) -> Self {
384 self.style().border_style = Some(BorderStyle::Dashed);
385 self
386 }
387
388 /// Returns a mutable reference to the text style that has been configured on this element.
389 fn text_style(&mut self) -> &mut TextStyleRefinement {
390 let style: &mut StyleRefinement = self.style();
391 &mut style.text
392 }
393
394 /// Sets the text color of this element.
395 ///
396 /// This value cascades to its child elements.
397 fn text_color(mut self, color: impl Into<Hsla>) -> Self {
398 self.text_style().color = Some(color.into());
399 self
400 }
401
402 /// Sets the font weight of this element
403 ///
404 /// This value cascades to its child elements.
405 fn font_weight(mut self, weight: FontWeight) -> Self {
406 self.text_style().font_weight = Some(weight);
407 self
408 }
409
410 /// Sets the background color of this element.
411 ///
412 /// This value cascades to its child elements.
413 fn text_bg(mut self, bg: impl Into<Hsla>) -> Self {
414 self.text_style().background_color = Some(bg.into());
415 self
416 }
417
418 /// Sets the text size of this element.
419 ///
420 /// This value cascades to its child elements.
421 fn text_size(mut self, size: impl Into<AbsoluteLength>) -> Self {
422 self.text_style().font_size = Some(size.into());
423 self
424 }
425
426 /// Sets the text size to 'extra small'.
427 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
428 fn text_xs(mut self) -> Self {
429 self.text_style().font_size = Some(rems(0.75).into());
430 self
431 }
432
433 /// Sets the text size to 'small'.
434 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
435 fn text_sm(mut self) -> Self {
436 self.text_style().font_size = Some(rems(0.875).into());
437 self
438 }
439
440 /// Sets the text size to 'base'.
441 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
442 fn text_base(mut self) -> Self {
443 self.text_style().font_size = Some(rems(1.0).into());
444 self
445 }
446
447 /// Sets the text size to 'large'.
448 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
449 fn text_lg(mut self) -> Self {
450 self.text_style().font_size = Some(rems(1.125).into());
451 self
452 }
453
454 /// Sets the text size to 'extra large'.
455 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
456 fn text_xl(mut self) -> Self {
457 self.text_style().font_size = Some(rems(1.25).into());
458 self
459 }
460
461 /// Sets the text size to 'extra extra large'.
462 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
463 fn text_2xl(mut self) -> Self {
464 self.text_style().font_size = Some(rems(1.5).into());
465 self
466 }
467
468 /// Sets the text size to 'extra extra extra large'.
469 /// [Docs](https://tailwindcss.com/docs/font-size#setting-the-font-size)
470 fn text_3xl(mut self) -> Self {
471 self.text_style().font_size = Some(rems(1.875).into());
472 self
473 }
474
475 /// Sets the font style of the element to italic.
476 /// [Docs](https://tailwindcss.com/docs/font-style#italicizing-text)
477 fn italic(mut self) -> Self {
478 self.text_style().font_style = Some(FontStyle::Italic);
479 self
480 }
481
482 /// Sets the font style of the element to normal (not italic).
483 /// [Docs](https://tailwindcss.com/docs/font-style#displaying-text-normally)
484 fn not_italic(mut self) -> Self {
485 self.text_style().font_style = Some(FontStyle::Normal);
486 self
487 }
488
489 /// Sets the text decoration to underline.
490 /// [Docs](https://tailwindcss.com/docs/text-decoration-line#underling-text)
491 fn underline(mut self) -> Self {
492 let style = self.text_style();
493 style.underline = Some(UnderlineStyle {
494 thickness: px(1.),
495 ..Default::default()
496 });
497 self
498 }
499
500 /// Sets the decoration of the text to have a line through it.
501 /// [Docs](https://tailwindcss.com/docs/text-decoration-line#adding-a-line-through-text)
502 fn line_through(mut self) -> Self {
503 let style = self.text_style();
504 style.strikethrough = Some(StrikethroughStyle {
505 thickness: px(1.),
506 ..Default::default()
507 });
508 self
509 }
510
511 /// Removes the text decoration on this element.
512 ///
513 /// This value cascades to its child elements.
514 fn text_decoration_none(mut self) -> Self {
515 self.text_style().underline = None;
516 self
517 }
518
519 /// Sets the color for the underline on this element
520 fn text_decoration_color(mut self, color: impl Into<Hsla>) -> Self {
521 let style = self.text_style();
522 let underline = style.underline.get_or_insert_with(Default::default);
523 underline.color = Some(color.into());
524 self
525 }
526
527 /// Sets the text decoration style to a solid line.
528 /// [Docs](https://tailwindcss.com/docs/text-decoration-style)
529 fn text_decoration_solid(mut self) -> Self {
530 let style = self.text_style();
531 let underline = style.underline.get_or_insert_with(Default::default);
532 underline.wavy = false;
533 self
534 }
535
536 /// Sets the text decoration style to a wavy line.
537 /// [Docs](https://tailwindcss.com/docs/text-decoration-style)
538 fn text_decoration_wavy(mut self) -> Self {
539 let style = self.text_style();
540 let underline = style.underline.get_or_insert_with(Default::default);
541 underline.wavy = true;
542 self
543 }
544
545 /// Sets the text decoration to be 0px thick.
546 /// [Docs](https://tailwindcss.com/docs/text-decoration-thickness)
547 fn text_decoration_0(mut self) -> Self {
548 let style = self.text_style();
549 let underline = style.underline.get_or_insert_with(Default::default);
550 underline.thickness = px(0.);
551 self
552 }
553
554 /// Sets the text decoration to be 1px thick.
555 /// [Docs](https://tailwindcss.com/docs/text-decoration-thickness)
556 fn text_decoration_1(mut self) -> Self {
557 let style = self.text_style();
558 let underline = style.underline.get_or_insert_with(Default::default);
559 underline.thickness = px(1.);
560 self
561 }
562
563 /// Sets the text decoration to be 2px thick.
564 /// [Docs](https://tailwindcss.com/docs/text-decoration-thickness)
565 fn text_decoration_2(mut self) -> Self {
566 let style = self.text_style();
567 let underline = style.underline.get_or_insert_with(Default::default);
568 underline.thickness = px(2.);
569 self
570 }
571
572 /// Sets the text decoration to be 4px thick.
573 /// [Docs](https://tailwindcss.com/docs/text-decoration-thickness)
574 fn text_decoration_4(mut self) -> Self {
575 let style = self.text_style();
576 let underline = style.underline.get_or_insert_with(Default::default);
577 underline.thickness = px(4.);
578 self
579 }
580
581 /// Sets the text decoration to be 8px thick.
582 /// [Docs](https://tailwindcss.com/docs/text-decoration-thickness)
583 fn text_decoration_8(mut self) -> Self {
584 let style = self.text_style();
585 let underline = style.underline.get_or_insert_with(Default::default);
586 underline.thickness = px(8.);
587 self
588 }
589
590 /// Sets the font family of this element and its children.
591 fn font_family(mut self, family_name: impl Into<SharedString>) -> Self {
592 self.text_style().font_family = Some(family_name.into());
593 self
594 }
595
596 /// Sets the font features of this element and its children.
597 fn font_features(mut self, features: FontFeatures) -> Self {
598 self.text_style().font_features = Some(features);
599 self
600 }
601
602 /// Sets the font of this element and its children.
603 fn font(mut self, font: Font) -> Self {
604 let Font {
605 family,
606 features,
607 fallbacks,
608 weight,
609 style,
610 } = font;
611
612 let text_style = self.text_style();
613 text_style.font_family = Some(family);
614 text_style.font_features = Some(features);
615 text_style.font_weight = Some(weight);
616 text_style.font_style = Some(style);
617 text_style.font_fallbacks = fallbacks;
618
619 self
620 }
621
622 /// Sets the line height of this element and its children.
623 fn line_height(mut self, line_height: impl Into<DefiniteLength>) -> Self {
624 self.text_style().line_height = Some(line_height.into());
625 self
626 }
627
628 /// Sets the opacity of this element and its children.
629 fn opacity(mut self, opacity: f32) -> Self {
630 self.style().opacity = Some(opacity);
631 self
632 }
633
634 /// Sets the grid columns of this element.
635 fn grid_cols(mut self, cols: u16) -> Self {
636 self.style().grid_cols = Some(cols);
637 self
638 }
639
640 /// Sets the grid rows of this element.
641 fn grid_rows(mut self, rows: u16) -> Self {
642 self.style().grid_rows = Some(rows);
643 self
644 }
645
646 /// Sets the column start of this element.
647 fn col_start(mut self, start: i16) -> Self {
648 let grid_location = self.style().grid_location_mut();
649 grid_location.column.start = GridPlacement::Line(start);
650 self
651 }
652
653 /// Sets the column start of this element to auto.
654 fn col_start_auto(mut self) -> Self {
655 let grid_location = self.style().grid_location_mut();
656 grid_location.column.start = GridPlacement::Auto;
657 self
658 }
659
660 /// Sets the column end of this element.
661 fn col_end(mut self, end: i16) -> Self {
662 let grid_location = self.style().grid_location_mut();
663 grid_location.column.end = GridPlacement::Line(end);
664 self
665 }
666
667 /// Sets the column end of this element to auto.
668 fn col_end_auto(mut self) -> Self {
669 let grid_location = self.style().grid_location_mut();
670 grid_location.column.end = GridPlacement::Auto;
671 self
672 }
673
674 /// Sets the column span of this element.
675 fn col_span(mut self, span: u16) -> Self {
676 let grid_location = self.style().grid_location_mut();
677 grid_location.column = GridPlacement::Span(span)..GridPlacement::Span(span);
678 self
679 }
680
681 /// Sets the row span of this element.
682 fn col_span_full(mut self) -> Self {
683 let grid_location = self.style().grid_location_mut();
684 grid_location.column = GridPlacement::Line(1)..GridPlacement::Line(-1);
685 self
686 }
687
688 /// Sets the row start of this element.
689 fn row_start(mut self, start: i16) -> Self {
690 let grid_location = self.style().grid_location_mut();
691 grid_location.row.start = GridPlacement::Line(start);
692 self
693 }
694
695 /// Sets the row start of this element to "auto"
696 fn row_start_auto(mut self) -> Self {
697 let grid_location = self.style().grid_location_mut();
698 grid_location.row.start = GridPlacement::Auto;
699 self
700 }
701
702 /// Sets the row end of this element.
703 fn row_end(mut self, end: i16) -> Self {
704 let grid_location = self.style().grid_location_mut();
705 grid_location.row.end = GridPlacement::Line(end);
706 self
707 }
708
709 /// Sets the row end of this element to "auto"
710 fn row_end_auto(mut self) -> Self {
711 let grid_location = self.style().grid_location_mut();
712 grid_location.row.end = GridPlacement::Auto;
713 self
714 }
715
716 /// Sets the row span of this element.
717 fn row_span(mut self, span: u16) -> Self {
718 let grid_location = self.style().grid_location_mut();
719 grid_location.row = GridPlacement::Span(span)..GridPlacement::Span(span);
720 self
721 }
722
723 /// Sets the row span of this element.
724 fn row_span_full(mut self) -> Self {
725 let grid_location = self.style().grid_location_mut();
726 grid_location.row = GridPlacement::Line(1)..GridPlacement::Line(-1);
727 self
728 }
729
730 /// Draws a debug border around this element.
731 #[cfg(debug_assertions)]
732 fn debug(mut self) -> Self {
733 self.style().debug = Some(true);
734 self
735 }
736
737 /// Draws a debug border on all conforming elements below this element.
738 #[cfg(debug_assertions)]
739 fn debug_below(mut self) -> Self {
740 self.style().debug_below = Some(true);
741 self
742 }
743}