Skip to content

Commit

Permalink
Page is now responsive
Browse files Browse the repository at this point in the history
  • Loading branch information
@SolindekDev
SolindekDev committed Nov 21, 2023
1 parent b55236d commit 696c754
Show file tree
Hide file tree
Showing 5 changed files with 274 additions and 3 deletions.
Binary file added .DS_Store
View file
Binary file not shown.
26 changes: 26 additions & 0 deletions documentation.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Barn Programming Language | Documentation</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<div>
<img src="logo.png"/>
</div>
<div>
<ul>
<li><a href="/documentation.html">Documentation</a></li>
<li><a href="https://github.com/barn-lang/barn">Github</a></li>
<li><a href="/playground.html">Playground</a></li>
<li><a href="https://discord.gg/CaXfz6q4pk">Discord</a></li>
</ul>
</div>
</nav>
<div style="padding: 0% 4% 2% 4%;">
</div>
</body>
</html>
2 changes: 1 addition & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@
} <span class="keywords">else</span> {
<div class="tab">
<span class="keywords">let</span> <span class="identifier">circle_area</span>:
<span class="type">f32</span> = <span class="math">_MATH_PI * circle_radius * circle_radius </span><br />
<span class="type">f32</span> = <span class="math">_MATH_PI * <span class="identifier">pow2</span>(<span class="identifier">circle_radius</span>)</span><br />
<span class="identifier">fmt_printf</span>(<span class="strings">"Circle area = πr² = %f\n"</span>, <span class="identifier">circle_area</span>)<br />
</div>
}<br /><br />
Expand Down
30 changes: 30 additions & 0 deletions playground.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Barn Programming Language | Documentation</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<div>
<img src="logo.png"/>
</div>
<div>
<ul>
<li><a href="/documentation.html">Documentation</a></li>
<li><a href="https://github.com/barn-lang/barn">Github</a></li>
<li><a href="/playground.html">Playground</a></li>
<li><a href="https://discord.gg/CaXfz6q4pk">Discord</a></li>
</ul>
</div>
</nav>
<div style="padding: 0% 4% 2% 4%; min-height: 80vh; display: flex; justify-content: center; align-items: center;">
<div style="text-align: center;">
<div class="h1">Playground..</div>
<div class="span">We are working on it, Please give us some time!</div>
</div>
</div>
</body>
</html>
219 changes: 217 additions & 2 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ code {

.sk2 {
position:static;
font-size: 20px;
font-size: 18px;
/* border: 2px solid rgb(154, 154, 154); */
border-left: 2px solid #2d2d34;
/* border-radius: 24px; */
Expand Down Expand Up @@ -131,4 +131,219 @@ nav div ul li a {
font-size: 18px;
text-decoration: none;
font-weight: 600;
}
}

@media only screen and (max-width: 1546px) {
.sk2 {
position:static;
font-size: 16px;
padding: 30px 20px;
}

.h1 {
font-size: 30px;
font-weight: 700;
}

.span {
font-size: 16px;
font-weight: 20;
/* padding-left: 10px; */
}
}

@media only screen and (max-width: 1546px) {
.sk2 {
position:static;
font-size: 14px;
padding: 30px 0px 30px 20px;
}

.h1 {
font-size: 25px;
font-weight: 700;
}

.span {
font-size: 14px;
font-weight: 20;
/* padding-left: 10px; */
}
}

@media only screen and (max-width: 1142px) {
section {
display: block;
justify-content: space-between;
align-items: center;
}

.sk1 {
width: 100%;
padding: 50px;
}

.sk2 {
width: 100%;
position:static;
font-size: 14px;
border-top: 2px solid #2d2d34;
border-left: none;
padding: 30px 30px;
}
}

@media only screen and (max-width: 614px) {
section {
display: block;
justify-content: space-between;
align-items: center;
}

.sk1 {
width: 100%;
padding: 50px;
}

.sk2 {
width: 100%;
position:static;
font-size: 12px;
border-top: 2px solid #2d2d34;
border-left: none;
padding: 30px 30px;
}

.h1 {
font-size: 20px;
font-weight: 700;
}

.span {
font-size: 12px;
font-weight: 20;
/* padding-left: 10px; */
}
}

@media only screen and (max-width: 532px) {
section {
display: block;
justify-content: space-between;
align-items: center;
}

.sk1 {
width: 100%;
padding: 15px;
}

.sk2 {
width: 100%;
position:static;
font-size: 10px;
border-top: 2px solid #2d2d34;
border-left: none;
padding: 30px 15px;
}

.h1 {
font-size: 20px;
font-weight: 700;
}

.span {
font-size: 12px;
font-weight: 20;
/* padding-left: 10px; */
}

nav {
padding-top: 1%;
padding-bottom: 1%;
padding-left: 3%;
padding-right: 3%;
border-bottom: 2px solid #2d2d34;
display: flex;
justify-content: space-between;
align-items: center;
}

nav div img {
width: 32px;
}

nav div ul li {
display: inline-block;
padding: 0px 5px;
}

nav div ul li a {
color: white;
font-size: 14px;
text-decoration: none;
font-weight: 600;
}
}

@media only screen and (max-width: 390px) {
section {
display: block;
justify-content: space-between;
align-items: center;
}

.sk1 {
width: 100%;
padding: 30px 10px 30px 10px;
}

.sk2 {
width: 100%;
position:static;
font-size: 10px;
border-top: 2px solid #2d2d34;
border-left: none;
padding: 30px 10px;
}

.h1 {
font-size: 20px;
font-weight: 700;
}

.span {
font-size: 12px;
font-weight: 20;
/* padding-left: 10px; */
}

nav {
padding-top: 1%;
padding-bottom: 1%;
padding-left: 3%;
padding-right: 3%;
border-bottom: 2px solid #2d2d34;
display: flex;
justify-content: space-between;
align-items: center;
}

nav div img {
width: 24px;
}

nav div ul li {
display: inline-block;
padding: 0px 5px;
}

nav div ul li a {
color: white;
font-size: 10px;
text-decoration: none;
font-weight: 600;
}
}


0 comments on commit 696c754

Please sign in to comment.