Skip to content

Instantly share code, notes, and snippets.

@FaroukDev

FaroukDev/bootstrap.css

Created February 14, 2019 16:32
Show Gist options
  • Save FaroukDev/0f114810bc9f5d18597e9f2b38f91233 to your computer and use it in GitHub Desktop.
Save FaroukDev/0f114810bc9f5d18597e9f2b38f91233 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
bootstrap.css
.container {
width: 60vw;
}
.grey {
background-color: #2D262E;
border: 1px solid white;
padding: 3%;
}
.black {
background-color: black;
border: 1px solid white;
padding: 3%;
}
.yellow {
background-color: yellow;
border: 1px solid white;
padding: 3%;
}
.orange {
background-color: #F27D00;
border: 1px solid white;
padding: 3%;
}
.white {
background-color: white;
border: 1px solid white;
padding: 3%;
}
Raw
bootstrap.html
<!doctype html>
<html lang="en">
<head>
<title>Sauron</title>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="bootstrap.css">
</head>
<body>
<header>
<h1>Sauron</h1>
</header>
<section>
<div class="container">
<div class="row">
<div class="grey col-xs-1"></div>
<div class="white col-xs-9"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="grey col-xs-1"></div>
<div class="white col-xs-3"></div>
<div class="orange col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="white col-xs-3"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="grey col-xs-1"></div>
<div class="white col-xs-2"></div>
<div class="orange col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="black col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="grey col-xs-1 col-xs-offset-2"></div>
</div>
<div class="row">
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="black col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="black col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="yellow col-xs-1"></div>
<div class="orange col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
<div class="row">
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="white col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
<div class="grey col-xs-1"></div>
</div>
</div>
</section>
<footer></footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment