Battlelog Custom CSS – ändra färg på avatarer
Jag har hela tiden tyckt att det är fel färg på kanten på avatarer på Battlelog. I Steam är det grön = in-game och blå = online, men på Battlelog är det tvärtom.
Därför har jag skrivit lite CSS-kod som ändrar så att grön = in-game och blå = online. Den fungerar åtminstone i Firefox och Chrome, men jag ska försöka testa i Safari och Opera också så fort jag hinner.
OBS! Det är bara på ens egen dator som färgerna ändras! Andra spelare kommer alltså inte se någon skillnad.
CSS-kod:
/* ---------------------------------------------------------------- */
/* Battlelog Custom CSS v1.2 by Simon Alling */
/* http://www.sweclockers.com/forum/123-battlefield/1102105-batt... */
/* ---------------------------------------------------------------- */
/* ---------------------------------------------------------------- */
/* Server Browser Filter Preview Height Fix */
/* ---------------------------------------------------------------- */
/* Prevents the Filter settings from jumping up and down when the */
/* user alters the settings, particularly when (un)checking maps. */
html#base-bf3-html body#base-bf3-body #serverguide-filtertoggle {
height: 32px;
overflow-y: scroll !important;
position: relative;
}
html#base-bf3-html body#base-bf3-body #serverguide-filters-container::after {
background: linear-gradient(to top, rgba(231,231,231,0) 0%,rgba(231,231,231,1) 100%);
content: '';
height: 8px;
position: absolute;
top: 1px;
width: 972px;
}
html#base-bf3-html body#base-bf3-body #serverguide-filters-container::before {
background: linear-gradient(to bottom, rgba(231,231,231,0) 0%,rgba(231,231,231,1) 100%);
content: '';
height: 8px;
position: absolute;
top: 50px;
width: 972px;
}
#serverguide-filtertoggle .serverguide-filterlist-generic {
margin-bottom: 12px !important;
}
/* ---------------------------------------------------------------- */
/* Supersize avatar (profile page) */
/* ---------------------------------------------------------------- */
/* Online */
html#base-bf3-html body#base-bf3-body .base-avatar-size-supersize2 .base-avatar-status-overlay.base-avatar-status-overlay-online {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 0 transparent !important;
}
/* Playing */
html#base-bf3-html body#base-bf3-body .base-avatar-size-supersize2 .base-avatar-status-overlay.base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -320px 0 transparent !important;
}
/* ---------------------------------------------------------------- */
/* Large avatar (stats page) */
/* ---------------------------------------------------------------- */
/* Online */
html#base-bf3-html body#base-bf3-body .base-avatar-size-large .base-avatar-status-overlay.base-avatar-status-overlay-online {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-large .base-avatar-status-overlay.base-avatar-status-overlay-online:hover {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 -60px transparent !important;
}
/* Playing */
html#base-bf3-html body#base-bf3-body .base-avatar-size-large .base-avatar-status-overlay.base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -60px 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-large .base-avatar-status-overlay.base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -60px -60px transparent !important;
}
/* ---------------------------------------------------------------- */
/* Medium avatar (Battlefeed) */
/* ---------------------------------------------------------------- */
/* Online */
html#base-bf3-html body#base-bf3-body .base-avatar-size-medium .base-avatar-status-overlay.base-avatar-status-overlay-online {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-medium .base-avatar-status-overlay.base-avatar-status-overlay-online:hover {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 -36px transparent !important;
}
/* Playing */
html#base-bf3-html body#base-bf3-body .base-avatar-size-medium .base-avatar-status-overlay.base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -36px 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-medium .base-avatar-status-overlay.base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -36px -36px transparent !important;
}
/* ---------------------------------------------------------------- */
/* Small avatar (Com Center and header) */
/* ---------------------------------------------------------------- */
/* Online */
html#base-bf3-html body#base-bf3-body .base-avatar-size-small .base-avatar-status-overlay-online {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-small .base-avatar-status-overlay-online:hover {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll 0 -26px transparent !important;
}
/* Playing */
html#base-bf3-html body#base-bf3-body .base-avatar-size-small .base-avatar-status-overlay-playing {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -26px 0 transparent !important;
}
html#base-bf3-html body#base-bf3-body .base-avatar-size-small .base-avatar-status-overlay-playing:hover {
background: url("http://battlelog-cdn.battlefield.com/public/base/shared/avata...") no-repeat scroll -26px -26px transparent !important;
}
Då finns det ingen risk att CSS-reglerna påverkar andra sajter. (Chrome saknar den funktionen; därför ingår den inte i koden ovan.)
8. Klart!
Instruktioner för Chrome (Windows 7):
1. Gå till %username%\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets.
2. Öppna filen Custom.css med t ex Notepad eller Notepad++.
3. Kopiera CSS-koden ovan, klistra in den i Custom.css och spara.
4. Klart! (Chrome behöver inte startas om.)
FAQ
Det fungerar inte!
1. Kontrollera att koden ligger i rätt fil i rätt mapp och att du har sparat filen.
2. (Firefox) Kontrollera att filen heter userContent.css och inte userContent.css.txt eller liknande.
3. Försäkra dig om att du inte råkade få med någon text som inte skulle vara med.
4. Ladda om sidan med Ctrl+F5.
5. Starta om webbläsaren.
6. Skriv ett inlägg i tråden så ska jag försöka hjälpa dig.
Fungerar det i Internet Explorer?
Det vet jag inte, och det bryr jag mig inte om. Jag kommer inte att ge support för IE, då jag vill göra vad jag kan för att fasa ut den.
Får jag modifiera koden?
Ja.
Skrivet med hjälp av Better SweClockers
