Преглед на файлове

Merge branch 'master' into develop

Beautus преди 6 години
родител
ревизия
8289ff7c70

BIN
docs/assets/badge_get-it-on-en-us.png


BIN
docs/assets/favicon-16x16.png


BIN
docs/assets/favicon-32x32.png


BIN
docs/assets/google-play-badge.png


BIN
docs/assets/home-screen.png


BIN
docs/assets/ic_launcher-web.png


BIN
docs/assets/slim-logo.jpg


BIN
docs/favicon.ico


+ 47 - 56
docs/index.html

@@ -1,68 +1,59 @@
 <!DOCTYPE html>
+<!--suppress HtmlFormInputWithoutLabel, HtmlUnknownTag -->
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8"/>
-    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-    <meta content="ie=edge" http-equiv="X-UA-Compatible"/>
-    <link href="./main.css" rel="stylesheet">
-    <title>Slim Launcher - Fewer distraction, more life</title>
+  <meta charset="UTF-8"/>
+  <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
+  <meta content="ie=edge" http-equiv="X-UA-Compatible"/>
+  <link href="https://fonts.googleapis.com/css?family=Ubuntu&display=swap" rel="stylesheet">
+  <link href="./main.css" rel="stylesheet">
+  <link rel="icon" type="image/png" href="./assets/favicon-32x32.png" sizes="32x32"/>
+  <link rel="icon" type="image/png" href="./assets/favicon-16x16.png" sizes="16x16"/>
+  <title>Slim</title>
 </head>
 
 <body>
-<header>
-    <h1>Slim Launcher</h1>
-    <h3>v2.3</h3>
+<header class="site-header">
+  <a href="/slim-launcher/">
+    <img src="./assets/slim-logo.jpg" class="site-header__logo" alt="Slim logo">
+  </a>
+  <h2 class="site-header__title">Slim Launcher</h2>
+  <nav class="header-nav">
+    <input type="checkbox" class="nav-trigger" name="nav-trigger" id="nav-trigger"/>
+    <label for="nav-trigger">
+      <div class="menu-icon">
+        <span class="menu-icon__elem"></span>
+        <span class="menu-icon__elem"></span>
+        <span class="menu-icon__elem"></span>
+      </div>
+    </label>
+    <div class="trigger">
+      <a href="https://github.com/sduduzog/slim-launcher" class="header-nav__elem">Github Repo</a>
+    </div>
+  </nav>
 </header>
-<main>
-    <article>
-        <h2>Frequently Asked Questions (FAQs)</h2>
-        <ol>
-            <li><h3>Where is the app drawer?</h3></li>
-            <span>There is no app drawer! You don't need an app drawer when all the apps you need fit in one screen.</span>
-            <li><h3>Why can't I access all the other apps on my phone?</h3></li>
-            <span>Clearly you didn't understand the whole idea of this app.
-                The whole point of this app is to stop you from doing exactly that. Google 'minimalism'</span>
-            <li><h3>How do I get to my other apps?</h3></li>
-            <span>Well simple! Swipe up from your home screen &gt; Go to Options &gt; Tap Customise apps. have fun!</span>
-            <li><h3>You should add a google search bar and a way to access all the other apps.</h3></li>
-            <span>First of all this is not a question! Secondly, I do appreciate the feedback but
-                let it not be against the reason why the app exists in the first place</span>
-            <li><h3>Why can't I set a wallpaper?</h3></li>
-            <span>Well why do you want a wallpaper? You want to look at your phone? for how long? for what? For who?
-            Read a book instead.</span>
-            <li><h3>Hey, your app sucks!</h3></li>
-            <span>Where's yours that doesn't suck?!?</span>
-            <li><h3>Is it possible to change the apps on the home screen?</h3></li>
-            <span>Yes, you can. If you have the latest version installed, you'll find that adding, renaming
-            and exchanging apps has been made easier.</span>
-            <li><h3>WHAT ABOUT OTHER APPS?</h3></li>
-            <span><i>Where's Thanos when you need him the most?...</i> Did you even read the description of the app?</span>
-            <li><h3>Does it support other languages?</h3></li>
-            <span>No, unfortunately. I would love for the app to be accessible no matter the language.
-                But the app is free, I can't afford to pay for translation services as of yet. If you know
-            a language that you would like this app to support and you are fluent in it, please shoot me an email and we'll make magic happen</span>
-            <li><h3>I have a youtube channel, can I review your app for a small fee? I have many subscribers and
-            my videos have millions of views</h3></li>
-            <span>Like I said! I'm broke</span>
-            <li><h3>Is the app free forever?</h3></li>
-            <span>Yes. I made the app because I needed it myself. Then I decided to share it with the world.
-                I see no reason why I should make other people pay for it.
-                Fun fact! I actually made this because I didn't want to pay for something I can create myself</span>
-            <li><h3>How do I support the project</h3></li>
-            <span>You can become a tester. Shoot me an email if you need more info regarding this.
-                This way, you can give feedback that will shape the direction of the app and make a better experience for everyone.
-            You can contribute on the project on GitHub.
-                The most of the work has been put in to make the code more modular and readable
-                so that it's easy for other people to add in their input as PRs. You can also
-                <a href="https://buymeacoff.ee/sduduzog">buy me a coffee</a>.
-                I will probably buy a big mac with the cash or go watch a movie to reward myself.
-                I will however spend it on the project if stated otherwise. I wouldn't be able to live with myself if I don't</span>
-            <li><h3>Why does this website look like crap?</h3></li>
-            <span>I hit a designers block.</span>
-        </ol>
-    </article>
+<main role="main">
+  <section role="banner" class="banner">
+    <div class="wrapper">
+      <h1>A minimalist launcher that only allows you to use fewer apps on your phone</h1>
+      <img src="./assets/home-screen.png" class="screenshot" alt="Home screen screenshot">
+      <a href="https://play.google.com/store/apps/details?id=com.sduduzog.slimlauncher">
+        <img class="badge g-play"
+             src="./assets/google-play-badge.png"
+             alt="Google Play badge">
+      </a>
+      <a href="https://f-droid.org/en/packages/com.sduduzog.slimlauncher">
+        <img class="badge f-droid"
+             src="./assets/badge_get-it-on-en-us.png"
+             alt="F-droid badge">
+      </a>
+    </div>
+  </section>
 </main>
+<footer>
+  <p>Made with ❤ by <a href="https://sduduzog.github.io">Sdu</a></p>
+</footer>
 </body>
 
 </html>

+ 245 - 6
docs/main.css

@@ -1,16 +1,255 @@
-*{
+:root{
+  --max-width: 1280px;
+}
+* {
   box-sizing: border-box;
 }
-body{
+
+body {
   margin: 0;
-  font-family: monospace;
+  font-family: 'Ubuntu', sans-serif;
 }
 
-header{
-  padding: 20px;
+.site-header{
+  display: flex;
+  padding: 5px 50px;
+  margin: 30px auto;
+  max-width: var(--max-width);
+}
+
+.site-header__title{
+  margin: 0;
+  padding: 10px;
+}
+
+.site-header__logo{
+  height: 50px;
+  width: 50px;
+  display: block;
+  flex-shrink: 0;
+}
+.header-nav{
+  flex-grow: 1;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.nav-trigger{
+  display: none;
+}
+
+.menu-icon{
+  display: none;
+}
+
+.header-nav__elem{
+  color: #000000;
+  display: inline-block;
+  margin: 15px;
+  text-transform: capitalize;
+  cursor: pointer;
+  text-decoration: none;
+}
+
+.header-nav__elem:hover{
+  text-decoration: underline;
+}
+main {
+  margin: auto;
+}
+
+main section > * {
+  max-width: var(--max-width);
 }
 
-main{
+.wrapper {
+  padding: 80px 100px;
   margin: auto;
+}
+
+.banner .wrapper {
+  display: grid;
+  gap: 20px;
+  grid-template-columns: 1fr 1fr 300px;
+  grid-template-rows: max-content;
+}
+
+.banner h1 {
+  grid-column: 1 / 3;
+  margin: 100px 0 0;
+  font-weight: lighter;
+  font-size: xx-large;
+  text-align: center;
+  padding: 20px;
+}
+
+.banner img {
+  width: 100%;
+  height: auto;
+  display: block;
+}
+
+.banner .screenshot {
+  box-shadow: 0 12px 30px 8px #363636;
+  grid-column: 3 / 4;
+  grid-row: 1 / 3;
+}
+
+.banner .badge {
   padding: 20px;
+  max-width: 260px;
+  margin: 20px auto auto;
+}
+
+.banner .g-play {
+  margin-left: auto;
+  margin-right: 0;
+}
+
+.banner .f-droid {
+  margin-left: 0;
+}
+
+footer{
+  text-align: center;
+}
+
+@media screen and (max-width: 768px) {
+  .banner .wrapper {
+    grid-template-columns: 1fr 250px;
+  }
+
+  .banner h1 {
+    margin: 0;
+    grid-column: 1 /2;
+  }
+
+  .banner a {
+    grid-column: 1 / 3;
+    grid-row: 2 /3;
+  }
+
+  .banner .screenshot {
+    grid-column: 2 / 3;
+    grid-row: 1 / 4;
+  }
+
+  .banner a:nth-child(3), .banner a:nth-child(4){
+    grid-column: 1 / 2;
+  }
+
+  .banner a:nth-child(4){
+    grid-row: 3 / 4;
+  }
+
+  .banner .g-play, .banner .f-droid {
+    margin: 0 auto;
+    padding: 0;
+    width: 180px;
+  }
+}
+
+@media screen and (max-width: 450px) {
+
+  .site-header{
+    padding: 5px;
+    margin: 0;
+  }
+
+  label[for=nav-trigger]{
+    display: block;
+    width: 40px;
+    margin: 5px;
+    height: 38px;
+    z-index: 2;
+    cursor: pointer;
+  }
+
+  .header-nav{
+    position: absolute;
+    /*border: 1px solid black;*/
+    border-radius: 5px;
+    box-shadow: 0 0 5px 1px #cccccc;
+    background-color: white;
+  }
+
+  .header-nav{
+    position: absolute;
+    right: 5px;
+    display: flex;
+    flex-wrap: wrap;
+    max-width: 130px;
+  }
+
+  .menu-icon{
+    right: 0;
+    display: block;
+  }
+
+  .menu-icon__elem{
+    display: block;
+    height: 3px;
+    width: 20px;
+    border-radius: 4px;
+    margin: 7px 10px;
+    background-color: black;
+  }
+  input ~ .trigger{
+    display: none;
+  }
+
+  input:checked ~ .trigger{
+    display: block;
+    flex-basis: 100%;
+    padding: 5px;
+  }
+
+  .header-nav__elem{
+    text-align: right;
+    margin: 0;
+    padding: 10px 5px;
+    display: block;
+  }
+  .wrapper {
+    padding: 0;
+  }
+
+  .banner .wrapper {
+    grid-template-columns: 1fr;
+    padding: 20px;
+    gap: 0;
+  }
+
+  .banner h1 {
+    text-align: center;
+    grid-column: 1 / 2;
+    grid-row: 2 / 3;
+    font-size: x-large;
+  }
+
+  .banner .screenshot {
+    width: 230px;
+    margin: auto;
+    display: block;
+    grid-column: 1 / 2;
+  }
+
+  .banner .screenshot {
+    margin: 50px auto;
+    grid-row: 1 / 2;
+  }
+
+  .banner a:nth-child(3){
+    grid-row: 3 / 4;
+  }
+
+  .banner a:nth-child(4){
+    grid-row: 4 / 5;
+  }
+}
+
+@media screen and (max-width: 375px) {
+  .banner h1 {
+    font-size: larger;
+  }
 }