diff --git a/css/_base.scss b/css/_base.scss index 651eece..2611337 100644 --- a/css/_base.scss +++ b/css/_base.scss @@ -79,4 +79,13 @@ h5 { .width-50 { width: 50%; text-align: center; +} + +span.code { + font-family: "Courier"; + background: rgba(0,0,0,.05); + border: 1px solid rgba(0,0,0,.1); + padding: 2px; + border-radius: 2px; + font-size: 14px; } \ No newline at end of file diff --git a/css/_faq.scss b/css/_faq.scss new file mode 100644 index 0000000..cddabd6 --- /dev/null +++ b/css/_faq.scss @@ -0,0 +1,103 @@ +#page-faq { + + #header { + height: auto; + position: static; + background-image: none; + } + + .container { + top: auto; + + article { + border-top: 1px solid #eee; + padding: 10px 0 15px; + } + + h1 { + font-size: 36px; + font-weight: bold; + color: $dark-blue; + margin-bottom: 10px; + } + #what { + border-top: 0; + padding: 0; + p { + font-size: 24px; + line-height: 32px; + margin-bottom: 20px; + margin-top: 0; + } + } + article:not(#what) p { + font-size: 18px; + line-height: 22px; + } + h2 { + font-size: 24px; + font-weight: bold; + color: $dark-blue; + margin-bottom: 5px; + } + h2 + p { + margin-top: 0; + } + strong { + color: $dark-blue; + opacity: .6; + } + .icon-mac, + .icon-win { + position: relative; + padding-left: 50px; + + &:before { + position: absolute; + left: 18px; + top: 0; + } + } + .warning { + padding: 10px 10px 10px 50px; + border-radius: 2px; + position: relative; + + &:before { + position: absolute; + top: 10px; + left: 18px; + font-family: 'popcorn'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + margin-right: 10px; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + content: "\e60d"; + font-size: 18px; + color: #858230; + } + + a { + color: #858230; + font-weight: bold; + + &:hover { + text-decoration: none; + } + } + } + + .step-code li { + list-style: none; + padding: 5px 0 5px 10px; + } + } +} + diff --git a/css/_header.scss b/css/_header.scss index ffe1a71..902aa35 100644 --- a/css/_header.scss +++ b/css/_header.scss @@ -13,6 +13,71 @@ -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); + + nav { + position: relative; + + .align-left { + position: absolute; + top: 0; + left: 0; + } + .align-right { + position: absolute; + top: 0; + right: 0; + } + ul { + list-style: none; + margin: 5px 0; + padding: 0; + + li { + display: inline-block; + margin: 0 10px; + } + + li.text { + font-size: 18px; + padding: 0; + + a { + color: #fff; + text-decoration: none; + } + } + li.social a { + display: block; + width: 26px; + height: 26px; + text-align: center; + color: #fff; + text-decoration: none; + line-height: 32px; + border-radius: 50%; + position: relative; + + &.icon-facebook:before { + font-size: 16px; + position: absolute; + top: 5px; + left: 9px; + } + &.icon-twitter:before { + font-size: 12px; + position: absolute; + top: 7px; + left: 6px; + } + &.icon-github:before { + position: absolute; + top: 0px; + left: 0px; + font-size: 25px; + } + } + } + } .text { padding: 0 0 40px; diff --git a/css/style.css b/css/style.css index 65c5d3d..a7b2b49 100755 --- a/css/style.css +++ b/css/style.css @@ -2728,6 +2728,14 @@ h5 { width: 50%; text-align: center; } +span.code { + font-family: "Courier"; + background: rgba(0, 0, 0, 0.05); + border: 1px solid rgba(0, 0, 0, 0.1); + padding: 2px; + border-radius: 2px; + font-size: 14px; } + [class^="btn-"] { border-radius: 3px; box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.4), inset 0px 1px rgba(255, 255, 255, 0.2); @@ -2798,6 +2806,54 @@ h5 { -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); } + #header nav { + position: relative; } + #header nav .align-left { + position: absolute; + top: 0; + left: 0; } + #header nav .align-right { + position: absolute; + top: 0; + right: 0; } + #header nav ul { + list-style: none; + margin: 5px 0; + padding: 0; } + #header nav ul li { + display: inline-block; + margin: 0 10px; } + #header nav ul li.text { + font-size: 18px; + padding: 0; } + #header nav ul li.text a { + color: #fff; + text-decoration: none; } + #header nav ul li.social a { + display: block; + width: 26px; + height: 26px; + text-align: center; + color: #fff; + text-decoration: none; + line-height: 32px; + border-radius: 50%; + position: relative; } + #header nav ul li.social a.icon-facebook:before { + font-size: 16px; + position: absolute; + top: 5px; + left: 9px; } + #header nav ul li.social a.icon-twitter:before { + font-size: 12px; + position: absolute; + top: 7px; + left: 6px; } + #header nav ul li.social a.icon-github:before { + position: absolute; + top: 0px; + left: 0px; + font-size: 25px; } #header .text { padding: 0 0 40px; } #header h1 { @@ -3124,6 +3180,81 @@ h5 { #footer footer small a { color: #6496b7; } +#page-faq #header { + height: auto; + position: static; + background-image: none; } +#page-faq .container { + top: auto; } + #page-faq .container article { + border-top: 1px solid #eee; + padding: 10px 0 15px; } + #page-faq .container h1 { + font-size: 36px; + font-weight: bold; + color: #0e1226; + margin-bottom: 10px; } + #page-faq .container #what { + border-top: 0; + padding: 0; } + #page-faq .container #what p { + font-size: 24px; + line-height: 32px; + margin-bottom: 20px; + margin-top: 0; } + #page-faq .container article:not(#what) p { + font-size: 18px; + line-height: 22px; } + #page-faq .container h2 { + font-size: 24px; + font-weight: bold; + color: #0e1226; + margin-bottom: 5px; } + #page-faq .container h2 + p { + margin-top: 0; } + #page-faq .container strong { + color: #0e1226; + opacity: .6; } + #page-faq .container .icon-mac, + #page-faq .container .icon-win { + position: relative; + padding-left: 50px; } + #page-faq .container .icon-mac:before, + #page-faq .container .icon-win:before { + position: absolute; + left: 18px; + top: 0; } + #page-faq .container .warning { + padding: 10px 10px 10px 50px; + border-radius: 2px; + position: relative; } + #page-faq .container .warning:before { + position: absolute; + top: 10px; + left: 18px; + font-family: 'popcorn'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + margin-right: 10px; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + content: "\e60d"; + font-size: 18px; + color: #858230; } + #page-faq .container .warning a { + color: #858230; + font-weight: bold; } + #page-faq .container .warning a:hover { + text-decoration: none; } + #page-faq .container .step-code li { + list-style: none; + padding: 5px 0 5px 10px; } + .beta #footer .download { display: none !important; } .beta #footer nav { diff --git a/css/style.scss b/css/style.scss index ef7fa5d..cb64773 100644 --- a/css/style.scss +++ b/css/style.scss @@ -10,5 +10,8 @@ @import "_getapp.scss"; @import "_browse.scss"; @import "_footer.scss"; + +@import "_faq.scss"; + @import "_beta.scss"; @import "_os.scss"; \ No newline at end of file diff --git a/faq.html b/faq.html new file mode 100644 index 0000000..ae0e85c --- /dev/null +++ b/faq.html @@ -0,0 +1,179 @@ + + + + + + + + + + + + + + + + + + + Popcorn Time + + + + + +
+
+

Always make sure you're running the latest Popcorn Time version.

+ +
+

Frequently Asked Questions

+

Popcorn Time! is the result of many developers and designers putting a bunch of APIs together to make the experience of watching torrent movies as simple as possible.

+

We are an open source project. We are from all over the world. We love our movies. And boy, do we love popcorn.

+
+ + + +
+

This works through torrents, fair enough. Am I seeding while watching a movie?

+

Indeed, you are. You're going to be uploading bits and bits of the movie for as long as you're watching it on Popcorn Time.

+
+ +
+

How come you've got the latest movies?

+

We track movies uploaded by YIFY. Better ask them how they are handling this!

+
+ +
+

Will you be adding movies in my language?

+

Chances are that most (if not all) of the movies available in Popcorn Time will be in English. However, languages for subtitles and the app itself are constantly being added by our lovely contributors.

+
+ +
+

Why can't I launch Popcorn Time?

+

Your system may prevent unsigned apps from being run
Go to System Preferences > Security > Allow Apps downloaded from > Anywhere and try to launch Popcorn Time! again.

+

You may have not have enough User Priviliges
+ Open a Terminal, and type: +

    +
  • $ chmod +x /Applications/Popcorn\ Time.app/Contents/MacOS/node-webkit
    • +
  • $ chmod +x /Applications/Popcorn\ Time.app/Contents/Frameworks/crash_inspector
    • +
  • $ chmod +x /Applications/Popcorn\ Time.app/Contents/Frameworks/node-webkit\ Helper.app/Contents/MacOS/node-webkit\ Helper
    • +
  • $ chmod +x /Applications/Popcorn\ Time.app/Contents/Frameworks/node-webkit\ Helper\ EH.app/Contents/MacOS/node-webkit\ Helper\ EH
    • +
  • $ chmod +x /Applications/Popcorn\ Time.app/Contents/Frameworks/node-webkit\ Helper\ NP.app/Contents/MacOS/node-webkit\ Helper\ NP
    • +

+
+ +
+

I can't get past the initial "Please wait..." screen :(

+

Chances are that you're from the UK. Nothing we can do about that right now, sorry. But setting up a proxy might do the trick.

+
+ +
+

Why can't I select subtitles?

+

You may have to wait until all of the movie data (cover, summary, length, etc...) is retrieved. Sometimes it may be something else! Who knows :P

+
+ +
+

Thinking about launching for Android/iOS/Chromecast/Smart TVs/Commodore 64?

+

Our efforts are towards making the best desktop app for watching torrent movies. So, no. Launching versions for other devices is not in our roadmap.

+
+
+ + +
+ + + + diff --git a/index.html b/index.html index 1039308..7ce7f92 100644 --- a/index.html +++ b/index.html @@ -81,6 +81,16 @@