Simplified badge colors

diff --git a/wcfsetup/install/files/acp/templates/cronjobLogList.tpl b/wcfsetup/install/files/acp/templates/cronjobLogList.tpl
index b3d98f7d76744225e0c750cf09e6a73934543cfc..aa4fc45d6410d7104d1ded989dd27eec8525e1cb 100644 (file)
--- a/wcfsetup/install/files/acp/templates/cronjobLogList.tpl
+++ b/wcfsetup/install/files/acp/templates/cronjobLogList.tpl
@@ -75,9 +75,9 @@
                                                        
                                                        <td class="columnText columnSuccess"><p>
                                                        {if $cronjobLog->success}
-                                                               <span class="badge badgeGreen">{lang}wcf.acp.cronjob.log.success{/lang}</span>
+                                                               <span class="badge green">{lang}wcf.acp.cronjob.log.success{/lang}</span>
                                                        {elseif $cronjobLog->error}     
-                                                               <a class="badge badgeRed jsTooltip jsCronjobError" title="{lang}wcf.acp.cronjob.log.error.showDetails{/lang}">{lang}wcf.acp.cronjob.log.error{/lang}</a>
+                                                               <a class="badge red jsTooltip jsCronjobError" title="{lang}wcf.acp.cronjob.log.error.showDetails{/lang}">{lang}wcf.acp.cronjob.log.error{/lang}</a>
                                                                <span style="display: none">{@$cronjobLog->error}</span>
                                                        {/if}
                                                        </p></td>

diff --git a/wcfsetup/install/files/acp/templates/updateServerList.tpl b/wcfsetup/install/files/acp/templates/updateServerList.tpl
index ef253f632ef9f732915ec32d4e80f9f96f28784c..ed0c9c08cd745e1c9d81defd3dcd1475694915f3 100644 (file)
--- a/wcfsetup/install/files/acp/templates/updateServerList.tpl
+++ b/wcfsetup/install/files/acp/templates/updateServerList.tpl
@@ -65,7 +65,7 @@
                                                        <td class="columnID"><p>{@$updateServer->packageUpdateServerID}</p></td>
                                                        <td class="columnText columnTitle"><p><a href="{link controller='UpdateServerEdit' id=$updateServer->packageUpdateServerID}{/link}" title="{lang}wcf.acp.updateServer.edit{/lang}">{$updateServer->serverURL}</a></p></td>
                                                        <td class="columnDigits"><p>{#$updateServer->packages}</p></td>
-                                                       <td class="columnStatus"><p class="badge{if $updateServer->status == 'online'} badgeGreen{else} badgeRed{/if}">{@$updateServer->status}</p></td>
+                                                       <td class="columnStatus"><p class="badge{if $updateServer->status == 'online'} green{else} red{/if}">{@$updateServer->status}</p></td>
                                                        <td class="columnText"><p title="{@$updateServer->errorMessage}">{@$updateServer->errorMessage|truncate:"30"}</p></td>
                                                        <td class="columnDate"><p>{if $updateServer->lastUpdateTime}{@$updateServer->lastUpdateTime|time}{/if}</p></td>
                                                

diff --git a/wcfsetup/install/files/style/global.less b/wcfsetup/install/files/style/global.less
index b458cee3db81de54e1f6b3950c9847ab69b5a7ac..7e2631947e0b61f5a12c9e813e0c16e151555c8c 100644 (file)
--- a/wcfsetup/install/files/style/global.less
+++ b/wcfsetup/install/files/style/global.less
@@ -213,123 +213,127 @@ body > iframe[src="about:blank"] {
        font-weight: normal !important;
        padding: 1px 8px 2px;
        position: relative;
-       text-shadow: none !important;
        white-space: nowrap;
        
+       .textShadow(@wcfColor);
+       
        /* colors */
        &.badgeUpdate {
                background-color: @wcfTabularBoxBackgroundColor;
                color: @wcfTabularBoxColor;
+               
+               .textShadow(@wcfTabularBoxBackgroundColor);
+       }
+       
+       &.badgeInverse {
+               background-color: @wcfTabularBoxColor;
+               color: @wcfTabularBoxBackgroundColor;
+               
+               .textShadow(@wcfTabularBoxColor);
        }
        
-       &.badgeGreen {
+       /* default label colors */
+       &.green {
                background-color: rgba(0, 153, 0, 1);
                color: rgba(238, 255, 238, 1);
+               
+               .textShadow(rgba(0, 153, 0, 1));
        }
        
-       &.badgeRed {
+       &.red {
                background-color: rgba(204, 0, 0, 1);
                color: rgba(255, 238, 238, 1);
+               
+               .textShadow(rgba(204, 0, 0, 1));
        }
        
-       &.badgeInverse {
-               background-color: @wcfTabularBoxColor;
-               color: @wcfTabularBoxBackgroundColor;
+       &.black {
+               background-color: #333;
+               color: #fff;
+               
+               .textShadow(#333);
        }
        
-       &.label {
-               font-size: 90%;
+       &.brown {
+               background-color: #c63;
                color: #fff;
-               /* TODO: use textShadow() */
-               text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
                
-               /* default label colors */
-               &.black {
-                       background-color: #333;
-               }
-               
-               &.brown {
-                       background-color: #c63;
-               }
-               
-               &.red {
-                       background-color: #c00;
-               }
-               
-               &.orange {
-                       background-color: #f90;
-               }
-               
-               &.yellow {
-                       background-color: #ff0;
-                       color: #333;
-                       /* TODO: use textShadow() */
-                       text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.4);
-               }
-               
-               &.green {
-                       background-color: #0c0;
-               }
+               .textShadow(#c63);
+       }
+       
+       &.orange {
+               background-color: #f90;
+               color: #fff;
                
-               &.blue {
-                       background-color: #09f;
-               }
+               .textShadow(#f90);
+       }
+       
+       &.yellow {
+               background-color: #ff0;
+               color: #333;
                
-               &.purple {
-                       background-color: #c0f;
-               }
+               .textShadow(#ff0);
+       }
+       
+       &.blue {
+               background-color: #09f;
+               color: #fff;
                
-               &.pink {
-                       background-color: #f0c;
-               }
+               .textShadow(#09f);
        }
        
-       /* hover */
+       &.purple {
+               background-color: #c0f;
+               color: #fff;
+               
+               .textShadow(#c0f);
+       }
        
+       &.pink {
+               background-color: #f0c;
+               color: #fff;
+               
+               .textShadow(#f0c);
+       }
 }
 
 a.badge:hover {
        color: @wcfContentBackgroundColor;
-       text-decoration: none;
-       
-       &.label {
-               text-decoration: none;
-               
-               &.black {
-                       background-color: #000;
-               }
-               
-               &.brown {
-                       background-color: #930;
-               }
-               
-               &.red {
-                       background-color: #900;
-               }
-               
-               &.orange {
-                       background-color: #f60;
-               }
-               
-               &.yellow {
-                       background-color: #cc0;
-               }
-               
-               &.green {
-                       background-color: #090;
-               }
-               
-               &.blue {
-                       background-color: #06c;
-               }
                
-               &.purple {
-                       background-color: #90c;
-               }
-               
-               &.pink {
-                       background-color: #c09;
-               }
+       &.black {
+               background-color: #000;
+       }
+       
+       &.brown {
+               background-color: #930;
+       }
+       
+       &.red {
+               background-color: #900;
+       }
+       
+       &.orange {
+               background-color: #f60;
+       }
+       
+       &.yellow {
+               background-color: #cc0;
+       }
+       
+       &.green {
+               background-color: #090;
+       }
+       
+       &.blue {
+               background-color: #06c;
+       }
+       
+       &.purple {
+               background-color: #90c;
+       }
+       
+       &.pink {
+               background-color: #c09;
        }
 }