fix css, uglifycss

8 years ago · 36c0b5bb44
7 changed files with 32 additions and 35 deletions
--- a/fabfile.py
+++ b/fabfile.py
@ -36,6 +36,7 @@ def copyFiles():
    local("cp ./{blog.ini,blog.service,requirements.txt} ./build/")
    local("cp ./src/*py ./build/")
    local("cp ./src/styles/*.css ./build/styles/")
+    local("uglifycss ./build/styles/*css > ./build/styles/primop.me.min.css")
    local("cp -r ./src/templates ./build/templates")

@task
--- a/src/scripts/app.tag
+++ b/src/scripts/app.tag
@ -1,11 +1,11 @@
 <app>
  <ul class="navigate tab tab-block">
-    <li class={"tab-item animated fadeIn " + (this.active.projects ? "active" : "")}>
-      <a onclick={to("projects")} href="#">Projects</a>
-    </li>
    <li class={"tab-item " + (this.active.posts ? "active" : "")}>
      <a onclick={to("posts")} href="#">Posts</a>
    </li>
+    <li class={"tab-item animated fadeIn " + (this.active.projects ? "active" : "")}>
+      <a onclick={to("projects")} href="#">Projects</a>
+    </li>
  </ul>
  <div class="content">
    <loading if={!this.state.loaded}></loading>
@ -46,19 +46,21 @@ this.active = {

 var self = this;

-this.route("posts",
-  function() {
+function projects() {
+  self.active.projects = true;
+  self.active.posts = false;
+  self.update();
+}
+
+function posts() {
  self.active.posts = true;
  self.active.projects = false;
  self.update();
-  });
+}

-this.route("projects",
-  function() {
-    self.active.projects = true;
-    self.active.posts = false;
-    self.update();
-  });
+this.route("posts", posts);
+this.route("/", posts);
+this.route("projects", projects);

 to(name) {
  return (function(e) {
@ -78,9 +80,6 @@ function loaduser() {
    .then(function(resp) {
      self.state.projects = Z.fromList(resp.data);
      self.state.loaded = true;
-      if (!self.active.posts) {
-        self.active.projects = true;
-      }
      self.update();
    });
 }
--- a/src/scripts/loading.tag
+++ b/src/scripts/loading.tag
@ -1,3 +1,3 @@
 <loading>
-  <div class="loading"></div>
+  <div class="loading animated fadeIn"></div>
 </loading>
--- a/src/scripts/postcontrols.tag
+++ b/src/scripts/postcontrols.tag
@ -1,5 +1,5 @@
 <postcontrols>
-    <div class="container">
+    <div class="controls container">
      <div class="columns">
        <div class="column col-6">
          <button class={"btn btn-lg nav-button float-right " + (this.opts.state.pid <= 1 ? "disabled" : " ") + this.opts.prevloading}
--- a/src/styles/font-awesome.min.css
+++ b/src/styles/font-awesome.min.css
--- a/src/styles/riotblog.scss
+++ b/src/styles/riotblog.scss
@ -2,16 +2,20 @@
  text-align: center;
 }

+.loading {
+}
+
 .navigate {
-  width: 70%;
-  margin: auto;
+  width: 20% !important;
+  margin-bottom: 25px !important;
+  margin: auto !important;
 }

 .content-box {
-  display: flex;                   /* defines flexbox */
-  flex-direction: column;          /* top to bottom */
-  justify-content: space-between;  /* first item at start, last at end */
-  position: relative;
+  display: flex !important;                   /* defines flexbox */
+  flex-direction: column !important;          /* top to bottom */
+  justify-content: space-between !important;  /* first item at start, last at end */
+  position: relative !important;
 }

 .projects-box {
--- a/src/templates/index.html
+++ b/src/templates/index.html
@ -1,10 +1,7 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <head>
-  <link rel="stylesheet" href="/styles/spectre.min.css">
-  <link rel="stylesheet" href="/styles/riotblog.min.css">
-  <link rel="stylesheet" href="/styles/projects.min.css">
-  <link rel="stylesheet" href="/styles/animate.min.css">
+  <link rel="stylesheet" href="/styles/primop.me.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <meta name="viewport" content="width=device-width, initial-scale=1">
 </head>
@ -18,6 +15,6 @@
    </footer>

  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
-  <script type="text/javascript" src="/blog/scripts/riotblog.min.js"></script>
+  <script type="text/javascript" src="/scripts/riotblog.min.js"></script>
  </body>
 </html>