// -------------------------------------------------- // Mixins used throughout the theme // -------------------------------------------------- // Media queries // -------------------------------------------------- @mixin small-width { @media all and (max-width: 850px) { @content; } } @mixin medium-width { @media all and (min-width: 1000px) and (max-width: 1139px) { @content; } } @mixin large-width { @media all and (min-width: 1140px) { @content; } } @mixin mobile-portrait { @media all and (max-width : 320px) { @content; } } @mixin not-mobile-portrait { @media all and (min-width : 321px) { @content; } } @mixin mobile-landscape { @media all and (min-width : 321px) and (max-width : 959px) { @content; } } @mixin not-tablet-landscape { @media all and (max-width : 959px) { @content; } } @mixin tablet-landscape { @media all and (min-width : 960px) { @content; } } // CSS3 properties // -------------------------------------------------- // Border radius @mixin border-radius-all($radius) { border-radius: $radius; } // Box shadow @mixin box-shadow($shadow) { box-shadow: $shadow; } // Linear gradient @mixin linear-gradient($start-color, $end-color) { background-color: $start-color; background-image: linear-gradient(to bottom, $start-color, $end-color); } // Transition @mixin transition($transition) { .discourse-no-touch & { -webkit-transition: #{$transition}; transition: #{$transition}; } } // Visibility // -------------------------------------------------- @mixin hover { .discourse-no-touch & { &:hover { @content; } } } @mixin fades-in($time: 0.5s) { opacity: 0; visibility: hidden; .discourse-no-touch & { -webkit-transition: visibility 0s linear $time, opacity $time linear; -ms-transition: visibility 0s linear $time, opacity $time linear; transition: visibility 0s linear $time, opacity $time linear; } } @mixin visible { opacity: 1; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } // // -------------------------------------------------- // Unselectable @mixin unselectable { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }