// -------------------------------------------------- // Mixins used throughout the theme // -------------------------------------------------- // Media queries // -------------------------------------------------- @mixin small-height { @media screen and (max-height: 444px) { @content; } } @mixin regular-height { @media screen and (min-height: 445px) { @content; } } @mixin not-small-width { @media screen and (min-width: 967px) { @content; } } @mixin small-width { @media screen and (max-width: 966px) { @content; } } @mixin medium-width { @media screen and (min-width: 967px) and (max-width: 1139px) { @content; } } @mixin large-width { @media screen and (min-width: 1140px) { @content; } } // CSS3 properties // -------------------------------------------------- // Box sizing @mixin box-sizing($sizing) { -webkit-box-sizing: $sizing; -moz-box-sizing: $sizing; box-sizing: $sizing; } // 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}; -ms-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; }