Skip to content

Instantly share code, notes, and snippets.

@natafaye
Created July 20, 2022 01:39
Show Gist options
  • Save natafaye/376681c39d957e1cf8f5d1dfa8cefb8c to your computer and use it in GitHub Desktop.
Save natafaye/376681c39d957e1cf8f5d1dfa8cefb8c to your computer and use it in GitHub Desktop.
function pillars(numPill, dist, width) {
if(numPill === 1) {
return 0;
}
return ((numPill - 1) * dist * 100) + ((numPill - 2) * width);
}
// [ ] [ ]
// [ ] [ ] [ ] [ ]
// numPill = 4
// dist = 3
// width = 2
// 3 * dist
// 2 * width
// [ ] [ ] [ ]
// numPill = 3
// dist = 3
// width = 2
// 2 * dist
// 1 * width
function convertToRoman(num) {
let roman = "";
// loop and take out some of the number until it's all gone
while(num > 0) {
if(num >= 50) {
num -= 50;
roman += "L"
}
else if(num >= 10) {
num -= 10;
roman += "X"
}
//else if(num === 9)
else if(num >= 5) {
num -= 5;
roman += "V"
}
//else if(num === 4)
else {
num--;
roman += "I";
}
}
return roman;
}
console.log(convertToRoman(83))
body {
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
margin: 0;
}
ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
.top-navbar {
background-color: black;
display: flex;
padding: 15px;
color: white;
}
.top-navbar ul {
flex-grow: 1;
display: flex;
justify-content: space-around;
}
.top-navbar a {
text-decoration: none;
color: white;
}
.top-navbar a:hover {
color: lightgray;
}
.top-navbar li {
}
.active-link a {
color: lightblue;
}
.active-link a:hover {
color: lightsteelblue;
}
.triple-section {
display: flex;
margin: 20px 0;
}
.triple-section div {
flex-grow: 1;
text-align: center;
}
.btn {
border-radius: 10px;
border-width: 0;
padding: 20px;
}
.btn-green {
background-color: darkgreen;
color: white;
}
.btn-blue {
background-color: lightblue;
color: black;
}
<!DOCTYPE html>
<html>
<head>
<title>Week 8</title>
<link rel="stylesheet" href="week8.css"/>
</head>
<body>
<nav class="top-navbar">
<div>Chairs</div>
<ul>
<li><a href="#">Home</a></li>
<li class="active-link"><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<div>
<div>
<h2>This is a catchy sentence about chairs</h2>
<button>See More</button>
</div>
<div class="triple-section">
<div>
<p>And here is some more</p>
<button class="btn btn-green">See More</button>
</div>
<div>
<p>Text about nothing</p>
<button class="btn btn-blue">See More</button>
</div>
<div>
<p>To take up space</p>
<button class="btn">See More</button>
</div>
</div>
<div>
Mauris id hendrerit libero. Nunc pulvinar lorem at ligula sodales
suscipit ut vitae nisi. Proin nec eleifend nisi. Mauris augue quam,
semper et orci sed, rutrum luctus tortor. Donec tincidunt ex a nibh
euismod luctus. Sed facilisis metus at tortor sollicitudin, ac
suscipit risus hendrerit. Proin justo justo, consequat in maximus a,
rhoncus eget turpis. Morbi ac tellus nisi. Duis nisi odio, blandit
vitae risus ut, aliquet fermentum massa. In id velit vestibulum,
consequat mauris a, tincidunt felis. Cras dui sapien, faucibus id
semper vel, malesuada sit amet dui. Suspendisse finibus, dolor sed
fringilla condimentum, diam eros sagittis lectus, non aliquam nisl
nisi vitae nisl. Aliquam dictum, arcu eu scelerisque mollis, libero
nisi tempor magna, sit amet dictum leo nunc eget mauris.
</div>
</div>
<footer>
Copyright 2021
<ul>
<li><a>Home</a></li>
<li><a>Contact</a></li>
<li><a>About</a></li>
</ul>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment