Skip to content

Commit 627e219

Browse files
committed
add website
1 parent a99e6fd commit 627e219

File tree

10 files changed

+227
-0
lines changed

10 files changed

+227
-0
lines changed

Images/AppChoreoBanner.png

538 KB
Loading

Images/AppChoreoLogo.png

288 KB
Loading

Images/ExampleSticker.png

481 KB
Loading

Images/collab.png

135 KB
Loading

Images/opensource.png

103 KB
Loading

Images/text.png

20.3 KB
Loading

Images/tool.png

2.73 KB
Loading

index.css

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Cairo&display=swap');
2+
3+
*{
4+
box-sizing: border-box;
5+
}
6+
7+
body{
8+
font-family: 'Cairo', sans-serif;
9+
padding: 10px;
10+
background-color:gainsboro;
11+
}
12+
13+
.header{
14+
padding: 30px;
15+
background-image: linear-gradient(rgb(0, 110, 255),yellow);
16+
background-repeat: no-repeat;
17+
background-size: cover;
18+
text-align: center;
19+
color:white;
20+
border-top-right-radius: 25px;
21+
border-top-left-radius: 25px;
22+
}
23+
24+
25+
.header h1{
26+
font-size: 50px;
27+
color: white;
28+
}
29+
30+
.header h3 {
31+
color: black;
32+
}
33+
34+
.topnav{
35+
/* position: fixed;
36+
top: 0;
37+
left: 0;
38+
z-index: 9999;
39+
width: 100%;
40+
height: 50px; */
41+
overflow: hidden;
42+
background-color: #333;
43+
border-bottom-left-radius: 25px;
44+
border-bottom-right-radius: 25px;
45+
}
46+
47+
.topnav a{
48+
float: left;
49+
display: block;
50+
color: #f2f2f2;
51+
text-align: center;
52+
padding: 14px 16px;
53+
text-decoration: none;
54+
}
55+
56+
.topnav a:hover{
57+
background-color: rgb(139, 231, 97);
58+
color: black;
59+
}
60+
61+
.logo img {
62+
height:200px;
63+
width: 200px;
64+
float: left;
65+
}
66+
67+
.leftcolumn{
68+
float:left;
69+
width: 75%;
70+
}
71+
72+
.rightcolumn{
73+
float: left;
74+
width:25%;
75+
padding-left: 20px;
76+
}
77+
78+
img{
79+
width: 100%;
80+
padding: 20px;
81+
border-radius: 50px;
82+
}
83+
84+
.card{
85+
background-color: white;
86+
padding: 20px;
87+
margin-top: 20px;
88+
border-radius: 25px;
89+
}
90+
91+
.row:after{
92+
content: "";
93+
display: table;
94+
clear: both;
95+
}
96+
97+
.footer{
98+
padding: 20px;
99+
text-align: center;
100+
background-color: rgb(185, 224, 75);
101+
margin-top: 20px;
102+
border-radius: 10px;
103+
}
104+
105+
@media screen and (max-width: 800px){
106+
.leftcolumn, .rightcolumn{
107+
width: 100%;
108+
padding: 0;
109+
}
110+
}
111+
112+
@media screen and (max-width: 400px){
113+
.topnav a{
114+
float: none;
115+
width: 100%;
116+
}
117+
}

index.html

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<link rel="icon" href="./Images/AppChoreoLogo.png" />
9+
<link rel="stylesheet" type="text/css" href="index.css" />
10+
<title>App-Choreography</title>
11+
</head>
12+
13+
<body>
14+
<div class="header">
15+
<div class="logo">
16+
<img src="Images/AppChoreoLogo.png" />
17+
</div>
18+
<h1>
19+
App-Choreography.
20+
</h1>
21+
<h3 style="text-align: center;">
22+
Choreograph your next app.
23+
</h3>
24+
</div>
25+
26+
<div class="topnav">
27+
<a href="">Home Page 🏡</a>
28+
<a href="">The History 🧾</a>
29+
<a href="">The Members 🙋‍♀️🌐</a>
30+
<a href="">Awesome Repos 👍</a>
31+
<a href="">How to join ✉️</a>
32+
<a href="">The future ✨</a>
33+
<a href="">We need your help 👈</a>
34+
<a href=""> List of Apps 📃</a>
35+
</div>
36+
37+
<div class="row">
38+
<div class="leftcolumn">
39+
<div class="card">
40+
<h2>
41+
Welcome to App-Choreography's Home! 🏡
42+
</h2>
43+
<h3>
44+
Our Motto: 💭 Choreograph your next app. 💭
45+
</h3>
46+
<p>
47+
This is the home of open source, collaborating, sharing code, and Apps!
48+
Open source at App-Choreography means that we all review and share code, helping each other in
49+
our journey of development.
50+
</p>
51+
<img src="./Images/opensource.png" />
52+
</div>
53+
54+
<div class="card">
55+
<h2>
56+
What we do 🏢💪⚒️:
57+
</h2>
58+
<h3>
59+
<i>Not just code...</i>
60+
</h3>
61+
<img src="./Images/collab.png" style="height:500px;" />
62+
63+
<p>
64+
Yes, at App-Choreography we write code. But it would not be the same without a bit of fun...
65+
<br>
66+
When you join our org, you will see multiple discussions for you to take in and participate!
67+
<br>
68+
Discussions about our new logos, and branding, new repos, new members will all get a shoutout
69+
too!
70+
</p>
71+
</div>
72+
</div>
73+
74+
75+
<div class="rightcolumn">
76+
<div class="card">
77+
<h2>
78+
Recent Posts!
79+
</h2>
80+
<img src="./Images/text.png" style="border-radius: 0px;" />
81+
<p> Have any questions? Contact us here: <a
82+
href="https://github.com/App-Choreography/Support/issues/new?assignees=CodingSpecies&labels=help+wanted%2C+Open+to+all%2C+question&template=faq------.md&title=FAQ+%F0%9F%99%8B%E2%80%8D%E2%99%80%EF%B8%8F">Support</a>
83+
</p>
84+
</div>
85+
<div class="card">
86+
<h3>
87+
Join us and get a digital Sticker!
88+
</h3>
89+
<p>If you join our org, you will automatically get a sticker for you to use explaining how you are a
90+
part of this org!</p>
91+
<img src="./Images/ExampleSticker.png" style="border-radius: 0%;" />
92+
<h3>
93+
Why not contribute to our Fix-The-README project?
94+
</h3>
95+
<p>See the repo: <a href="https://github.com/App-Choreography/Fix-Our-Readme">Here</a> </p>
96+
<img src="./Images/tool.png" />
97+
<h3>Coming Soon...</h3>
98+
<p></p>
99+
<img src="" />
100+
</div>
101+
</div>
102+
</div>
103+
<div class="footer">
104+
<h1>
105+
App-Choreography.
106+
</h1>
107+
</div>
108+
</body>
109+
110+
</html>

index.js

Whitespace-only changes.

0 commit comments

Comments
 (0)