Small HTML + style cleanup

petehamilton · Jun 25, 2012 · 41bef29 · 41bef29
1 parent c5182ff
commit 41bef29
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 21 deletions.
diff --git a/client/index.html b/client/index.html
@@ -106,7 +106,7 @@
               <div id="profile" class="mainmenu-content" data-bind="visible: profileVisible()">
                 <p class="menu-heading">Profile</p>
                 <div class="picture">
-                  <img src="" class="profile" alt="Avatar" data-bind="attr: { src: avatarURL }" />
+                  <img src="" class="avatar" alt="Avatar" data-bind="attr: { src: avatarURL }" />
                 </div>
                 <div class="stats">
                   <table>
@@ -236,7 +236,7 @@
                 </form>
                 <div class="search-result" data-bind="visible: searchUserRating() != 0">
                   <div class="picture">
-                    <img src="" class="profile" alt="Avatar" data-bind="attr: { src: searchAvatarURL }" />
+                    <img src="" class="avatar" alt="Avatar" data-bind="attr: { src: searchAvatarURL }" />
                   </div>
                   <div class="stats">
                     <table>
@@ -285,7 +285,7 @@
                     <tr>
                       <td># <span data-bind="text: place">N</span></td>
                       <td><span data-bind="text: username">USERNAME</span></td>
-                      <td><img src="" class="profile small" alt="Avatar" data-bind="attr: { src: avatarURL }" /></td>
+                      <td><img src="" class="avatar small" alt="Avatar" data-bind="attr: { src: avatarURL }" /></td>
                       <td><span data-bind="text: rating">RATING</span></td>
                       <td><span data-bind="text: ratingChange">RATING_CHANGE</span></td>
                     </tr>
@@ -362,9 +362,9 @@
                   </thead>
                   <tbody data-bind="foreach: connectedPlayers">
                     <tr>
-                      <td><img src="" class="profile small" alt="Avatar" data-bind="attr: { src: avatarURL }" /></td>
-                      <td><span class="label player small" data-bind="text: username"></span></td>
-                      <td><span class="label rating medium" data-bind="text: rating"></span></td>
+                      <td><img src="" class="avatar small" alt="Avatar" data-bind="attr: { src: avatarURL }" /></td>
+                      <td><span class="label player" data-bind="text: username"></span></td>
+                      <td><span class="label rating" data-bind="text: rating"></span></td>
                     </tr>
                   </tbody>
                 </table>

diff --git a/client/style.styl b/client/style.styl
@@ -1,5 +1,7 @@
-COLOR_TEXT_LIGHT = #a2b5c6
+COLOR_TEXT_HIGHLIGHT = #a2b5c6
+COLOR_TEXT_LIGHT = #bccddc
 COLOR_TEXT_GRAY = #68727b
+COLOR_MEDAL_BRONZE = #9D8A66
 
 linear-gradient()
   background: -moz-linear-gradient(arguments)
@@ -128,12 +130,12 @@ label
   margin-right: .8em
   padding-bottom: 2px
   font-size: 11px
-  color: COLOR_TEXT_LIGHT
+  color: COLOR_TEXT_HIGHLIGHT
   text-transform: uppercase
 
 .label
   margin-right: .8em
-  color: COLOR_TEXT_LIGHT
+  color: COLOR_TEXT_HIGHLIGHT
   text-transform: uppercase
   font-weight: normal
 
@@ -158,30 +160,26 @@ label
     .medal
       opacity: 1
     .title
-      color: #9D8A66
+      color: COLOR_MEDAL_BRONZE
     .description
-      color: COLOR_TEXT_LIGHT
+      color: COLOR_TEXT_HIGHLIGHT
 
 
 p.error
   color: #a20e0f
   font-weight: bold
 
-label.large
-  font-size: 14px
-  color: #fff
-
-img.profile
+img.avatar
   width: 140px
   height: 140px
   border: 1px solid #525e67
 
-img.profile.small
+img.avatar.small
   width: 32px
   height: 32px
 
 th
-  color: #bccddc
+  color: COLOR_TEXT_LIGHT
 
 input[type=submit]
 button
@@ -303,7 +301,7 @@ a.glow:focus
   margin-top: 15px
   margin-bottom: 40px
   font-size: 15px
-  color: #bccddc
+  color: COLOR_TEXT_LIGHT
   font-variant:small-caps
   position: relative
 
@@ -372,7 +370,7 @@ stats-inline-block()
       #navigation
         font-family:'HeydingsIconsRegular'
         display: inline-block
-        color: #bccddc
+        color: COLOR_TEXT_LIGHT
         font-size: 24px
         font-variant: normal
 
@@ -440,7 +438,7 @@ stats-inline-block()
         p
           font-size: 11px
           margin: .4em .1em
-          color: COLOR_TEXT_LIGHT
+          color: COLOR_TEXT_HIGHLIGHT
 
     .search-result
       padding:30px