github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/semantic/src/definitions/elements/list.less (about) 1 /*! 2 * # Semantic UI - List 3 * http://github.com/semantic-org/semantic-ui/ 4 * 5 * 6 * Copyright 2014 Contributorss 7 * Released under the MIT license 8 * http://opensource.org/licenses/MIT 9 * 10 */ 11 12 /******************************* 13 Theme 14 *******************************/ 15 16 @type : 'element'; 17 @element : 'list'; 18 19 @import (multiple) '../../theme.config'; 20 21 /******************************* 22 List 23 *******************************/ 24 25 ul.ui.list, 26 ol.ui.list, 27 .ui.list { 28 list-style-type: @listStyleType; 29 margin: @margin; 30 padding: @verticalPadding @horizontalPadding; 31 } 32 33 ul.ui.list:first-child, 34 ol.ui.list:first-child, 35 .ui.list:first-child { 36 margin-top: 0em; 37 padding-top: 0em; 38 } 39 40 ul.ui.list:last-child, 41 ol.ui.list:last-child, 42 .ui.list:last-child { 43 margin-bottom: 0em; 44 padding-bottom: 0em; 45 } 46 47 /******************************* 48 Content 49 *******************************/ 50 51 /* List Item */ 52 ul.ui.list li, 53 ol.ui.list li, 54 .ui.list > .item, 55 .ui.list .list > .item { 56 display: list-item; 57 table-layout: fixed; 58 list-style-type: @listStyleType; 59 list-style-position: @listStylePosition; 60 61 padding: @itemVerticalPadding @itemHorizontalPadding; 62 line-height: @itemLineHeight; 63 } 64 65 ul.ui.list > li:first-child:after, 66 ol.ui.list > li:first-child:after, 67 .ui.list > .list > .item, 68 .ui.list > .item:after { 69 content: ''; 70 display: block; 71 height: 0; 72 clear: both; 73 visibility: hidden; 74 } 75 76 ul.ui.list li:first-child, 77 ol.ui.list li:first-child, 78 .ui.list .list > .item:first-child, 79 .ui.list > .item:first-child { 80 padding-top: 0em; 81 } 82 ul.ui.list li:last-child, 83 ol.ui.list li:last-child, 84 .ui.list .list > .item:last-child, 85 .ui.list > .item:last-child { 86 padding-bottom: 0em; 87 } 88 89 /* Child List */ 90 ul.ui.list ul, 91 ol.ui.list ol, 92 .ui.list .list { 93 clear: both; 94 margin: 0em; 95 padding: @childListPadding; 96 } 97 98 /* Icon */ 99 .ui.list .list > .item > i.icon, 100 .ui.list > .item > i.icon { 101 display: table-cell; 102 margin: 0em; 103 padding-top: @iconOffset; 104 padding-right: @iconDistance; 105 vertical-align: @iconContentVerticalAlign; 106 transition: @iconTransition; 107 } 108 .ui.list .list > .item i[class*="top aligned"].icon, 109 .ui.list > .item > i[class*="top aligned"].icon { 110 vertical-align: top; 111 } 112 .ui.list .list > .item > i.icon:only-child, 113 .ui.list > .item > i.icon:only-child { 114 display: inline-block; 115 vertical-align: @iconVerticalAlign; 116 } 117 118 119 /* Image */ 120 .ui.list .list > .item > .image, 121 .ui.list > .item > .image { 122 display: table-cell; 123 background-color: transparent; 124 margin: 0em; 125 padding-right: @imageDistance; 126 vertical-align: @imageAlign; 127 } 128 .ui.list .list > .item > [class*="top aligned"].image, 129 .ui.list > .item > [class*="top aligned"].image { 130 vertical-align: top; 131 } 132 .ui.list .list > .item > .image img, 133 .ui.list > .item > .image img { 134 vertical-align: @imageAlign; 135 } 136 137 .ui.list .list > .item > img.image, 138 .ui.list .list > .item > .image:only-child, 139 .ui.list > .item > img.image, 140 .ui.list > .item > .image:only-child { 141 display: inline-block; 142 padding-right: 0em; 143 } 144 145 /* Content */ 146 .ui.list .list > .item > .content, 147 .ui.list > .item > .content { 148 line-height: @contentLineHeight; 149 } 150 .ui.list .list > .item > .image + .content, 151 .ui.list .list > .item > .icon + .content 152 .ui.list > .item > .image + .content, 153 .ui.list > .item > .icon + .content { 154 display: table-cell; 155 padding: 0em 0em 0em @contentDistance; 156 vertical-align: @contentVerticalAlign; 157 } 158 .ui.list .list > .item > .image + .content, 159 .ui.list .list > .item > .icon + .content, 160 .ui.list > .item > .image + .content, 161 .ui.list > .item > .icon + .content { 162 display: table-cell; 163 padding: 0em 0em 0em @contentDistance; 164 vertical-align: @contentVerticalAlign; 165 } 166 .ui.list .list > .item > img.image + .content, 167 .ui.list > .item > img.image + .content { 168 display: inline-block; 169 } 170 .ui.list .list > .item [class*="top aligned"].content, 171 .ui.list > .item > [class*="top aligned"].content { 172 vertical-align: top; 173 } 174 .ui.list .list > .item > .content > .list, 175 .ui.list > .item > .content > .list { 176 margin-left: 0em; 177 padding-left: 0em; 178 } 179 180 /* Item Link */ 181 .ui.list .list > a.item, 182 .ui.list > a.item { 183 cursor: pointer; 184 color: @itemLinkColor; 185 } 186 .ui.list .list > a.item:hover, 187 .ui.list > a.item:hover { 188 color: @itemLinkHoverColor; 189 } 190 191 /* Linked Item Icons */ 192 .ui.list .list > a.item i.icon, 193 .ui.list > a.item i.icon { 194 color: @itemLinkIconColor; 195 } 196 197 /* Linking Content */ 198 .ui.list .item a { 199 cursor: pointer; 200 color: @itemLinkColor !important; 201 } 202 .ui.list .item a:hover { 203 color: @itemLinkHoverColor !important; 204 } 205 206 207 /* Header */ 208 .ui.list .list > .item .header, 209 .ui.list > .item .header { 210 display: block; 211 margin: 0em; 212 font-family: @itemHeaderFontFamily; 213 font-weight: @itemHeaderFontWeight; 214 color: @itemHeaderColor; 215 } 216 .ui.list .list > .item .description, 217 .ui.list > .item .description { 218 display: block; 219 color: @itemDescriptionColor; 220 } 221 222 /* Floated Content */ 223 .ui.list .list > .item [class*="left floated"], 224 .ui.list > .item [class*="left floated"] { 225 float: left; 226 margin: @leftFloatMargin; 227 } 228 .ui.list .list > .item [class*="right floated"], 229 .ui.list > .item [class*="right floated"] { 230 float: right; 231 margin: @rightFloatMargin; 232 } 233 234 /******************************* 235 Coupling 236 *******************************/ 237 238 .ui.menu .ui.list > .item, 239 .ui.menu .ui.list .list > .item { 240 display: list-item; 241 table-layout: fixed; 242 background-color: transparent; 243 244 list-style-type: @listStyleType; 245 list-style-position: @listStylePosition; 246 247 padding: @itemVerticalPadding @itemHorizontalPadding; 248 line-height: @itemLineHeight; 249 } 250 .ui.menu .ui.list .list > .item:before, 251 .ui.menu .ui.list > .item:before { 252 border: none; 253 background: none; 254 } 255 .ui.menu .ui.list .list > .item:first-child, 256 .ui.menu .ui.list > .item:first-child { 257 padding-top: 0em; 258 } 259 .ui.menu .ui.list .list > .item:last-child, 260 .ui.menu .ui.list > .item:last-child { 261 padding-bottom: 0em; 262 } 263 264 265 /******************************* 266 Types 267 *******************************/ 268 269 /*------------------- 270 Horizontal 271 --------------------*/ 272 273 .ui.horizontal.list { 274 display: inline-block; 275 font-size: 0em; 276 } 277 .ui.horizontal.list > .item { 278 display: inline-block; 279 margin-left: @horizontalSpacing; 280 font-size: 1rem; 281 } 282 .ui.horizontal.list > .item:first-child { 283 margin-left: 0em !important; 284 padding-left: 0em !important; 285 } 286 .ui.horizontal.list .list { 287 padding-left: 0em; 288 padding-bottom: 0em; 289 } 290 291 /* Padding on all elements */ 292 .ui.horizontal.list > .item:first-child, 293 .ui.horizontal.list > .item:last-child { 294 padding-top: @itemVerticalPadding; 295 padding-bottom: @itemVerticalPadding; 296 } 297 298 /* Horizontal List */ 299 .ui.horizontal.list > .item > i.icon { 300 margin: 0em; 301 padding: 0em @horizontalIconDistance 0em 0em; 302 } 303 .ui.horizontal.list > .item > .icon, 304 .ui.horizontal.list > .item > .icon + .content { 305 float: none; 306 display: inline-block; 307 } 308 309 310 /******************************* 311 States 312 *******************************/ 313 314 /*------------------- 315 Disabled 316 --------------------*/ 317 318 .ui.list .list > .disabled.item, 319 .ui.list > .disabled.item { 320 pointer-events: none; 321 color: @disabledColor !important; 322 } 323 .ui.inverted.list .list > .disabled.item, 324 .ui.inverted.list > .disabled.item { 325 color: @invertedDisabledColor !important; 326 } 327 328 /*------------------- 329 Hover 330 --------------------*/ 331 332 .ui.list .list > a.item:hover .icon, 333 .ui.list > a.item:hover .icon { 334 color: @itemLinkIconHoverColor; 335 } 336 337 338 /******************************* 339 Variations 340 *******************************/ 341 342 /*------------------- 343 Inverted 344 --------------------*/ 345 346 .ui.inverted.list .list > a.item > .icon, 347 .ui.inverted.list > a.item > .icon { 348 color: @invertedIconLinkColor; 349 } 350 .ui.inverted.list .list > .item .header, 351 .ui.inverted.list > .item .header { 352 color: @invertedHeaderColor; 353 } 354 .ui.inverted.list .list > .item .description, 355 .ui.inverted.list > .item .description { 356 color: @invertedDescriptionColor; 357 } 358 359 /* Item Link */ 360 .ui.inverted.list .list > a.item, 361 .ui.inverted.list > a.item { 362 cursor: pointer; 363 color: @invertedItemLinkColor; 364 } 365 .ui.inverted.list .list > a.item:hover, 366 .ui.inverted.list > a.item:hover { 367 color: @invertedItemLinkHoverColor; 368 } 369 370 371 /* Linking Content */ 372 .ui.inverted.list .item a { 373 cursor: pointer; 374 color: @invertedItemLinkColor !important; 375 } 376 .ui.inverted.list .item a:hover { 377 color: @invertedItemLinkHoverColor !important; 378 } 379 380 /*------------------- 381 Link 382 --------------------*/ 383 384 .ui.link.list .item, 385 .ui.link.list a.item, 386 .ui.link.list .item a { 387 color: @linkListItemColor; 388 transition: @linkListTransition; 389 } 390 .ui.link.list a.item:hover, 391 .ui.link.list .item a:hover { 392 color: @linkListItemHoverColor; 393 } 394 .ui.link.list a.item:active, 395 .ui.link.list .item a:active { 396 color: @linkListItemDownColor; 397 } 398 .ui.link.list .active.item, 399 .ui.link.list .active.item a { 400 color: @linkListItemActiveColor; 401 } 402 403 /* Inverted */ 404 .ui.inverted.link.list .item, 405 .ui.inverted.link.list a.item, 406 .ui.inverted.link.list .item a { 407 color: @invertedLinkListItemColor; 408 } 409 .ui.inverted.link.list a.item:hover, 410 .ui.inverted.link.list .item a:hover { 411 color: @invertedLinkListItemHoverColor; 412 } 413 .ui.inverted.link.list a.item:active, 414 .ui.inverted.link.list .item a:active { 415 color: @invertedLinkListItemDownColor; 416 } 417 .ui.inverted.link.list a.active.item, 418 .ui.inverted.link.list .active.item a { 419 color: @invertedLinkListItemActiveColor; 420 } 421 422 /*------------------- 423 Selection 424 --------------------*/ 425 426 .ui.selection.list .list > .item, 427 .ui.selection.list > .item { 428 cursor: pointer; 429 background: @selectionListBackground; 430 padding: @selectionListItemVerticalPadding @selectionListItemHorizontalPadding; 431 margin: @selectionListItemMargin; 432 color: @selectionListColor; 433 border-radius: @selectionListItemBorderRadius; 434 transition: @selectionListTransition; 435 } 436 .ui.selection.list .list > .item:last-child, 437 .ui.selection.list > .item:last-child { 438 margin-bottom: 0em; 439 } 440 .ui.selection.list.list > .item:hover, 441 .ui.selection.list > .item:hover { 442 background: @selectionListHoverBackground; 443 color: @selectionListHoverColor; 444 } 445 .ui.selection.list .list > .item:active, 446 .ui.selection.list > .item:active { 447 background: @selectionListDownBackground; 448 color: @selectionListDownColor; 449 } 450 .ui.selection.list .list > .item.active, 451 .ui.selection.list > .item.active { 452 background: @selectionListActiveBackground; 453 color: @selectionListActiveColor; 454 } 455 456 /* Inverted */ 457 .ui.inverted.selection.list > .item, 458 .ui.inverted.selection.list > .item { 459 background: @invertedSelectionListBackground; 460 color: @invertedSelectionListColor; 461 } 462 .ui.inverted.selection.list > .item:hover, 463 .ui.inverted.selection.list > .item:hover { 464 background: @invertedSelectionListHoverBackground; 465 color: @invertedSelectionListHoverColor; 466 } 467 .ui.inverted.selection.list > .item:active, 468 .ui.inverted.selection.list > .item:active { 469 background: @invertedSelectionListDownBackground; 470 color: @invertedSelectionListDownColor; 471 } 472 .ui.inverted.selection.list > .item.active, 473 .ui.inverted.selection.list > .item.active { 474 background: @invertedSelectionListActiveBackground; 475 color: @invertedSelectionListActiveColor; 476 } 477 478 /* Celled / Divided Selection List */ 479 .ui.celled.selection.list .list > .item, 480 .ui.divided.selection.list .list > .item, 481 .ui.celled.selection.list > .item, 482 .ui.divided.selection.list > .item { 483 border-radius: 0em; 484 } 485 486 /*------------------- 487 Animated 488 --------------------*/ 489 490 .ui.animated.list > .item { 491 transition: @animatedListTransition; 492 } 493 .ui.animated.list:not(.horizontal) > .item:hover { 494 padding-left: @animatedListIndent; 495 } 496 497 /*------------------- 498 Fitted 499 --------------------*/ 500 .ui.fitted.list:not(.selection) .list > .item, 501 .ui.fitted.list:not(.selection) > .item { 502 padding-left: 0em; 503 padding-right: 0em; 504 } 505 .ui.fitted.selection.list .list > .item, 506 .ui.fitted.selection.list > .item { 507 margin-left: -@selectionListItemHorizontalPadding; 508 margin-right: -@selectionListItemHorizontalPadding; 509 } 510 511 /*------------------- 512 Bulleted 513 --------------------*/ 514 515 ul.ui.list, 516 .ui.bulleted.list { 517 margin-left: @bulletDistance; 518 } 519 ul.ui.list li, 520 .ui.bulleted.list .list > .item, 521 .ui.bulleted.list > .item { 522 position: relative; 523 } 524 ul.ui.list li:before, 525 .ui.bulleted.list .list > .item:before, 526 .ui.bulleted.list > .item:before { 527 position: absolute; 528 top: auto; 529 left: auto; 530 margin-left: @bulletOffset; 531 content: @bulletCharacter; 532 opacity: @bulletOpacity; 533 color: @bulletColor; 534 vertical-align: @bulletVerticalAlign; 535 } 536 537 ul.ui.list ul, 538 .ui.bulleted.list .list { 539 padding-left: @bulletChildDistance; 540 } 541 542 /* Horizontal Bulleted */ 543 ul.ui.horizontal.bulleted.list, 544 .ui.horizontal.bulleted.list { 545 margin-left: 0em; 546 } 547 ul.ui.horizontal.bulleted.list li, 548 .ui.horizontal.bulleted.list > .item { 549 margin-left: @horizontalBulletSpacing; 550 } 551 ul.ui.horizontal.bulleted.list li:first-child, 552 .ui.horizontal.bulleted.list > .item:first-child { 553 margin-left: 0em; 554 } 555 ul.ui.horizontal.bulleted.list li:first-child::before, 556 .ui.horizontal.bulleted.list > .item:first-child::before { 557 display: none; 558 } 559 560 /*------------------- 561 Ordered 562 --------------------*/ 563 564 ol.ui.list, 565 .ui.ordered.list, 566 .ui.ordered.list .list, 567 ol.ui.list ol { 568 counter-reset: ordered; 569 margin-left: @orderedCountDistance; 570 list-style-type: none; 571 } 572 ol.ui.list li, 573 .ui.ordered.list .list > .item, 574 .ui.ordered.list > .item { 575 list-style-type: none; 576 position: relative; 577 } 578 ol.ui.list li:before, 579 .ui.ordered.list .list > .item:before, 580 .ui.ordered.list > .item:before { 581 position: absolute; 582 top: auto; 583 left: auto; 584 margin-left: -(@orderedCountDistance); 585 counter-increment: @orderedCountName; 586 content: @orderedCountContent; 587 text-align: @orderedCountTextAlign; 588 color: @orderedCountColor; 589 vertical-align: @orderedCountVerticalAlign; 590 opacity: @orderedCountOpacity; 591 } 592 593 594 /* Child Lists */ 595 ol.ui.list ol, 596 .ui.ordered.list .list { 597 margin-left: @orderedChildCountDistance; 598 } 599 ol.ui.list ol li:before, 600 .ui.ordered.list .list > .item:before { 601 margin-left: @orderedChildCountOffset; 602 } 603 604 /* Horizontal Ordered */ 605 ol.ui.horizontal.list, 606 .ui.ordered.horizontal.list { 607 margin-left: 0em; 608 } 609 ol.ui.horizontal.list li:before, 610 .ui.ordered.horizontal.list .list > .item:before, 611 .ui.ordered.horizontal.list > .item:before { 612 position: static; 613 margin: 0em @horizontalOrderedCountDistance 0em 0em; 614 } 615 616 617 /*------------------- 618 Divided 619 --------------------*/ 620 621 .ui.divided.list > .item { 622 border-top: @dividedBorder; 623 } 624 .ui.divided.list .list > .item { 625 border-top: @dividedChildListBorder; 626 } 627 .ui.divided.list .item .list > .item { 628 border-top: @dividedChildItemBorder; 629 } 630 .ui.divided.list .list > .item:first-child, 631 .ui.divided.list > .item:first-child { 632 border-top: none; 633 } 634 635 /* Sub Menu */ 636 .ui.divided.list:not(.horizontal) .list > .item:first-child { 637 border-top-width: @dividedBorderWidth; 638 } 639 640 /* Divided bulleted */ 641 .ui.divided.bulleted.list:not(.horizontal), 642 .ui.divided.bulleted.list .list { 643 margin-left: 0em; 644 padding-left: 0em; 645 } 646 .ui.divided.bulleted.list .list > .item:not(.horizontal), 647 .ui.divided.bulleted.list > .item:not(.horizontal) { 648 padding-left: @bulletDistance; 649 } 650 651 /* Divided Ordered */ 652 .ui.divided.ordered.list { 653 margin-left: 0em; 654 } 655 .ui.divided.ordered.list .list > .item, 656 .ui.divided.ordered.list > .item { 657 padding-left: @orderedCountDistance; 658 } 659 .ui.divided.ordered.list .item .list { 660 margin-left: 0em; 661 margin-right: 0em; 662 padding-bottom: @itemVerticalPadding; 663 } 664 .ui.divided.ordered.list .item .list > .item { 665 padding-left: @orderedChildCountDistance; 666 } 667 668 /* Divided Selection */ 669 .ui.divided.selection.list .list > .item, 670 .ui.divided.selection.list > .item { 671 margin: 0em; 672 border-radius: 0em; 673 } 674 675 /* Divided horizontal */ 676 .ui.divided.horizontal.list { 677 margin-left: 0em; 678 } 679 .ui.divided.horizontal.list > .item { 680 border-top: none; 681 border-left: @dividedBorder; 682 margin: 0em; 683 padding-left: @horizontalDividedSpacing; 684 padding-right: @horizontalDividedSpacing; 685 line-height: @horizontalDividedLineHeight; 686 } 687 .ui.horizontal.divided.list > .item:first-child { 688 border-left: none; 689 } 690 /* Inverted */ 691 .ui.divided.inverted.list > .item, 692 .ui.divided.inverted.list > .list, 693 .ui.divided.inverted.horizontal.list > .item { 694 border-color: @dividedInvertedBorderColor; 695 } 696 697 698 /*------------------- 699 Celled 700 --------------------*/ 701 702 .ui.celled.list > .item, 703 .ui.celled.list > .list { 704 border-top: @celledBorder; 705 padding-left: @celledHorizontalPadding; 706 padding-right: @celledHorizontalPadding; 707 } 708 .ui.celled.list > .item:last-child { 709 border-bottom: @celledBorder; 710 } 711 712 /* Padding on all elements */ 713 .ui.celled.list > .item:first-child, 714 .ui.celled.list > .item:last-child { 715 padding-top: @itemVerticalPadding; 716 padding-bottom: @itemVerticalPadding; 717 } 718 719 /* Sub Menu */ 720 .ui.celled.list .item .list > .item { 721 border-width: 0px; 722 } 723 .ui.celled.list .list > .item:first-child { 724 border-top-width: 0px; 725 } 726 727 /* Celled Bulleted */ 728 .ui.celled.bulleted.list { 729 margin-left: 0em; 730 } 731 .ui.celled.bulleted.list .list > .item, 732 .ui.celled.bulleted.list > .item { 733 padding-left: (@bulletDistance); 734 } 735 .ui.celled.bulleted.list .item .list { 736 margin-left: -(@bulletDistance); 737 margin-right: -(@bulletDistance); 738 padding-bottom: @itemVerticalPadding; 739 } 740 741 /* Celled Ordered */ 742 .ui.celled.ordered.list { 743 margin-left: 0em; 744 } 745 .ui.celled.ordered.list .list > .item, 746 .ui.celled.ordered.list > .item { 747 padding-left: @orderedCountDistance; 748 } 749 .ui.celled.ordered.list .item .list { 750 margin-left: 0em; 751 margin-right: 0em; 752 padding-bottom: @itemVerticalPadding; 753 } 754 .ui.celled.ordered.list .list > .item { 755 padding-left: @orderedChildCountDistance; 756 } 757 758 /* Celled Horizontal */ 759 .ui.horizontal.celled.list { 760 margin-left: 0em; 761 } 762 .ui.horizontal.celled.list .list > .item, 763 .ui.horizontal.celled.list > .item { 764 border-top: none; 765 border-left: @celledBorder; 766 margin: 0em; 767 padding-left: @horizontalCelledSpacing; 768 padding-right: @horizontalCelledSpacing; 769 770 line-height: @horizontalCelledLineHeight; 771 } 772 .ui.horizontal.celled.list .list > .item:last-child, 773 .ui.horizontal.celled.list > .item:last-child { 774 border-bottom: none; 775 border-right: @celledBorder; 776 } 777 778 /* Inverted */ 779 .ui.celled.inverted.list > .item, 780 .ui.celled.inverted.list > .list { 781 border-color: @celledInvertedBorder; 782 } 783 .ui.celled.inverted.horizontal.list .list > .item, 784 .ui.celled.inverted.horizontal.list > .item { 785 border-color: @celledInvertedBorder; 786 } 787 788 /*------------------- 789 Relaxed 790 --------------------*/ 791 792 .ui.relaxed.list:not(.horizontal) > .item { 793 padding-top: @relaxedVerticalPadding; 794 padding-bottom: @relaxedVerticalPadding; 795 } 796 .ui.relaxed.list .list > .item .header, 797 .ui.relaxed.list > .item .header { 798 /*margin-bottom: @relaxedHeaderMargin;*/ 799 } 800 .ui.horizontal.relaxed.list > .item { 801 padding-left: @relaxedHorizontalPadding; 802 padding-right: @relaxedHorizontalPadding; 803 } 804 805 /* Very Relaxed */ 806 .ui[class*="very relaxed"].list:not(.horizontal) > .item { 807 padding-top: @veryRelaxedVerticalPadding; 808 padding-bottom: @veryRelaxedVerticalPadding; 809 } 810 .ui[class*="very relaxed"].list .list > .item .header, 811 .ui[class*="very relaxed"].list > .item .header { 812 /*margin-bottom: @veryRelaxedHeaderMargin;*/ 813 } 814 .ui.horizontal[class*="very relaxed"].list .list > .item, 815 .ui.horizontal[class*="very relaxed"].list > .item { 816 padding-left: @veryRelaxedHorizontalPadding; 817 padding-right: @veryRelaxedHorizontalPadding; 818 } 819 820 /*------------------- 821 Sizes 822 --------------------*/ 823 824 .ui.mini.list { 825 font-size: @relativeMini; 826 } 827 .ui.tiny.list { 828 font-size: @relativeTiny; 829 } 830 .ui.small.list { 831 font-size: @relativeSmall; 832 } 833 .ui.list { 834 font-size: @relativeMedium; 835 } 836 .ui.large.list { 837 font-size: @relativeLarge; 838 } 839 .ui.big.list { 840 font-size: @relativeBig; 841 } 842 .ui.huge.list { 843 font-size: @relativeHuge; 844 } 845 .ui.massive.list { 846 font-size: @relativeMassive; 847 } 848 849 .ui.mini.horizontal.list .list > .item, 850 .ui.mini.horizontal.list > .item { 851 font-size: @mini; 852 } 853 .ui.tiny.horizontal.list .list > .item, 854 .ui.tiny.horizontal.list > .item { 855 font-size: @tiny; 856 } 857 .ui.small.horizontal.list .list > .item, 858 .ui.small.horizontal.list > .item { 859 font-size: @small; 860 } 861 .ui.horizontal.list .list > .item, 862 .ui.horizontal.list > .item { 863 font-size: @medium; 864 } 865 .ui.large.horizontal.list .list > .item, 866 .ui.large.horizontal.list > .item { 867 font-size: @large; 868 } 869 .ui.big.horizontal.list .list > .item, 870 .ui.big.horizontal.list > .item { 871 font-size: @big; 872 } 873 .ui.huge.horizontal.list .list > .item, 874 .ui.huge.horizontal.list > .item { 875 font-size: @huge; 876 } 877 .ui.massive.horizontal.list .list > .item, 878 .ui.massive.horizontal.list > .item { 879 font-size: @massive; 880 } 881 882 .loadUIOverrides();