Home Explore Help
Sign In
221V
/
Misago
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Tweaked forum footer

Rafał Pitoń 10 years ago
parent
9ddf16ce0a
commit
16518ef76c
4 changed files with 78 additions and 135 deletions
Unified View Show Diff Stats
  1. 32 75
      misago/emberapp/app/styles/misago/footer.less
  2. 10 11
      misago/emberapp/app/styles/misago/variables.less
  3. 12 17
      misago/emberapp/app/templates/components/forum-footer.hbs
  4. 24 32
      misago/templates/misago/footer.html

+ 32 - 75
misago/emberapp/app/styles/misago/footer.less
View File 

@@ -10,103 +10,60 @@
 
   color: @footer-color;
 
   color: @footer-color;
 
   text-align: center;
 
   text-align: center;
 
 
 
-  .footer-nav {
 
-    a, a:link, a:visited {
 
-      color: @footer-link-color;
 
-    }
 
-
 
-    a:hover, a:focus {
 
-      color: @footer-link-hover-color;
 
-    }
 
+  a, a:link, a:visited {
 
+    color: @footer-link-color;
 
+  }
 
 
 
-    a:active {
 
-      color: @footer-link-active-color;
 
-    }
 
+  a:hover, a:focus {
 
+    color: @footer-link-hover-color;
 
+  }
 
 
 
-    .site-footnote {
 
-      clear: none;
 
-    }
 
+  a:active {
 
+    color: @footer-link-active-color;
 
   }
 
   }
 
 
 
-  .noscript-message {
 
-    color: @footer-noscript-color;
 
+  .site-footnote {
 
+    .opacity(0.7);
 
+    font-size: @font-size-small;
 
   }
 
   }
 
 
 
   .misago-branding {
 
   .misago-branding {
 
-    a {
 
-      display: inline-block;
 
+    &:link, &:active, &:visited &:hover {
 
+      .opacity(0.8);
 
 
 
       color: @misago-branding-color;
 
       color: @misago-branding-color;
 
-      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 
       font-size: @misago-branding-size;
 
       font-size: @misago-branding-size;
 
-
 
-      .subscript {
 
-        display: inline-block;
 
-        position: relative;
 
-        bottom: (@misago-branding-size  - (@misago-branding-size * 0.75)) / 2 - 1px;
 
-
 
-        font-size: @misago-branding-size;
 
-      }
 
-
 
-      .brand-border {
 
-        background: @misago-branding-color;
 
-        border: none;
 
-        border-radius: @misago-branding-size * 0.15;
 
-        display: inline-block;
 
-        margin-right: @misago-branding-size * 0.1;
 
-        position: relative;
 
-        top: @misago-branding-size * 0.18;
 
-        overflow: hidden;
 
-        width: @misago-branding-size + 3px;
 
-        height: @misago-branding-size + 3px;
 
-
 
-        &>span {
 
-          display: inline-block;
 
-          position: absolute;
 
-          bottom: -20%;
 
-          right: -18%;
 
-          .rotate(-45deg);
 
-
 
-          color: @body-bg;
 
-          font-size: @misago-branding-size * 1.2;
 
-          font-weight: bold;
 
-        }
 
-      }
 
-
 
-      &, &:link, &:visited {
 
-        .opacity(0.6);
 
-      }
 
-
 
-      &:active, &:hover {
 
-        .opacity(1);
 
-
 
-        text-decoration: none;
 
-      }
 
+      font-weight: lighter;
 
+      text-decoration: none;
 
     }
 
     }
 
   }
 
   }
 
 
 
-  /* Small devices (tablets, 768px and up) */
 
+  /* Big devices (tablets, 768px and up) */
 
   @media (min-width: @screen-sm-min) {
 
   @media (min-width: @screen-sm-min) {
 
-    border-top: 1px solid @footer-hr-color;
 
     margin-top: @line-height-computed * 2;
 
     margin-top: @line-height-computed * 2;
 
     padding-top: @line-height-computed * 1.5;
 
     padding-top: @line-height-computed * 1.5;
 
+    overflow: auto;
 
 
 
     text-align: left;
 
     text-align: left;
 
 
 
-    .first-row {
 
-      overflow: auto;
 
+    .footer-content {
 
+      border-top: 1px solid @footer-border-color;
 
+      padding-top: @line-height-computed;
 
+    }
 
 
 
-      &>* {
 
-        float: left;
 
-      }
 
+    .footer-nav {
 
+      float: left;
 
+    }
 
 
 
-      .footer-nav {
 
-        margin-right: @line-height-computed;
 
+    .site-footnote {
 
+      .opacity(1);
 
+
 
+      font-size: @font-size-base;
 
+      font-weight: lighter;
 
+    }
 
 
 
-        .site-footnote {
 
-          clear: none;
 
-        }
 
-      }
 
+    .misago-branding {
 
+      float: right;
 
     }
 
     }
 
   }
 
   }
 
 }
 
 }

+ 10 - 11
misago/emberapp/app/styles/misago/variables.less
View File 

@@ -29,7 +29,7 @@
 
 //** Background color for `<body>`.
 
 //** Background color for `<body>`.
 
 @body-bg:               #fff;
 
 @body-bg:               #fff;
 
 //** Global text color on `<body>`.
 
 //** Global text color on `<body>`.
 
-@text-color:            #333;
 
+@text-color:            #111;
 
 
 
 //** Global textual link color.
 
 //** Global textual link color.
 
 @link-color:            #2196f3;
 
 @link-color:            #2196f3;
 
@@ -40,13 +40,13 @@
 
 
 
 //** Site link styles
 
 //** Site link styles
 
 @site-link-color:            @gray-light;
 
 @site-link-color:            @gray-light;
 
-@site-link-hover-color:      @gray-dark;
 
-@site-link-active-color:     @gray;
 
+@site-link-hover-color:      @text-color;
 
+@site-link-active-color:     @brand-info;
 
 
 
 //** In-site link state default
 
 //** In-site link state default
 
 @state-default:         #7f8c8d;
 
 @state-default:         #7f8c8d;
 
 @state-hover:           @text-color;
 
 @state-hover:           @text-color;
 
-@state-clicked:         @state-hover;
 
+@state-clicked:         @brand-primary;
 
 
 
 
 
 //== Typography
 
 //== Typography
 
@@ -90,19 +90,18 @@
 
 //
 
 //
 
 //##
 
 //##
 
 
 
-@footer-hr-color:                @gray-lighter;
 
+@footer-border-color:            @gray-lighter;
 
 
 
-@footer-color:                   lighten(@gray-light, 12%);
 
-@footer-noscript-color:          #d35400;
 
+@footer-color:                   @gray-darker;
 
 
 
 // Footer links
 
 // Footer links
 
-@footer-link-color:              @gray-light;
 
-@footer-link-hover-color:        @gray;
 
-@footer-link-active-color:       @gray;
 
+@footer-link-color:              @site-link-color;
 
+@footer-link-hover-color:        @site-link-hover-color;
 
+@footer-link-active-color:       @site-link-active-color;
 
 
 
 // Misago's branding
 
 // Misago's branding
 
 @misago-branding-color:          @gray-light;
 
 @misago-branding-color:          @gray-light;
 
-@misago-branding-size:           @font-size-base + 2px;
 
+@misago-branding-size:           @font-size-small;
 
 
 
 
 
 //== Loader
 
 //== Loader

+ 12 - 17
misago/emberapp/app/templates/components/forum-footer.hbs
View File 

@@ -2,9 +2,13 @@
 
   <div class="container">
 
   <div class="container">
 
     <div class="footer-content">
 
     <div class="footer-content">
 
 
 
-    {{#if hasContent}}
 
-      <div class="first-row">
 
-        <ul class="list-inline footer-nav">
 
+      {{#if hasContent}}
 
+      <ul class="list-inline footer-nav">
 
+        {{#if settings.forum_footnote}}
 
+          <li class="site-footnote">
 
+            {{settings.forum_footnote}}
 
+          </li>
 
+        {{/if}}
 
         {{#if showTermsLink}}
 
         {{#if showTermsLink}}
 
           <li>
 
           <li>
 
           {{#if settings.terms_of_service_link }}
 
           {{#if settings.terms_of_service_link }}
 
@@ -23,21 +27,12 @@
 
           {{/if}}
 
           {{/if}}
 
           </li>
 
           </li>
 
         {{/if}}
 
         {{/if}}
 
-        {{#if settings.forum_footnote}}
 
-          <li class="site-footnote">
 
-            {{settings.forum_footnote}}
 
-          </li>
 
-        {{/if}}
 
-        </ul>
 
-      </div>
 
-    {{/if}}
 
+      </ul>
 
+      {{/if}}
 
 
 
-      <div class="misago-branding">
 
-        <a href="http://misago-project.org">
 
-          <span class="subscript">powered by</span>
 
-          <span class="brand-border"><span>m</span></span><span class="subscript">isago</span>
 
-        </a>
 
-      </div>
 
+      <a href="http://misago-project.org" class="misago-branding">
 
+        powered by <strong>misago</strong>
 
+      </a>
 
 
 
     </div>
 
     </div>
 
   </div>
 
   </div>

+ 24 - 32
misago/templates/misago/footer.html
View File 

@@ -3,41 +3,33 @@
 
   <div class="container">
 
   <div class="container">
 
     <div class="footer-content">
 
     <div class="footer-content">
 
 
 
-      <div class="first-row">
 
+      <p class="site-noscript">
 
+        {% trans "For complete experience please enable JavaScript." %}
 
+      </p>
 
 
 
-        {% if misago_settings.terms_of_service or misago_settings.terms_of_service_link or misago_settings.privacy_policy or misago_settings.privacy_policy_link or misago_settings.forum_footnote %}
 
-          <ul class="list-inline footer-nav">
 
-          {% if misago_settings.terms_of_service or misago_settings.terms_of_service_link %}
 
-            <li>
 
-              <a href="{% url 'misago:terms_of_service' %}">{% trans "Terms of service" %}</a>
 
-            </li>
 
-          {% endif %}
 
-          {% if misago_settings.privacy_policy or misago_settings.privacy_policy_link %}
 
-            <li>
 
-              <a href="{% url 'misago:privacy_policy' %}">{% trans "Privacy policy" %}</a>
 
-            </li>
 
-          {% endif %}
 
-          {% if misago_settings.forum_footnote %}
 
-            <li class="site-footnote">
 
-              {{ misago_settings.forum_footnote }}
 
-            </li>
 
-          {% endif %}
 
-          </ul>
 
+      {% if misago_settings.terms_of_service or misago_settings.terms_of_service_link or misago_settings.privacy_policy or misago_settings.privacy_policy_link or misago_settings.forum_footnote %}
 
+        <ul class="list-inline footer-nav">
 
+        {% if misago_settings.forum_footnote %}
 
+          <li class="site-footnote">
 
+            {{ misago_settings.forum_footnote }}
 
+          </li>
 
         {% endif %}
 
         {% endif %}
 
+        {% if misago_settings.terms_of_service or misago_settings.terms_of_service_link %}
 
+          <li>
 
+            <a href="{% url 'misago:terms_of_service' %}">{% trans "Terms of service" %}</a>
 
+          </li>
 
+        {% endif %}
 
+        {% if misago_settings.privacy_policy or misago_settings.privacy_policy_link %}
 
+          <li>
 
+            <a href="{% url 'misago:privacy_policy' %}">{% trans "Privacy policy" %}</a>
 
+          </li>
 
+        {% endif %}
 
+        </ul>
 
+      {% endif %}
 
 
 
-        <p class="noscript-message text-warning">
 
-          <span class="fa fa-exclamation-triangle fa-lg"></span>
 
-          {% trans "For complete experience please enable JavaScript." %}
 
-        </p>
 
-
 
-      </div>
 
-
 
-      <div class="misago-branding">
 
-        <a href="http://misago-project.org">
 
-          <span class="subscript">powered by</span>
 
-          <span class="brand-border"><span>m</span></span><span class="subscript">isago</span>
 
-        </a>
 
-      </div>
 
+      <a href="http://misago-project.org" class="misago-branding">
 
+        powered by <strong>misago</strong>
 
+      </a>
 
 
 
     </div>
 
     </div>
 
   </div>
 
   </div>