Skip to content

Content improvements and responsive navigation #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 30, 2020
Merged

Content improvements and responsive navigation #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ed9ef71
Update Readme
jvolker Mar 30, 2020
280b1f1
Adds responsive menu. Adds links to menu. Improves link style in Q&A …
jvolker Mar 30, 2020
7a2d8c9
Adds help section to Q&A
jvolker Mar 30, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
# Openframe Landing Site

The openframe.io website.

## Deploy

Any changes to the master branch are immediately available at https://openframe.io/.
55 changes: 28 additions & 27 deletions css/landing-manual.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ body {
letter-spacing: normal;
font-weight: 300;
font-family: "Lato", sans-serif;
padding-top: 70px;
}

.container-wide {
Expand Down Expand Up @@ -105,29 +106,26 @@ h6 {
text-align: center;
}

.top-nav-wrap {
padding-right: 20px;
nav.navbar {
border: none;
background-color: white;
font-weight: 400;
}

ul.top-nav {
text-align: right;
}

ul.top-nav li {
display: inline-block;
padding: 15px 15px;

#navbar a {
color: #3a3a3a;
border: none;
padding: 15px 30px;
}

ul.top-nav li a {
display: block;
text-decoration: none;
border-bottom: none;
font-weight: 400;
#navbar a:hover {
color: #999;
}

ul.top-nav li a:hover {
color: #999;
.navbar-toggle {
background-color: white;
border: none;
}

.openframe {
Expand Down Expand Up @@ -327,6 +325,11 @@ ul.features li.see-more a {
.q-a a {
color: #FFF;
text-align: center;
border-bottom-color: #FFF;
}

.q-a a:hover {
color: #999;
}

.q-a h5 {
Expand Down Expand Up @@ -389,9 +392,17 @@ ul.features li.see-more a {
*/

@media (min-width: 768px) {
.navbar {
/* .navbar {
border-bottom: 1px solid #777777;
} */
#navbar {
padding: 0px 15px;
}

#navbar a {
padding: 15px 15px;
}

html#Website body .container {
width: 700px;
}
Expand All @@ -405,16 +416,6 @@ ul.features li.see-more a {

@media (max-width: 767px) {

ul.top-nav {
text-align: center;
padding-left: 0px;
}

.top-nav-wrap {
text-align: center;
padding-right: 0px
}

.row {
margin-right: 0px;
margin-left: 0px;
Expand Down
46 changes: 35 additions & 11 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,37 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Openframe</title>
<link href='https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,700,700italic,900' rel='stylesheet' type='text/css'>
<link rel='shortcut icon' type='image/x-icon' href='https://openframeproject.github.io/img/favicon.ico' />
<link rel="stylesheet" type="text/css" href="https://openframeproject.github.io/vendor/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://openframeproject.github.io/css/landing-manual.css">
<link rel='shortcut icon' type='image/x-icon' href='img/favicon.ico' />
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/landing-manual.css">
<!--<link rel="stylesheet" type="text/css" href="/css/landing-manual.css">-->

</head>

<body>

<!-- Nav, Page Heading, Preview Image -->
<div class="top-nav-wrap">
<ul class="top-nav">
<li><a href="http://docs.openframe.io/frame-setup-guide">Setup a frame</a></li>
<li><a href="https://openframe.io/stream">Explore the web app</a></li>
</ul>
</div>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="https://openframe.io/stream">Artwork stream</a></li>
<li><a href="https://docs.openframe.io/">Documentation</a></li>
<li><a href="https://openframe.discourse.group/">Forum</a></li>
<li><a href="https://github.com/OpenFrameProject">Contribute</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>


<div class="container-wide">
<div class="row page-header splash-header">
<div class="col-md-12">
Expand Down Expand Up @@ -177,6 +192,13 @@ <h5>Why this project?</h5>
<p>We want to build an open source platform that can be modified and extended to support new media types and sensor-based artwork, and that can be easily set up using a range of inexpensive hardware (Raspberry Pi, Odroid, etc.). With Openframe, we want to create a conduit through which an audience can experience and appreciate art in new ways, and which allows artists to give new life to their work.</p>
</section>

<section>
<h5>Where can I find help?</h5>

<p>First, have a look at our <a href="https://docs.openframe.io/">documentation</a> and check if you might find a solution to your problem on the <a href="https://openframe.discourse.group/">forum</a>.</p>
<p>In addition, it might be worth checking if your issue has been described in the <a href="https://github.com/OpenframeProject/Openframe/issues">Openframe for Raspberry Pi</a> and <a href="https://github.com/OpenframeProject/Openframe-WebApp/issues">Openframe Web App</a> issue trackers.</p>
</section>

<section>
<h5>What artwork can I display?</h5>

Expand All @@ -188,7 +210,7 @@ <h5>What artwork can I display?</h5>
<section>
<h5>The installation seems complicated, I just want to buy a frame.</h5>

<p>Openframe is not a product. However, there are an ever growing number of existing commercial products that you can buy, plug to the wall, and <em>voilà</em> &mdash; they work. Check out <a href="https://www.electricobjects.com/">Electric Objects</a> or <a href="https://frm.fm/">Framed</a>.</p>
<p>Openframe is not a product. However, there are an ever growing number of existing commercial products that you can buy, plug to the wall, and <em>voilà</em> &mdash; they work. Check out <a href="https://www.electricobjects.com/" target="_blank">Electric Objects</a> or <a href="https://frm.fm/" target="_blank">Framed</a>.</p>
</section>


Expand All @@ -211,6 +233,8 @@ <h6><a href="http://jonathanwohl.com/">Jon Wohl</a> and <a href="http://ishback.
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>
</body>

<!-- Google Analytics -->
Expand Down