ui-preview.less 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. //
  2. // UI Preview
  3. // --------------------------------------------------
  4. // Animation
  5. .ui-preview, .ui-preview-text, .ui-preview-img {
  6. background: @ui-preview-light;
  7. border-radius: @border-radius-base + 1px;
  8. color: @ui-preview-light;
  9. .animation(ui-preview-animation 1.5s linear infinite);
  10. }
  11. @-webkit-keyframes ui-preview-animation {
  12. 0% {
  13. background: @ui-preview-light;
  14. color: @ui-preview-light;
  15. }
  16. 50% {
  17. background: @ui-preview-dark;
  18. color: @ui-preview-dark;
  19. }
  20. 100% {
  21. background: @ui-preview-light;
  22. color: @ui-preview-light;
  23. }
  24. }
  25. @keyframes ui-preview-animation {
  26. 0% {
  27. background: @ui-preview-light;
  28. color: @ui-preview-light;
  29. }
  30. 50% {
  31. background: @ui-preview-dark;
  32. color: @ui-preview-dark;
  33. }
  34. 100% {
  35. background: @ui-preview-light;
  36. color: @ui-preview-light;
  37. }
  38. }
  39. // Text
  40. .ui-preview-text {
  41. border-radius: 100px;
  42. display: inline-block;
  43. height: @font-size-base;
  44. position: relative;
  45. top: (@line-height-computed - @font-size-base) / 2;
  46. }
  47. .ui-preview-paragraph {
  48. .ui-preview-text {
  49. margin-right: 6px;
  50. &:last-child {
  51. margin-right: 0px;
  52. }
  53. }
  54. }
  55. // List
  56. .ui-preview .list-group {
  57. padding: 1px;
  58. &>li {
  59. border: none;
  60. margin-bottom: 1px;
  61. }
  62. &>li:last-child {
  63. margin-bottom: 0px;
  64. }
  65. }