index.html 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <title>Stackvee</title>
  8. <meta name="description" content="Source code generated using layoutit.com">
  9. <meta name="author" content="LayoutIt!">
  10. <link href="css/bootstrap.min.css" rel="stylesheet">
  11. <link href="css/style.css" rel="stylesheet">
  12. </head>
  13. <body>
  14. <div class="container-fluid">
  15. <div class="row top15">
  16. <div class="col-md-12">
  17. <nav class="main-navigation">
  18. <div class="navbar-header animated fadeInUp">
  19. <a class="navbar-brand" href="#">Stackvee</a>
  20. </div>
  21. <ul class="nav-list">
  22. <li class="nav-list-item">
  23. <a href="https://app.stackvee.com" class="nav-link">Users login</a>
  24. </li>
  25. </ul>
  26. </nav>
  27. </div>
  28. </div>
  29. <div class="row top30">
  30. <div class="col-md-12">
  31. <div class="jumbotron jumbotron-fluid">
  32. <div class="container">
  33. <h1 class="display-4">Stackvee, Smart your tech stack</h1>
  34. <div id="error-message"></div>
  35. <p class="lead">We are helping startups to choose and use the best technical stack for their needs.<br>
  36. Our team test in real life situations different technical stacks so we can recommend the best one for you<br>
  37. We belive in open source and use open source tools to give you the best experiance and to keep your private data private<br>
  38. When you choose commercial solutions that you cannot control your data is out there to scan, analyze, sell and use<br>
  39. We give you the stack, and the data is 100% yours. <br>
  40. We are fully GDPR compliance.<br>
  41. <b>For a limited time we give 30% lifetime discount</b><br>
  42. You can start as low as 50$ per month for a startup up to 15 employees<br>
  43. <b>With each plan you will get a consulting meeting to help you to choose the correct stack for you</b><br>
  44. And 72 hours response time, consulting by email without limitation
  45. </p>
  46. <!-- Load Stripe.js on your website. -->
  47. <!-- Create a button that your customers click to complete their purchase. Customize the styling to suit your branding. -->
  48. </div>
  49. </div>
  50. </div>
  51. </div>
  52. <div class="row top30">
  53. <div class="col-md-12">
  54. <!-- Acordion -->
  55. <!--Accordion wrapper-->
  56. <div class="accordion md-accordion accordion-1" id="accordionEx23" role="tablist">
  57. <div class="card">
  58. <div class="card-header blue lighten-3 z-depth-1" role="tab" id="heading96">
  59. <div class="row">
  60. <div class="col-md-8 col-sm-6 col-xs-6">
  61. <a class="white-text font-weight-bold white-text" data-toggle="collapse" href="#starter_pack" aria-expanded="true" aria-controls="starter_pack">
  62. <h5 class="text-uppercase">
  63. <i class="fas fa-chevron-circle-down"></i>
  64. Start
  65. </h5>
  66. </a>
  67. </div>
  68. <div class="col-md-2 col-sm-2 col-xs-2 price float-right">
  69. <h3 style="margin:5px auto;">$<span class="price">For only 50</span> <small> (domain included) you get:</small></h3>
  70. </div>
  71. <div class="col-md-2 col-sm-4 col-xs-4">
  72. <button
  73. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  74. id="checkout-button-plan_FMS67tF6XAgvwr"
  75. role="link"
  76. >
  77. Buy now
  78. </button>
  79. </div>
  80. </div>
  81. </div>
  82. <div id="starter_pack" class="collapse" role="tabpanel" aria-labelledby="heading96" data-parent="#accordionEx23">
  83. <div class="card-body">
  84. <div class="row my-4">
  85. <!-- starter_pack description - web server -->
  86. <div class="col-md-2 col-sm-6 col-xs-6 justify-content-center">
  87. <i class="fab fa-wordpress-simple fa-9x"></i>
  88. </div>
  89. <div class="col-md-4 col-sm-6 col-xs-6">
  90. <h4>Website, blog, and app server</h4>
  91. <h4 class="subheading">Your own private, fully managed servers</h4>
  92. <p class="text-muted"> This pack includes a wordpress blog, a website, and app server<br>
  93. which you can update whenever you wish - Just push the code to the site repository!<br>
  94. Add our Deploy pack to deploy your app with CI/CD.<br>
  95. </p>
  96. </div>
  97. <!-- # starter_pack description -->
  98. <!-- comparison table -->
  99. <div class="col-md-6 col-sm-12 col-xs-12">
  100. <div class="container mb-8 mt-2">
  101. <div class="pricing card-deck flex-column flex-md-row mb-6">
  102. <div class="card card-pricing text-center px-3 mb-5">
  103. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Stackvee - hosting service</span>
  104. <div class="bg-transparent card-header pt-4 border-0">
  105. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="50">$<span class="price">50</span><span class="h6 text-muted ml-2">/ starter pack</span></h1>
  106. </div>
  107. <div class="card-body pt-0">
  108. <ul class="list-unstyled mb-4">
  109. <li>Auto deploy from repo to Website</li>
  110. <li>1TB Bandwidth </li>
  111. <li>20GB Storage</li>
  112. <li><b>No ads</b></li>
  113. <li>Free cancelation</li>
  114. </ul>
  115. <button
  116. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  117. id="checkout-button-plan_FMS67tF6XAgvwr"
  118. role="link"
  119. >
  120. Buy now
  121. </button>
  122. </div>
  123. </div>
  124. <div class="card card-pricing popular shadow text-center px-3 mb-4">
  125. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Wix</span>
  126. <div class="bg-transparent card-header pt-4 border-0">
  127. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="30">€<span class="price">25</span><span class="h6 text-muted ml-2">/ per month</span></h1>
  128. </div>
  129. <div class="card-body pt-0">
  130. <ul class="list-unstyled mb-4">
  131. <li>35GB Storage</li>
  132. <li>Google Analytics</li>
  133. <li>Vendor lock</li>
  134. <li>yearly subscriptions, paid in full at the time of purchase</li>
  135. </ul>
  136. <a href="https://www.wix.com/upgrade/website" target="_blank" class="btn btn-outline-secondary mb-3">Go to Wix</a>
  137. </div>
  138. </div>
  139. <div class="card card-pricing text-center px-3 mb-4">
  140. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">WordPress.com</span>
  141. <div class="bg-transparent card-header pt-4 border-0">
  142. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="45">€<span class="price">25</span><span class="h6 text-muted ml-2">/ per month</span></h1>
  143. </div>
  144. <div class="card-body pt-0">
  145. <ul class="list-unstyled mb-4">
  146. <li>annual commitment - billed yearly</li>
  147. <li>WordPress.com Branding</li>
  148. <li>Google Analytics Integration</li>
  149. </ul>
  150. <a href="https://wordpress.com/pricing/" target="_blank" class="btn btn-outline-secondary mb-3">Go to Microsoft</a>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. <!-- # comparison table -->
  157. </div>
  158. <hr class="my-4">
  159. <div class="row my-4 top15">
  160. <!-- # web server -->
  161. <!-- starter_pack description - Git server-->
  162. <div class="col-md-2 col-sm-6 col-xs-6">
  163. <i class="fab fa-git-square fa-9x"></i>
  164. </div>
  165. <div class="col-md-4 col-sm-6 col-xs-6">
  166. <h4>Your repositories, Your code</h4>
  167. <h4 class="subheading">On your private fully managed servers</h4>
  168. <p class="text-muted">
  169. Git management server.<br>
  170. </p>
  171. </div>
  172. <!-- # starter_pack description -->
  173. <!-- comparison table -->
  174. <div class="col-md-6 col-sm-12 col-xs-12">
  175. <div class="container mb-8 mt-2">
  176. <div class="pricing card-deck flex-column flex-md-row mb-6">
  177. <div class="card card-pricing text-center px-3 mb-5">
  178. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Stackvee - git service</span>
  179. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="50">$<span class="price">50</span><span class="h6 text-muted ml-2">/ starter pack</span></h1>
  180. <div class="bg-transparent card-header pt-4 border-0">
  181. </div>
  182. <div class="card-body pt-0">
  183. <ul class="list-unstyled mb-4">
  184. <li>Unlimited public repositories</li>
  185. <li>Unlimited private repositories</li>
  186. <li>Team access controls</li>
  187. <li>Issues and bug tracking</li>
  188. <li>Free cancelation</li>
  189. </ul>
  190. <button
  191. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  192. id="checkout-button-plan_FMS67tF6XAgvwr"
  193. role="link"
  194. >
  195. Buy now
  196. </button>
  197. </div>
  198. </div>
  199. <div class="card card-pricing popular shadow text-center px-3 mb-4">
  200. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Github</span>
  201. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="30">$<span class="price">9</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  202. <div class="bg-transparent card-header pt-4 border-0">
  203. </div>
  204. <div class="card-body pt-0">
  205. <ul class="list-unstyled mb-4">
  206. <li>Minimum 5 users</li>
  207. <li>No webhooks</li>
  208. <li>Team access controls</li>
  209. <li>Issues and bug tracking</li>
  210. <li>Backed by Microsoft</li>
  211. </ul>
  212. <a href="https://github.com/pricing" target="_blank" class="btn btn-outline-secondary mb-3">Go to Github</a>
  213. </div>
  214. </div>
  215. <div class="card card-pricing text-center px-3 mb-4">
  216. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Bitbucket</span>
  217. <div class="bg-transparent card-header pt-4 border-0">
  218. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="45">$<span class="price">5</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  219. </div>
  220. <div class="card-body pt-0">
  221. <ul class="list-unstyled mb-4">
  222. <li>Minimum 5 users</li>
  223. <li>10GB Storage</li>
  224. <li>Team access controls</li>
  225. <li>Issues and bug tracking</li>
  226. </ul>
  227. <a href="https://products.office.com/en-us/business/small-business-solutions#office-ContentAreaHeadingTemplate-1cuvapm" target="_blank" class="btn btn-outline-secondary mb-3">Go to Microsoft</a>
  228. </div>
  229. </div>
  230. </div>
  231. </div>
  232. </div>
  233. <!-- # comparison table -->
  234. <!-- # Git server -->
  235. </div>
  236. <hr class="my-4">
  237. <div class="row my-4 top15">
  238. <!-- starter_pack description - email -->
  239. <div class="col-md-2 col-sm-6 col-xs-6">
  240. <i class="fas fa-mail-bulk fa-9x"></i>
  241. </div>
  242. <div class="col-md-4 col-sm-6 col-xs-6">
  243. <h4>Our self hosted email service</h4>
  244. <h4 class="subheading">On your private fully managed servers</h4>
  245. <p class="text-muted">Our server includes: spam filtering, greylisting, backups, and free TLS (SSL) certificates. <br>
  246. We implements modern mail protocols (SPF, DKIM, and DMARC) and the latest security best practices,<br>
  247. including opportunistic TLS, strong ciphers, and HSTS. <br>
  248. The highest level of protection against active attacks. <br>
  249. Exchange ActiveSync is also available for beta testers.</p>
  250. </div>
  251. <!-- # starter_pack description -->
  252. <!-- comparison table -->
  253. <div class="col-md-6 col-sm-12 col-xs-12">
  254. <div class="container mb-8 mt-2">
  255. <div class="pricing card-deck flex-column flex-md-row mb-6">
  256. <div class="card card-pricing text-center px-3 mb-5">
  257. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Stackvee - email service</span>
  258. <div class="bg-transparent card-header pt-4 border-0">
  259. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="50">$<span class="price">50</span><span class="h6 text-muted ml-2">/ starter pack</span></h1>
  260. </div>
  261. <div class="card-body pt-0">
  262. <ul class="list-unstyled mb-4">
  263. <li>up to 15 users</li>
  264. <li>Your data / Your servers</li>
  265. <li>Not extra cost</li>
  266. <li>Monthly updates</li>
  267. <li><b>No ad-tracking in you emails</b></li>
  268. <li>Free cancelation</li>
  269. </ul>
  270. <button
  271. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  272. id="checkout-button-plan_FMS67tF6XAgvwr"
  273. role="link"
  274. >
  275. Buy now
  276. </button>
  277. </div>
  278. </div>
  279. <div class="card card-pricing popular shadow text-center px-3 mb-4">
  280. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Gmail</span>
  281. <div class="bg-transparent card-header pt-4 border-0">
  282. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="30">$<span class="price">12</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  283. </div>
  284. <div class="card-body pt-0">
  285. <ul class="list-unstyled mb-4">
  286. <li>Minimum 5 users</li>
  287. <li>2-week free trial of G Suite</li>
  288. <li>Vendor lock</li>
  289. <li>Integrated ad-tracking</li>
  290. </ul>
  291. <a href="https://suitebriar.com/blog/gmail-for-business-pricing" target="_blank" class="btn btn-outline-secondary mb-3">Go to Gmail</a>
  292. </div>
  293. </div>
  294. <div class="card card-pricing text-center px-3 mb-4">
  295. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Microsoft</span>
  296. <div class="bg-transparent card-header pt-4 border-0">
  297. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="45">$<span class="price">12.50</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  298. </div>
  299. <div class="card-body pt-0">
  300. <ul class="list-unstyled mb-4">
  301. <li>annual commitment</li>
  302. <li>Free descktop Office apps</li>
  303. <li>Exchange Online Protection</li>
  304. <li>Backed by Microsoft</li>
  305. </ul>
  306. <a href="https://products.office.com/en-us/business/small-business-solutions#office-ContentAreaHeadingTemplate-1cuvapm" target="_blank" class="btn btn-outline-secondary mb-3">Go to Microsoft</a>
  307. </div>
  308. </div>
  309. </div>
  310. </div>
  311. </div>
  312. <!-- # comparison table -->
  313. </div>
  314. </div>
  315. </div>
  316. </div>
  317. <!-- ====================== communication pack -->
  318. <div class="card">
  319. <div class="card-header blue lighten-3 z-depth-1" role="tab" id="heading96">
  320. <div class="row">
  321. <div class="col-md-8 col-sm-6 col-xs-6">
  322. <a class="white-text font-weight-bold white-text" data-toggle="collapse" href="#communication_pack" aria-expanded="true" aria-controls="communication_pack">
  323. <h5 class="text-uppercase">
  324. <i class="fas fa-chevron-circle-down"></i>
  325. Communicate
  326. </h5>
  327. </a>
  328. </div>
  329. <div class="col-md-2 col-sm-2 col-xs-2 price float-right">
  330. <h3 style="margin:5px auto;">$<span class="price">25</span></h3>
  331. </div>
  332. <div class="col-md-2 col-sm-4 col-xs-4">
  333. <button
  334. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  335. id="checkout-button-plan_FMSHor9dcAkVDl"
  336. role="link"
  337. >
  338. Buy now
  339. </button>
  340. </div>
  341. </div>
  342. </div>
  343. <div id="communication_pack" class="collapse" role="tabpanel" aria-labelledby="heading96" data-parent="#accordionEx23">
  344. <div class="card-body">
  345. <div class="row my-4">
  346. <!-- communication_pack description - web server -->
  347. <div class="col-md-2 col-sm-6 col-xs-6 justify-content-center">
  348. <i class="far fa-comments fa-9x"></i>
  349. </div>
  350. <div class="col-md-4 col-sm-6 col-xs-6">
  351. <h4>Communicate efficently with your team</h4>
  352. <h4 class="subheading">On your private fully managed servers</h4>
  353. <p class="text-muted">Your wordpress blog, web site, and app server<br>
  354. Update the website buy just pushing the code to the site repository<br>
  355. Deploy your app with CI/CD (Require deploy server pack).<br>
  356. </p>
  357. </div>
  358. <!-- # communication_pack description -->
  359. <!-- comparison table -->
  360. <div class="col-md-6 col-sm-12 col-xs-12">
  361. <div class="container mb-8 mt-2">
  362. <div class="pricing card-deck flex-column flex-md-row mb-6">
  363. <div class="card card-pricing text-center px-3 mb-5">
  364. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Stackvee - Communication service</span>
  365. <div class="bg-transparent card-header pt-4 border-0">
  366. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="50">$<span class="price">25</span><span class="h6 text-muted ml-2">/ starter pack</span></h1>
  367. </div>
  368. <div class="card-body pt-0">
  369. <ul class="list-unstyled mb-4">
  370. <li>Organized conversations in teams and channels</li>
  371. <li>Fully searchable message history</li>
  372. <li>1-on-1 and group messaging</li>
  373. <li>Voice, video, and screen sharing</li>
  374. <li>File, image, and link sharing</li>
  375. <li>Emoji and rich Markdown formatting</li>
  376. <li>Multi-language support </li></li>
  377. <li>Custom desktop, email, and mobile notifications</li>
  378. <li>Keyword mention alerts</li>
  379. <li>Free cancelation</li>
  380. </ul>
  381. <button
  382. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  383. id="checkout-button-plan_FMSHor9dcAkVDl"
  384. role="link"
  385. >
  386. Buy now
  387. </button>
  388. </div>
  389. </div>
  390. <div class="card card-pricing popular shadow text-center px-3 mb-4">
  391. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Slack</span>
  392. <div class="bg-transparent card-header pt-4 border-0">
  393. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="30">€<span class="price">11.75</span><span class="h6 text-muted ml-2">/ per month</span></h1>
  394. </div>
  395. <div class="card-body pt-0">
  396. <ul class="list-unstyled mb-4">
  397. <li>annual commitment - billed yearly</li>
  398. <li>Vendor lock</li>
  399. <li>Unlimited workspaces</li>
  400. </ul>
  401. <a href="https://zvwxrp.slack.com/plans" target="_blank" class="btn btn-outline-secondary mb-3">Go to Slack</a>
  402. </div>
  403. </div>
  404. <div class="card card-pricing text-center px-3 mb-4">
  405. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Teams</span>
  406. <div class="bg-transparent card-header pt-4 border-0">
  407. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="45">$<span class="price">12.50</span><span class="h6 text-muted ml-2">/ per month</span></h1>
  408. </div>
  409. <div class="card-body pt-0">
  410. <ul class="list-unstyled mb-4">
  411. <li>annual commitment - billed yearly</li>
  412. <li>Integrate with Microsoft products</li>
  413. <li>Backed by Microsoft</li>
  414. </ul>
  415. <a href="https://wordpress.com/pricing/" target="_blank" class="btn btn-outline-secondary mb-3">Go to Microsoft</a>
  416. </div>
  417. </div>
  418. </div>
  419. </div>
  420. </div>
  421. <!-- # comparison table -->
  422. </div>
  423. </div>
  424. </div>
  425. </div>
  426. <!-- ====================== Agile pack -->
  427. <div class="card">
  428. <div class="card-header blue lighten-3 z-depth-1" role="tab" id="heading96">
  429. <div class="row">
  430. <div class="col-md-8 col-sm-6 col-xs-6">
  431. <a class="white-text font-weight-bold white-text" data-toggle="collapse" href="#agile_pack" aria-expanded="true" aria-controls="agile_pack">
  432. <h5 class="text-uppercase">
  433. <i class="fas fa-chevron-circle-down"></i>
  434. Agile
  435. </h5>
  436. </a>
  437. </div>
  438. <div class="col-md-2 col-sm-2 col-xs-2 price float-right">
  439. <h3 style="margin:5px auto;">$<span class="price">25</span></h3>
  440. </div>
  441. <div class="col-md-2 col-sm-4 col-xs-4">
  442. <button
  443. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  444. id="checkout-button-plan_FMSJLpSKdaIrlJ"
  445. role="link"
  446. >
  447. Buy Now
  448. </button>
  449. </div>
  450. </div>
  451. </div>
  452. <div id="agile_pack" class="collapse" role="tabpanel" aria-labelledby="heading96" data-parent="#accordionEx23">
  453. <div class="card-body">
  454. <div class="row my-4">
  455. <!-- agile_pack description - web server -->
  456. <div class="col-md-2 col-sm-6 col-xs-6 justify-content-center">
  457. <i class="fas fa-chalkboard-teacher fa-9x"></i>
  458. </div>
  459. <div class="col-md-4 col-sm-6 col-xs-6">
  460. <h4>Manage your projects smartly</h4>
  461. <h4 class="subheading">On your private fully managed servers</h4>
  462. <p class="text-muted">flexible project management application.<br>
  463. That can fit in to any company and projects
  464. </p>
  465. </div>
  466. <!-- # agile_pack description -->
  467. <!-- comparison table -->
  468. <div class="col-md-6 col-sm-12 col-xs-12">
  469. <div class="container mb-8 mt-2">
  470. <div class="pricing card-deck flex-column flex-md-row mb-6">
  471. <div class="card card-pricing text-center px-3 mb-5">
  472. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Stackvee - agile service</span>
  473. <div class="bg-transparent card-header pt-4 border-0">
  474. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="50">$<span class="price">25</span><span class="h6 text-muted ml-2">/ starter pack</span></h1>
  475. </div>
  476. <div class="card-body pt-0">
  477. <ul class="list-unstyled mb-4">
  478. <li>Kanban and Scrum boards</li>
  479. <li>Multiple projects support</li>
  480. <li>Flexible role based access control</li>
  481. <li>Flexible issue tracking system</li>
  482. <li>Gantt chart and calendar</li>
  483. <li>News, documents & files management</li>
  484. <li>Feeds & email notifications</li>
  485. <li>Per project wiki</li>
  486. <li>Per project forums</li>
  487. <li>Time tracking</li>
  488. <li>SCM integration (SVN, CVS, Git, Mercurial and Bazaar)</li>
  489. <li>Issue creation via email</li>
  490. <li>Free cancelation</li>
  491. </ul>
  492. <button
  493. style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
  494. id="checkout-button-plan_FMSJLpSKdaIrlJ"
  495. role="link"
  496. >
  497. Buy Now
  498. </button>
  499. </div>
  500. </div>
  501. <div class="card card-pricing popular shadow text-center px-3 mb-4">
  502. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Jira</span>
  503. <div class="bg-transparent card-header pt-4 border-0">
  504. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="30">$<span class="price">7</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  505. </div>
  506. <div class="card-body pt-0">
  507. <ul class="list-unstyled mb-4">
  508. <li>First 10 users for 10$</li>
  509. <li>7 days free trial</li>
  510. <li>Kanban and Scrum boards</li>
  511. </ul>
  512. <a href="https://www.atlassian.com/software/jira/pricing#pricing-calculator" target="_blank" class="btn btn-outline-secondary mb-3">Go to Jira</a>
  513. </div>
  514. </div>
  515. <div class="card card-pricing text-center px-3 mb-4">
  516. <span class="h6 w-60 mx-auto px-4 py-1 rounded-bottom bg-primary text-white shadow-sm">Trello</span>
  517. <div class="bg-transparent card-header pt-4 border-0">
  518. <h1 class="h1 font-weight-normal text-primary text-center mb-0" data-pricing-value="45">$<span class="price">9.99</span><span class="h6 text-muted ml-2">/ per user</span></h1>
  519. </div>
  520. <div class="card-body pt-0">
  521. <ul class="list-unstyled mb-4">
  522. <li>annual commitment - billed yearly</li>
  523. <li>Kanban and Scrum boards</li>
  524. <li>No git integration</li>
  525. </ul>
  526. <a href="https://trello.com/en/pricing" target="_blank" class="btn btn-outline-secondary mb-3">Go to Trello</a>
  527. </div>
  528. </div>
  529. </div>
  530. </div>
  531. </div>
  532. <!-- # comparison table -->
  533. </div>
  534. </div>
  535. </div>
  536. </div>
  537. <!-- CARD template >
  538. <div class="card">
  539. <div class="card-header blue lighten-3 z-depth-1" role="tab" id="heading97">
  540. <h5 class="text-uppercase mb-0 py-1">
  541. <a class="collapsed font-weight-bold white-text" data-toggle="collapse" href="#collapse97"
  542. aria-expanded="false" aria-controls="collapse97">
  543. I am the second title of accordion
  544. </a>
  545. </h5>
  546. </div>
  547. <div id="collapse97" class="collapse" role="tabpanel" aria-labelledby="heading97"
  548. data-parent="#accordionEx23">
  549. <div class="card-body">
  550. <div class="row my-4">
  551. <div class="col-md-8">
  552. <h2 class="font-weight-bold mb-3 black-text">Hi! I am the second one.</h2>
  553. <p class="">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
  554. incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  555. ullamco laboris</p>
  556. <p class="mb-0">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
  557. fugiat nulla pariatur.</p>
  558. </div>
  559. <div class="col-md-4 mt-3 pt-2">
  560. <div class="view z-depth-1">
  561. <img src="https://mdbootstrap.com/img/Photos/Others/nature.jpeg" alt="" class="img-fluid">
  562. </div>
  563. </div>
  564. </div>
  565. </div>
  566. </div>
  567. </div>
  568. -->
  569. </div>
  570. <!--Accordion wrapper-->
  571. </div>
  572. </div>
  573. </div>
  574. <script src="js/jquery.min.js"></script>
  575. <script src="js/bootstrap.min.js"></script>
  576. <script src="js/scripts.js"></script>
  577. <script src="https://kit.fontawesome.com/25ece1fdd4.js"></script>
  578. <script src="https://js.stripe.com/v3"></script>
  579. <script>
  580. var stripe = Stripe('pk_live_L9wdYA9uQpAuu3pnEVeX84b5');
  581. var checkoutButton = document.getElementById('checkout-button-plan_FMSJLpSKdaIrlJ');
  582. checkoutButton.addEventListener('click', function () {
  583. // When the customer clicks on the button, redirect
  584. // them to Checkout.
  585. stripe.redirectToCheckout({
  586. items: [{plan: 'plan_FMSJLpSKdaIrlJ', quantity: 1}],
  587. // Do not rely on the redirect to the successUrl for fulfilling
  588. // purchases, customers may not always reach the success_url after
  589. // a successful payment.
  590. // Instead use one of the strategies described in
  591. // https://stripe.com/docs/payments/checkout/fulfillment
  592. successUrl: 'https://stackvee.com/success',
  593. cancelUrl: 'https://stackvee.com/canceled',
  594. })
  595. .then(function (result) {
  596. if (result.error) {
  597. // If `redirectToCheckout` fails due to a browser or network
  598. // error, display the localized error message to your customer.
  599. var displayError = document.getElementById('error-message');
  600. displayError.textContent = result.error.message;
  601. }
  602. });
  603. });
  604. </script>
  605. </body>
  606. </html>