_mixins.styl 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. the-transition() {
  2. transition-delay: 0s;
  3. transition-duration: .2s;
  4. transition-timing-function: ease-in-out;
  5. }
  6. the-transition-ease-in() {
  7. transition-delay: 0s;
  8. transition-duration: .2s;
  9. transition-timing-function: ease-in;
  10. }
  11. the-transition-ease-out() {
  12. transition-delay: 0s;
  13. transition-duration: .2s;
  14. transition-timing-function: ease-out;
  15. }
  16. mobile-smallest() {
  17. @media (max-width: 413px) {
  18. {block};
  19. }
  20. }
  21. mobile-small() {
  22. @media (max-width: 567px) {
  23. {block};
  24. }
  25. }
  26. mobile() {
  27. @media (max-width: 767px) {
  28. {block};
  29. }
  30. }
  31. tablet-mobile() {
  32. @media (max-width: 991px) {
  33. {block};
  34. }
  35. }
  36. tablet-desktop() {
  37. @media (min-width: 768px) {
  38. {block};
  39. }
  40. }
  41. tablet() {
  42. @media (min-width: 768px) and (max-width: 991px) {
  43. {block};
  44. }
  45. }
  46. desktop() {
  47. @media (min-width: 992px) {
  48. {block};
  49. }
  50. }
  51. desktop-large() {
  52. @media (min-width: 1200px) {
  53. {block};
  54. }
  55. }
  56. desktop-largest() {
  57. @media (min-width: 1600px) {
  58. {block};
  59. }
  60. }
  61. random-color($min, $max) {
  62. return floor(math(0, 'random') * ($max - $min + 1) + $min);
  63. }
  64. word-wrap() {
  65. overflow-wrap: break-word;
  66. word-wrap: break-word;
  67. }
  68. disable-user-select() {
  69. -moz-user-select: none;
  70. -ms-user-select: none;
  71. -webkit-user-select: none;
  72. user-select: none;
  73. }
  74. sidebar-inline-links-item() {
  75. margin: 5px 0 0;
  76. a, span.exturl {
  77. box-sizing: border-box;
  78. display: inline-block;
  79. margin-bottom: 0;
  80. margin-right: 0;
  81. max-width: 216px;
  82. overflow: hidden;
  83. padding: 0 5px;
  84. text-overflow: ellipsis;
  85. white-space: nowrap;
  86. }
  87. }
  88. flex-column() {
  89. display: flex;
  90. flex-direction: column;
  91. justify-content: center;
  92. }
  93. font-family-icons() {
  94. font-family: 'Font Awesome 5 Free';
  95. font-weight: 900;
  96. }