Skip to content

Instantly share code, notes, and snippets.

@Sysetup

Sysetup/index.html

Last active September 2, 2016 06:26
Show Gist options
  • Save Sysetup/42a17085c2a75e6b63a57f2e3fdfc521 to your computer and use it in GitHub Desktop.
Save Sysetup/42a17085c2a75e6b63a57f2e3fdfc521 to your computer and use it in GitHub Desktop.
Download ZIP
Basic media quieries.
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<section>
;)
</section>
</body>
</html>
Raw
main.less
/*
=============================
Sysetup's custom styles.
main.less
=============================
*/
// Variables
@import "base/variables";
// Pages
@import "base/pages";
Raw
pages.less
/* Small devices (tablets, 767px and down) */
@media (max-width: @sm -1) {
section{
}
}
/* Small devices (tablets, 768px and up) */
@media (min-width: @sm) {
section{
}
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: @md) {
section{
}
}
/* Large screen / wide desktops and up */
@media (min-width: @lg) {
section{
}
}
Raw
variables.less
//
//Break points
//
@xs:480px;
// Small screen / tablet
@sm:768px;
// Medium screen / desktop
@md:992px;
// Large screen / wide desktop
@lg:1200px;
// Extra large screen
@xl:1600px;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment