Landing page for
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

173 lines
9.3 KiB

  2. <!--
  3. Hyperspace by HTML5 UP
  4. | @ajlkn
  5. Free for personal and commercial use under the CCA 3.0 license (
  6. -->
  7. <html>
  8. <head>
  9. <title>Welcome to Parley!</title>
  10. <meta charset="utf-8" />
  11. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
  12. <link rel="stylesheet" href="assets/css/main.css" />
  13. <noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
  14. </head>
  15. <body id='body'>
  16. <!-- Sidebar -->
  17. <section id="sidebar">
  18. <div class="inner">
  19. <nav>
  20. <ul>
  21. <li><a href="#intro">Welcome to Parley!</a></li>
  22. <li><a href="#one">Our services</a></li>
  23. <li><a href="#two">Other services</a></li>
  24. <li><a href="#three">Get in touch</a></li>
  25. </ul>
  26. </nav>
  27. </div>
  28. </section>
  29. <!-- Wrapper -->
  30. <div id="wrapper">
  31. <!-- Intro -->
  32. <section id="intro" class="wrapper style1 fullscreen fade-up">
  33. <div class="inner">
  34. <h1>Welcome to Parley!</h1>
  35. <h3>Free and privacy respecting services, open to all</h3>
  36. <p>Parley provides online services without gathering personal data. It is meant as a more humane and more ethical alternative to the tools often proposed by big data companies. Parley grew out of the Belgian Pirateparty ITSquad, but is meant to be politically neutral. At the moment none of the parley-tools require a login. All of the tools are <a href="" target="_blank">free software</a>.</p>
  37. <ul class="actions">
  38. <li><a href="#one" class="button scrolly">Services <span style="display: inline-block; transform: rotate(90deg); -webkit-transform: rotate(90deg);">></span></a></li>
  39. </ul>
  40. </div>
  41. </section>
  42. <!-- One -->
  43. <section id="one" class="wrapper style2 spotlights">
  44. <section>
  45. <a href="" target="_blank" class="image"><img src="images/pic-poll.png" alt="" data-position="top center" /></a>
  46. <div class="content">
  47. <div class="inner">
  48. <h2>Polls</h2>
  49. <p>Polls can be used to create simple polls. There are two types of polls availale, a datetime picker and a simple poll.</p>
  50. <ul class="actions">
  51. <li><a href="" target="_blank" class="button">Go to Poll ></a></li>
  52. </ul>
  53. </div>
  54. </div>
  55. </section>
  56. <section>
  57. <a href="" target="_blank" class="image"><img src="images/pic-share.png" alt="" data-position="25% 25%" /></a>
  58. <div class="content">
  59. <div class="inner">
  60. <h2>Share</h2>
  61. <p>Share can be used to share files. Simply drag and drop a file and choose how long the file should be available. The file will then be uploaded and you'll be given a link to the file that you can then freely share.</p>
  62. <ul class="actions">
  63. <li><a href="" target="_blank" class="button">Go to Share ></a></li>
  64. </ul>
  65. </div>
  66. </div>
  67. </section>
  68. <section>
  69. <a href="" target="_blank" class="image"><img src="images/pic-pad.png" alt="" data-position="25% 25%" /></a>
  70. <div class="content">
  71. <div class="inner">
  72. <h2>Pads</h2>
  73. <p>Pads are a simple word-processor and a good tool for online collaboration. Type the name of the pad you want, if a pad with this name doesn't exist yet a new one will be created, otherwise you go to the existing pad of that name.</p>
  74. <ul class="actions">
  75. <li><a href="" target="_blank" class="button">Go to Pad ></a></li>
  76. </ul>
  77. </div>
  78. </div>
  79. </section>
  80. <section>
  81. <a href="" target="_blank" class="image"><img src="images/pic-talk.png" alt="" data-position="25% 25%" /></a>
  82. <div class="content">
  83. <div class="inner">
  84. <h2>Talk</h2>
  85. <p>Talk is used for audio conferences and runs in the web browser. To connect you can give any username you wish. There are a fixed number of rooms where you can meet up with people and talk. If you want you can also connect using any mumble client using address: and port: 64738.</p>
  86. <ul class="actions">
  87. <li><a href="" target="_blank" class="button">Go to Talk ></a></li>
  88. </ul>
  89. </div>
  90. </div>
  91. </section>
  92. </section>
  93. <!-- Two -->
  94. <section id="two" class="wrapper style3 fade-up">
  95. <div class="inner">
  96. <h2>Other services</h2>
  97. <p>There are other tools freely available from other organisations who also oppose the big-data business model and use and promote free software. Naming them all would be impossible, but we'd like to give a short list of alternatives that may also be interesting.</p>
  98. <div class="features">
  99. <section>
  100. <span class="icon solid major fa-desktop"></span>
  101. <h3>Video Conference</h3>
  102. <h4>Jitsi</h4>
  103. <p><a href="" target="_blank"></a> is an online video and audio conference platform. You can easily create a room and invite people. There is the option to use video, audio, chat or share your screen or a window. For desktop and laptop you can do all this from the browser, for mobile you'll be redirected to the app store. is the server provided by the project and open to use. The French Pirate party has their own instance at <a href="" target="_blank"></a> and is also open to use.</p>
  104. </section>
  105. <section>
  106. <span class="icon solid major fa-users"></span>
  107. <h3>Social Networking</h3>
  108. <h4>PPBE Mastodon</h4>
  109. <p><a href="" target="_blank"></a> is a federated microblogging social network hosted by the Belgian PirateParty, but open to everyone who feels they share the pirate-values and ideas. Because of the nature of federation you are connected through this platform with thousands of other people who can be on their own separate platform with their own rules and values. This whole network is called the fediverse. If you don't know where to set up your account on the fediverse, or you don't know where to send people to, is as good a place as any to start.</p>
  110. </section>
  111. <section>
  112. <span class="icon solid major fa-search"></span>
  113. <h3>Internet Search</h3>
  114. <h4>Searx</h4>
  115. <p><a href="" target="_blank"></a> is a metasearch engine, aggregating the results of other search engines while not storing information about its users. When you enter a search query and press enter, it will send the query to several search-engines. It will however strip away as much personal data as possible without compromising results. You can see and change the search-enginges being used in the preferences.</p>
  116. </section>
  117. <section>
  118. </section>
  119. </div>
  120. </div>
  121. </section>
  122. <!-- Three -->
  123. <section id="three" class="wrapper style1 fade-up">
  124. <div class="inner">
  125. <h2>Get in touch</h2>
  126. <p>Feel free to get in touch to help us out, or because you see problems on the site or with our services, or maybe just to tell us how awesome you think this is! Any feedback, bug reports, and comments are not only welcome, but strongly encouraged ;)</p>
  127. <div class="style1">
  128. <section>
  129. <ul class="contact">
  130. <li>
  131. <h3>Contact</h3>
  132. <ul class="icons">
  133. <li><a href="" class="icon solid fa-envelope"><span class=""></span></a></li>
  134. </ul>
  135. </li>
  136. </ul>
  137. </section>
  138. </div>
  139. </div>
  140. </section>
  141. </div>
  142. <!-- Footer -->
  143. <footer id="footer" class="wrapper style1-alt">
  144. <div class="inner">
  145. <ul class="menu">
  146. <li><a rel="license" href="" target="_blank"><img alt="Creative Commons License" style="border-width:0" src="" /></a><br />This work is licensed under a <a rel="license" href="" target="_blank">Creative Commons Attribution 3.0 Unported License</a>.</li>
  147. <li>Design: <a href="" target="_blank">Hyperspace</a> on <a href="" target="_blank">HTML5 UP</a></li>
  148. <li><a href="" target="_blank">Source Code</a></li>
  149. </ul>
  150. </div>
  151. </footer>
  152. <!-- Scripts -->
  153. <script>document.getElementById('body').classList.add("is-preload");</script>
  154. <script src="assets/js/jquery.min.js"></script>
  155. <script src="assets/js/jquery.scrollex.min.js"></script>
  156. <script src="assets/js/jquery.scrolly.min.js"></script>
  157. <script src="assets/js/browser.min.js"></script>
  158. <script src="assets/js/breakpoints.min.js"></script>
  159. <script src="assets/js/util.js"></script>
  160. <script src="assets/js/main.js"></script>
  161. </body>
  162. </html>