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,16 +1,15 @@
@extends('public.header') @extends('public.header')
@section('content') @section('content')
<section class="hero background hero-about" data-speed="2" data-type="background"> <section class="hero background hero-about" data-speed="2" data-type="background">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<h1><img src="{{ asset('images/icon-about.png') }}"><span class="thin">About</span> Invoice Ninja</h1> <h1><img src="{{ asset('images/icon-about.png') }}"><span class="thin">About</span> Invoice Ninja</h1>
</div> </div>
</div> </div>
</section> </section>
</section>
<section class="about"> <section class="about">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-5 valign"> <div class="col-md-5 valign">
@ -23,13 +22,14 @@
<img src="{{ asset('images/devices3.png') }}"> <img src="{{ asset('images/devices3.png') }}">
</div> </div>
</div> </div>
</div>
</section> </section>
<section class="team center"> <section class="team center">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-8 col-md-offset-2">
<h2>Team Ninja</h2> <h2>Team Ninja</h2>
<p>Invoice Ninja is managed by a team of seasoned web workers. We <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 launched in early 2014 and have been thrilled by the enthusiastic response weve
received from our growing community of users.</p> received from our growing community of users.</p>
@ -59,7 +59,6 @@
</p> </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> <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>
<div class="col-md-3"> <div class="col-md-3">
<div class="img-team"> <div class="img-team">
<img src="images/razikantorp.jpg" alt="Razi Kantorp"> <img src="images/razikantorp.jpg" alt="Razi Kantorp">
@ -71,7 +70,6 @@
<a href="http://instagram.com/kantorpweglin" target="_blank"><img src="images/instagram.svg" alt="Twitter"></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> <a href="http://kantorp-wegl.in/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p> </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> <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>
<div class="col-md-3"> <div class="col-md-3">
@ -86,13 +84,10 @@
<a href="http://actionpackedmedia.com/" target="_blank"><img src="images/website.svg" alt="Website"></a> <a href="http://actionpackedmedia.com/" target="_blank"><img src="images/website.svg" alt="Website"></a>
</p> </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>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> </p>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
@stop @stop

View File

@ -2,28 +2,23 @@
@section('content') @section('content')
<section class="hero background hero-faq" data-speed="2" data-type="background">
<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>
</div>
</div>
</section>
<section class="faq">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-7"> <h1><span class="thin">THE</span> FAQs</h1>
</div>
</div>
</section>
<section class="faq">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="question"> <div class="question">
<a class="expander" href="#">I know it isnt standard <a class="expander" href="#">I know it isnt standard
ninja practice to reveal too many identity details, but ninja practice to reveal too many identity details, but
who are you guys exactly?</a> who are you guys exactly?
</a>
<div class="content"> <div class="content">
<p>Were a small team of highly skilled digital <p>Were a small team of highly skilled digital
journeymen based in Israel. We love open source, we journeymen based in Israel. We love open source, we
@ -32,51 +27,51 @@
We believe that everyone elses web-based cash flow We believe that everyone elses web-based cash flow
tools are unnecessarily expensive, clunky and tools are unnecessarily expensive, clunky and
complicated - and were bent on proving these complicated - and were bent on proving these
beliefs with Invoice Ninja.</p> beliefs with Invoice Ninja.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">How do I get started using <a class="expander" href="#">How do I get started using
Invoice Ninja?</a> Invoice Ninja?
</a>
<div class="content"> <div class="content">
<p>Just click on the big, yellow “Invoice Now” <p>Just click on the big, yellow “Invoice Now”
button on our homepage!</p> button on our homepage!
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">Do you offer customer <a class="expander" href="#">Do you offer customer
support?</a> support?
</a>
<div class="content"> <div class="content">
<p>We sure do. Support is super important to us. <p>We sure do. Support is super important to us.
Feel free to email us at <a href= Feel free to email us at <a href=
"mailto:support@invoiceninja.com">support@invoiceninja.com</a> "mailto:support@invoiceninja.com">support@invoiceninja.com</a>
with any questions you might have. We almost always with any questions you might have. We almost always
reply within one business day.</p> reply within one business day.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">Is Invoice Ninja really <a class="expander" href="#">Is Invoice Ninja really
free? For how long?</a> free? For how long?
</a>
<div class="content"> <div class="content">
<p>Yes, our basic app is 100% free. Forever and ever. For real. We <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 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 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 important to us that the free version have all of the key features people
need to do business. </p> need to do business.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">How is Invoice Ninja able <a class="expander" href="#">How is Invoice Ninja able
to offer this all for free? How are you making any to offer this all for free? How are you making any
money?</a> money?
</a>
<div class="content"> <div class="content">
<p>Were mostly in this line of work because we believe its high time that <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 a good electronic invoicing tool be available for free. There isnt much money
@ -89,24 +84,23 @@
recover our investment.</p> recover our investment.</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">Really? So does that mean <a class="expander" href="#">Really? So does that mean
youre not collecting information about me so you can youre not collecting information about me so you can
sell me stuff or so that some other company can spam me sell me stuff or so that some other company can spam me
according to my interests?</a> according to my interests?
</a>
<div class="content"> <div class="content">
<p>No way. Were not mining your data, and were <p>No way. Were not mining your data, and were
not selling you out. That wouldnt be very ninja of not selling you out. That wouldnt be very ninja of
us, would it?</p> us, would it?
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">But dont you have access <a class="expander" href="#">But dont you have access
to my merchant and banking accounts?</a> to my merchant and banking accounts
</a>
<div class="content"> <div class="content">
<p>Actually, we dont. When you link an account at <p>Actually, we dont. When you link an account at
a third party financial institution with your a third party financial institution with your
@ -115,15 +109,15 @@
more. This is all managed by the tech teams at your more. This is all managed by the tech teams at your
financial service providers, who go to great financial service providers, who go to great
lengths to ensure their integrations cant be lengths to ensure their integrations cant be
exploited or abused.</p> exploited or abused.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">Given that Invoice Ninja <a class="expander" href="#">Given that Invoice Ninja
is an open source app, how can I be sure that my is an open source app, how can I be sure that my
financial information is safe with you?</a> financial information is safe with you?
</a>
<div class="content"> <div class="content">
<p>Theres a big difference between “open source” <p>Theres a big difference between “open source”
and “open data. Anyone who wants to use the code and “open data. Anyone who wants to use the code
@ -136,14 +130,14 @@
who has full access to what you're doing with our who has full access to what you're doing with our
product. For more details on the security of our product. For more details on the security of our
servers and how we handle our users information, servers and how we handle our users information,
please read the next question.</p> please read the next question.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">So just how secure is this <a class="expander" href="#">So just how secure is this
app?</a> app?
</a>
<div class="content"> <div class="content">
<p>Extremely. Data uploaded by our users runs <p>Extremely. Data uploaded by our users runs
through connections with 256-bit encryption, which through connections with 256-bit encryption, which
@ -153,52 +147,63 @@
message authentication and DHE_RSA key exchanges. message authentication and DHE_RSA key exchanges.
Its fancy stuff that we put in place to make sure Its fancy stuff that we put in place to make sure
no one can gain access to your information except no one can gain access to your information except
you.</p> you.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">Im interested in removing <a class="expander" href="#">Im interested in removing
the small "Created by Invoice Ninja” image from the the small "Created by Invoice Ninja” image from the
bottom of my invoices. Will you one day offer a bottom of my invoices. Will you one day offer a
premium, non-branded or otherwise white label-able premium, non-branded or otherwise white label-able
version of Invoice Ninja?</a> version of Invoice Ninja?
</a>
<div class="content"> <div class="content">
<p>We are considering one day exploring optional <p>We are considering one day exploring optional
features like this and will be happy to hear from features like this and will be happy to hear from
you with any suggestions.</p> you with any suggestions.
</p>
</div> </div>
</div> </div>
<div class="question"> <div class="question">
<a class="expander" href="#">My question wasnt covered <a class="expander" href="#">My question wasnt covered
by any of the content on this FAQ page. How can I get by any of the content on this FAQ page. How can I get
in touch with you?</a> in touch with you?
</a>
<div class="content"> <div class="content">
<p>Please email us at <a href= <p>Please email us at <a href=
"mailto:contact@invoiceninja.com">contact@invoiceninja.com</a> "mailto:contact@invoiceninja.com">contact@invoiceninja.com</a>
with any questions or comments you have. We love with any questions or comments you have. We love
hearing from the people who use our app! Well do hearing from the people who use our app! Well do
our best to reply to your email within the business our best to reply to your email within the business
day.</p> day.
</p>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="col-md-4 col-md-offset-1"> <div class="row">
<div class="col-md-12">
<div class="contact-box"> <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> <h2>Did we miss something?</h2>
</div>
<div class="col-md-8 valign">
<p>Please email us at <a href= <p>Please email us at <a href=
"mailto:contact@invoiceninja.com" style= "mailto:contact@invoiceninja.com" style=
"font-weight: bold">contact@invoiceninja.com</a> with "font-weight: bold">contact@invoiceninja.com</a> with
any questions or comments you have. We love hearing any questions or comments you have. We love hearing
from the people who use our app! Well do our best to from the people who use our app! Well do our best to
reply to your email within the business day.</p> reply to your email within the business day.
</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</section>@stop </div>
</div>
</section>
@stop

View File

@ -9,14 +9,15 @@
<link href="{{ asset('css/bootstrap.splash.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-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-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"> <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="//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> <script src="{{ asset('js/valign.js') }}" type="text/javascript"></script>
<style> <style>
@ -38,6 +39,9 @@
.hero-secure { .hero-secure {
background-image: url({{ asset('/images/hero-bg-secure-pay.jpg') }}); background-image: url({{ asset('/images/hero-bg-secure-pay.jpg') }});
} }
.hero-faq {
background-image: url({{ asset('/images/hero-bg-faq.jpg') }});
}
</style> </style>
@stop @stop
@ -88,7 +92,6 @@
$('#startForm').submit(); $('#startForm').submit();
return false; return false;
} }
</script> </script>
<div class="navbar" style="margin-bottom:0px"> <div class="navbar" style="margin-bottom:0px">
@ -448,11 +451,15 @@
</footer> </footer>
<script type="text/javascript"> <script type="text/javascript">
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
$('.valign').vAlign(); $('.valign').vAlign();
}); });
</script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.expander').simpleexpand();
});
</script> </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; line-height: 1.6;
background-color: #fff; background-color: #fff;
overflow-x: hidden; overflow-x: hidden;
color: #2e2b2b;
} }
.center-block { .center-block {
margin: 0 auto!; margin: 0 auto!;
@ -15,7 +16,7 @@ h2,
font-family: Roboto, sans-serif; font-family: Roboto, sans-serif;
font-weight: 900; font-weight: 900;
line-height: 1.1; line-height: 1.1;
color: #1a1818; color: #2e2b2b;
} }
h1 { h1 {
font-size: 56px; font-size: 56px;
@ -512,26 +513,46 @@ section.faq a.expander {
font-weight: 700; font-weight: 700;
margin-bottom: 10px; margin-bottom: 10px;
} }
section.faq .content{display:none;}
section.faq .question { section.faq .question {
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: 30px; margin-bottom: 30px;
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;
} }
section.faq .contact-box { section.faq .contact-box {
padding: 20px; margin-top: 30px;
text-align: center; padding: 40px;
color: #fff; color: #4f4747;
background: #2299c0; background: #fad129;
} }
section.faq .contact-box h2 { section.faq .contact-box h2 {
margin: 30px 0 15px; text-transform: uppercase;
color: #fff; 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 { section.faq .contact-box a {
color: #2e2b2b; color: #2e2b2b;
} }
section.faq .contact-box p { section.faq .contact-box p {
margin-bottom: 30px;
} }
.btn-primary { .btn-primary {
color: #fff; color: #fff;
@ -691,6 +712,32 @@ footer.footer form#mad_mimi_signup_form input {
section.about .col-md-5 { section.about .col-md-5 {
padding-left: 15px !important; 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 { .navbar {
text-align: center; text-align: center;
padding: 25px 0 18px; 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; padding: 40px 0;
margin: 0 !important; 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