Merge pull request #130 from raziraz/master

FAQ page and some code cleaning
This commit is contained in:
Hillel Coren 2014-06-12 20:11:47 +03:00
commit 3b5fe6ee9c
11 changed files with 338 additions and 32199 deletions

View File

@ -1,98 +1,93 @@
@extends('public.header')
@section('content')
<section class="hero background hero-about" data-speed="2" data-type="background">
<div class="container">
<div class="row">
<h1><img src="{{ asset('images/icon-about.png') }}"><span class="thin">About</span> Invoice Ninja</h1>
<section class="hero background hero-about" data-speed="2" data-type="background">
<div class="container">
<div class="row">
<h1><img src="{{ asset('images/icon-about.png') }}"><span class="thin">About</span> Invoice Ninja</h1>
</div>
</div>
</section>
</section>
<section class="about">
<div class="container">
<div class="row">
<div class="col-md-5 valign">
<div class="headline">
<h2>What is Invoice Ninja?</h2>
</div>
<p class="first">Invoice Ninja is a free, open-source solution for invoicing and billing customers. With Invoice Ninja, you can easily build and send beautiful invoices from any device that has access to the web. Your clients can print your invoices, download them as pdf files, and even pay you online from within the system.</p>
</div>
<div class="col-md-7">
<img src="{{ asset('images/devices3.png') }}">
</section>
<section class="about">
<div class="container">
<div class="row">
<div class="col-md-5 valign">
<div class="headline">
<h2>What is Invoice Ninja?</h2>
</div>
<p class="first">Invoice Ninja is a free, open-source solution for invoicing and billing customers. With Invoice Ninja, you can easily build and send beautiful invoices from any device that has access to the web. Your clients can print your invoices, download them as pdf files, and even pay you online from within the system.</p>
</div>
<div class="col-md-7">
<img src="{{ asset('images/devices3.png') }}">
</div>
</div>
</div>
</div>
</section>
<section class="team center">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h2>Team Ninja</h2>
<p>Invoice Ninja is managed by a team of seasoned web workers. We
launched in early 2014 and have been thrilled by the enthusiastic response weve
received from our growing community of users.</p>
</div>
</div>
<div class="row">
<div class="col-md-3">
<div class="img-team">
<img src="images/shalomstark.jpg" alt="Shalom Stark">
</div>
<h2>Shalom Stark</h2>
<p>Co-Founder, CEO</p>
<p class="social blue"><a href="https://twitter.com/shalomstark" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://shalomisraeltours.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Shalom has specialized in small business development for nearly 10 years. In addition to InvoiceNinja.com Shalom is CEO of a leading tour agency in Israel.</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/hillelcoren.jpg" alt="Hillel Coren">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h2>Team Ninja</h2>
<p>Invoice Ninja is managed by a team of seasoned web workers. We
launched in early 2014 and have been thrilled by the enthusiastic response weve
received from our growing community of users.</p>
</div>
<h2>Hillel Coren</h2>
<p>Co-Founder, CTO</p>
<p class="social green"><a href="https://twitter.com/hillelcoren" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://www.linkedin.com/profile/view?id=105143214" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://hillelcoren.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Hillel has been developing enterprise applications for 15 years. His open-source <a href="http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=1721530" target="_blank">AutoComplete</a> component has been used by thousands of developers around the world.</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/razikantorp.jpg" alt="Razi Kantorp">
</div>
<div class="row">
<div class="col-md-3">
<div class="img-team">
<img src="images/shalomstark.jpg" alt="Shalom Stark">
</div>
<h2>Razi Kantorp-Weglin</h2>
<p>Designer</p>
<p class="social red"><a href="https://twitter.com/kantorpweglin" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="https://www.linkedin.com/pub/razi-kantorp/35/368/973" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://instagram.com/kantorpweglin" target="_blank"><img src="images/instagram.svg" alt="Twitter"></a>
<a href="http://kantorp-wegl.in/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Razi is a pixel nerd with a great deal of experience in design for web sites and applications. When she isn't busy with InvoiceNinja she runs a small web agency in Stockholm called kantorp-wegl.in</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/benjacobson.jpg" alt="Ben Jacobsen">
</div>
<h2>Ben Jacobson</h2>
<p>Marketing</p>
<p class="social yellow"><a href="https://twitter.com/osbennn" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://www.linkedin.com/in/osbennn" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://about.me/osbennn" target="_blank"><img src="images/me.svg" alt="Me"></a>
<a href="http://actionpackedmedia.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>A veteran digital marketer and content strategist, Ben specializes in building communities around brands that make business easier for freelancers, SMBs and micro-entrepreneurs.
</p>
</div>
<h2>Shalom Stark</h2>
<p>Co-Founder, CEO</p>
<p class="social blue"><a href="https://twitter.com/shalomstark" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://shalomisraeltours.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Shalom has specialized in small business development for nearly 10 years. In addition to InvoiceNinja.com Shalom is CEO of a leading tour agency in Israel.</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/hillelcoren.jpg" alt="Hillel Coren">
</div>
<h2>Hillel Coren</h2>
<p>Co-Founder, CTO</p>
<p class="social green"><a href="https://twitter.com/hillelcoren" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://www.linkedin.com/profile/view?id=105143214" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://hillelcoren.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Hillel has been developing enterprise applications for 15 years. His open-source <a href="http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=1721530" target="_blank">AutoComplete</a> component has been used by thousands of developers around the world.</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/razikantorp.jpg" alt="Razi Kantorp">
</div>
<h2>Razi Kantorp-Weglin</h2>
<p>Designer</p>
<p class="social red"><a href="https://twitter.com/kantorpweglin" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="https://www.linkedin.com/pub/razi-kantorp/35/368/973" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://instagram.com/kantorpweglin" target="_blank"><img src="images/instagram.svg" alt="Twitter"></a>
<a href="http://kantorp-wegl.in/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>Razi is a pixel nerd with a great deal of experience in design for web sites and applications. When she isn't busy with InvoiceNinja she runs a small web agency in Stockholm called kantorp-wegl.in</p>
</div>
<div class="col-md-3">
<div class="img-team">
<img src="images/benjacobson.jpg" alt="Ben Jacobsen">
</div>
<h2>Ben Jacobson</h2>
<p>Marketing</p>
<p class="social yellow"><a href="https://twitter.com/osbennn" target="_blank"><img src="images/twitter.svg" alt="Twitter"></a>
<a href="http://www.linkedin.com/in/osbennn" target="_blank"><img src="images/linkedin.svg" alt=""></a>
<a href="http://about.me/osbennn" target="_blank"><img src="images/me.svg" alt="Me"></a>
<a href="http://actionpackedmedia.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p>
<p>A veteran digital marketer and content strategist, Ben specializes in building communities around brands that make business easier for freelancers, SMBs and micro-entrepreneurs.
</p>
</div>
</div>
</div>
</div>
</section>
@stop

View File

@ -2,83 +2,78 @@
@section('content')
<section class="hero background hero5" data-speed="2" data-type="background">
<div class="caption-side"></div>
<div class="container">
<div class="row" style="margin:0;">
<div class="caption-wrap">
<div class="caption">
<h1>THE <span style="color:#2299c0">Faq's</span>
</div>
</div>
<section class="hero background hero-faq" data-speed="2" data-type="background">
<div class="container">
<div class="row">
<h1><span class="thin">THE</span> FAQs</h1>
</div>
</div>
</section>
<section class="faq">
<div class="container">
<div class="row">
<div class="col-md-7">
<div class="question">
<a class="expander" href="#">I know it isnt standard
ninja practice to reveal too many identity details, but
who are you guys exactly?</a>
</div>
</section>
<div class="content">
<p>Were a small team of highly skilled digital
<section class="faq">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="question">
<a class="expander" href="#">I know it isnt standard
ninja practice to reveal too many identity details, but
who are you guys exactly?
</a>
<div class="content">
<p>Were a small team of highly skilled digital
journeymen based in Israel. We love open source, we
love disrupting the big business status quo, and we
love building helpful tools that are easy to use.
We believe that everyone elses web-based cash flow
tools are unnecessarily expensive, clunky and
complicated - and were bent on proving these
beliefs with Invoice Ninja.</p>
</div>
beliefs with Invoice Ninja.
</p>
</div>
<div class="question">
<a class="expander" href="#">How do I get started using
Invoice Ninja?</a>
<div class="content">
<p>Just click on the big, yellow “Invoice Now”
button on our homepage!</p>
</div>
</div>
<div class="question">
<a class="expander" href="#">How do I get started using
Invoice Ninja?
</a>
<div class="content">
<p>Just click on the big, yellow “Invoice Now”
button on our homepage!
</p>
</div>
<div class="question">
<a class="expander" href="#">Do you offer customer
support?</a>
<div class="content">
<p>We sure do. Support is super important to us.
</div>
<div class="question">
<a class="expander" href="#">Do you offer customer
support?
</a>
<div class="content">
<p>We sure do. Support is super important to us.
Feel free to email us at <a href=
"mailto:support@invoiceninja.com">support@invoiceninja.com</a>
with any questions you might have. We almost always
reply within one business day.</p>
</div>
reply within one business day.
</p>
</div>
<div class="question">
<a class="expander" href="#">Is Invoice Ninja really
free? For how long?</a>
<div class="content">
<p>Yes, our basic app is 100% free. Forever and ever. For real. We
</div>
<div class="question">
<a class="expander" href="#">Is Invoice Ninja really
free? For how long?
</a>
<div class="content">
<p>Yes, our basic app is 100% free. Forever and ever. For real. We
also offer a paid Pro version of Invoice Ninja (you can learn all about
its awesome features <a href="https://www.invoiceninja.com/plans">here</a>, but it's
important to us that the free version have all of the key features people
need to do business. </p>
</div>
need to do business.
</p>
</div>
<div class="question">
<a class="expander" href="#">How is Invoice Ninja able
</div>
<div class="question">
<a class="expander" href="#">How is Invoice Ninja able
to offer this all for free? How are you making any
money?</a>
<div class="content">
<p>Were mostly in this line of work because we believe its high time that
money?
</a>
<div class="content">
<p>Were mostly in this line of work because we believe its high time that
a good electronic invoicing tool be available for free. There isnt much money
in it - yet. We do offer a paid <a href="https://www.invoiceninja.com/plans">Pro </a>
version of the app that we've souped up with premium features. And when our users open up new
@ -87,45 +82,44 @@
start running credit card charges through Invoice Ninja, or if scores of users go
<a href="https://www.invoiceninja.com/plans">Pro</a>, theres a decent chance we'll
recover our investment.</p>
</div>
</div>
<div class="question">
<a class="expander" href="#">Really? So does that mean
</div>
<div class="question">
<a class="expander" href="#">Really? So does that mean
youre not collecting information about me so you can
sell me stuff or so that some other company can spam me
according to my interests?</a>
<div class="content">
<p>No way. Were not mining your data, and were
according to my interests?
</a>
<div class="content">
<p>No way. Were not mining your data, and were
not selling you out. That wouldnt be very ninja of
us, would it?</p>
</div>
us, would it?
</p>
</div>
<div class="question">
<a class="expander" href="#">But dont you have access
to my merchant and banking accounts?</a>
<div class="content">
<p>Actually, we dont. When you link an account at
</div>
<div class="question">
<a class="expander" href="#">But dont you have access
to my merchant and banking accounts
</a>
<div class="content">
<p>Actually, we dont. When you link an account at
a third party financial institution with your
Invoice Ninja account, youre essentially giving
our app permission to send money to you and nothing
more. This is all managed by the tech teams at your
financial service providers, who go to great
lengths to ensure their integrations cant be
exploited or abused.</p>
</div>
exploited or abused.
</p>
</div>
<div class="question">
<a class="expander" href="#">Given that Invoice Ninja
</div>
<div class="question">
<a class="expander" href="#">Given that Invoice Ninja
is an open source app, how can I be sure that my
financial information is safe with you?</a>
<div class="content">
<p>Theres a big difference between “open source”
financial information is safe with you?
</a>
<div class="content">
<p>Theres a big difference between “open source”
and “open data. Anyone who wants to use the code
that drives Invoice Ninja to create their own
products or to make improvements to ours can do so.
@ -136,15 +130,15 @@
who has full access to what you're doing with our
product. For more details on the security of our
servers and how we handle our users information,
please read the next question.</p>
</div>
please read the next question.
</p>
</div>
<div class="question">
<a class="expander" href="#">So just how secure is this
app?</a>
<div class="content">
</div>
<div class="question">
<a class="expander" href="#">So just how secure is this
app?
</a>
<div class="content">
<p>Extremely. Data uploaded by our users runs
through connections with 256-bit encryption, which
is twice as many encryption bits that most bank
@ -153,52 +147,63 @@
message authentication and DHE_RSA key exchanges.
Its fancy stuff that we put in place to make sure
no one can gain access to your information except
you.</p>
</div>
you.
</p>
</div>
<div class="question">
<a class="expander" href="#">Im interested in removing
</div>
<div class="question">
<a class="expander" href="#">Im interested in removing
the small "Created by Invoice Ninja” image from the
bottom of my invoices. Will you one day offer a
premium, non-branded or otherwise white label-able
version of Invoice Ninja?</a>
<div class="content">
<p>We are considering one day exploring optional
version of Invoice Ninja?
</a>
<div class="content">
<p>We are considering one day exploring optional
features like this and will be happy to hear from
you with any suggestions.</p>
</div>
you with any suggestions.
</p>
</div>
<div class="question">
<a class="expander" href="#">My question wasnt covered
</div>
<div class="question">
<a class="expander" href="#">My question wasnt covered
by any of the content on this FAQ page. How can I get
in touch with you?</a>
<div class="content">
<p>Please email us at <a href=
in touch with you?
</a>
<div class="content">
<p>Please email us at <a href=
"mailto:contact@invoiceninja.com">contact@invoiceninja.com</a>
with any questions or comments you have. We love
hearing from the people who use our app! Well do
our best to reply to your email within the business
day.</p>
</div>
</div>
</div>
<div class="col-md-4 col-md-offset-1">
<div class="contact-box">
<h2>Did we miss something?</h2>
<p>Please email us at <a href=
"mailto:contact@invoiceninja.com" style=
"font-weight: bold">contact@invoiceninja.com</a> with
any questions or comments you have. We love hearing
from the people who use our app! Well do our best to
reply to your email within the business day.</p>
day.
</p>
</div>
</div>
</div>
</div>
</section>@stop
<div class="row">
<div class="col-md-12">
<div class="contact-box">
<div class="row">
<div class="col-md-4">
<img src="{{ asset('images/icon-faq.png') }}">
<h2>Did we miss something?</h2>
</div>
<div class="col-md-8 valign">
<p>Please email us at <a href=
"mailto:contact@invoiceninja.com" style=
"font-weight: bold">contact@invoiceninja.com</a> with
any questions or comments you have. We love hearing
from the people who use our app! Well do our best to
reply to your email within the business day.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
@stop

View File

@ -7,16 +7,17 @@
<!--
<link href="{{ asset('vendor/bootstrap/dist/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset('css/bootstrap.splash.css') }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset('css/splash.css') }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset('css/splash.css') }}" rel="stylesheet" type="text/css"/>
-->
<link href="{{ asset('css/splash.css') }}" rel="stylesheet" type="text/css"/>
<!--
<link href="{{ asset('images/apple-touch-icon-114x114-precomposed.png') }}" rel="apple-touch-icon-precomposed" sizes="114x114">
<link href="{{ asset('images/apple-touch-icon-72x72-precomposed.png') }}" rel="apple-touch-icon-precomposed" sizes="72x72">
<link href="{{ asset('images/apple-touch-icon-57x57-precomposed.png') }}" rel="apple-touch-icon-precomposed">
<!-- <script src="{{ asset('js/simpleexpand.js') }}" type="text/javascript"></script> -->
-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="{{ asset('js/simpleexpand.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/valign.js') }}" type="text/javascript"></script>
<style>
@ -37,7 +38,10 @@
}
.hero-secure {
background-image: url({{ asset('/images/hero-bg-secure-pay.jpg') }});
}
}
.hero-faq {
background-image: url({{ asset('/images/hero-bg-faq.jpg') }});
}
</style>
@stop
@ -88,8 +92,7 @@
$('#startForm').submit();
return false;
}
</script>
</script>
<div class="navbar" style="margin-bottom:0px">
<div class="container">
@ -448,11 +451,15 @@
</footer>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.valign').vAlign();
});
</script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.expander').simpleexpand();
});
</script>
<!--

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -3,6 +3,7 @@ body {
line-height: 1.6;
background-color: #fff;
overflow-x: hidden;
color: #2e2b2b;
}
.center-block {
margin: 0 auto!;
@ -15,7 +16,7 @@ h2,
font-family: Roboto, sans-serif;
font-weight: 900;
line-height: 1.1;
color: #1a1818;
color: #2e2b2b;
}
h1 {
font-size: 56px;
@ -512,26 +513,46 @@ section.faq a.expander {
font-weight: 700;
margin-bottom: 10px;
}
section.faq .content{display:none;}
section.faq .question {
padding-bottom: 20px;
margin-bottom: 30px;
border-bottom: 1px solid #e0e0e0;
}
section.faq .contact-box {
padding: 20px;
text-align: center;
color: #fff;
background: #2299c0;
margin-top: 30px;
padding: 40px;
color: #4f4747;
background: #fad129;
}
section.faq .contact-box h2 {
margin: 30px 0 15px;
color: #fff;
text-transform: uppercase;
display: block;
float: left;
width: 60%;
margin-top: 0;
margin-bottom: 0;
padding: 2px 0;
}
section.faq .contact-box img {
float: left;
display: block;
margin-right: 20px;
margin-left: 30px;
height: 57px;
}
section.faq .contact-box .col-md-8 {
padding-left: 5px;
}
section.faq .contact-box h2 {
border-right: 1px solid #e4bf28;
}
section.faq .contact-box a {
color: #2e2b2b;
}
section.faq .contact-box p {
margin-bottom: 30px;
}
.btn-primary {
color: #fff;
@ -691,6 +712,32 @@ footer.footer form#mad_mimi_signup_form input {
section.about .col-md-5 {
padding-left: 15px !important;
}
section.faq .contact-box {
margin-top: 20px;
padding: 25px;
text-align: center;
}
section.faq .contact-box h2 {
float: none;
width: 100%;
margin: 10px 0;
}
section.faq .contact-box img {
float: none;
display: inline-block;
margin-right: 0;
margin-left: 0;
height: 57px;
}
section.faq .contact-box .col-md-8 {
padding-left: 15px;
}
section.faq .contact-box h2 {
border-right: none;
}
section.faq .contact-box p {
margin: 0;
}
.navbar {
text-align: center;
padding: 25px 0 18px;
@ -734,7 +781,7 @@ footer.footer form#mad_mimi_signup_form input {
}
section.features, section.blue, section, section.secure, section.about, section.team, section.contact {
section.features, section.blue, section, section.secure, section.about, section.team, section.contact, section.faq {
padding: 40px 0;
margin: 0 !important;
}

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
public/images/icon-faq.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB