Advertisement
Guest User

Untitled

a guest
Aug 20th, 2019
94
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.44 KB | None | 0 0
  1. /** media queries **/
  2.  
  3. /*
  4. ##Device = Desktops
  5. ##Screen = 1281px to higher resolution desktops
  6. */
  7.  
  8. @mixin desktops-large {
  9. @media (min-width: 1281px) {
  10. @content;
  11. }
  12. }
  13.  
  14. /*
  15. ##Device = Laptops, Desktops
  16. ##Screen = 1025px to higher resolution desktops and laptops
  17. */
  18.  
  19. @mixin desktops-all {
  20. @media (min-width: 1025px) {
  21. @content;
  22. }
  23. }
  24.  
  25. /*
  26. ##Device = Laptops, Desktops
  27. ##Screen = B/w 1025px to 1280px
  28. */
  29.  
  30. @mixin desktops {
  31. @media (min-width: 1025px) and (max-width: 1280px) {
  32. @content;
  33. }
  34. }
  35.  
  36. /*
  37. ##Device = Tablets, Ipads (portrait)
  38. ##Screen = B/w 768px to 1024px
  39. */
  40.  
  41. @mixin tablets-portrait {
  42. @media (min-width: 768px) and (max-width: 1024px) {
  43. @content;
  44. }
  45. }
  46.  
  47. /*
  48. ##Device = Tablets, Ipads (landscape)
  49. ##Screen = B/w 768px to 1024px
  50. */
  51.  
  52. @mixin tablets-landscape {
  53. @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  54. @content;
  55. }
  56. }
  57.  
  58. /*
  59. ##Device = Low Resolution Tablets, Mobiles (Landscape)
  60. ##Screen = B/w 481px to 767px
  61. */
  62.  
  63. @mixin mobiles-landscape {
  64. @media (min-width: 481px) and (max-width: 767px) {
  65. @content;
  66. }
  67. }
  68.  
  69. /*
  70. ##Device = Most of the Smartphones Mobiles (Portrait)
  71. ##Screen = B/w 320px to 479px
  72. */
  73. @mixin mobiles-portrait {
  74. @media (min-width: 320px) and (max-width: 480px) {
  75. @content;
  76. }
  77. }
  78.  
  79. /*
  80. ##Device = Most of the Smartphones Mobiles
  81. ##Screen = B/w 320px to 767px
  82. */
  83. @mixin mobiles-all {
  84. @media (min-width: 320px) and (max-width: 767px) {
  85. @content;
  86. }
  87. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement