Skip to content

AL MAL by jordy3d

Screenshot of AL MAL

Details

Authorjordy3d

LicenseNo Redistribution

Categorymyanimelist

Created

Updated

Size68 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Makes MyAnimeList look a bit more like AniList.

Notes

Release!

  • AniList-inspired logo!
  • AniList-inspired colour scheme!
  • AniList-inspired search box (may need to be clicked on twice to work)!
  • More compact header!
  • Sticky Header!
  • Darker scrollbar because ew!
  • Probably more!

Update 1!

  • Found a couple of minor spots that needed to be re-coloured!
  • Changed the header a little to have the tabs be white and enabling the links below them to change colour on hover!
  • Probably something else I forgot!

Update 2!

  • Removed the Halloweeny-ness from the style. It was kinda getting in the way and it's not particularly necessary
  • Minor bugfixes
  • Minor updates here and there

Update 3!

  • Removed a few minor elements
  • Fixed broken text on Anime/Manga History
  • Fixed Next/Previous text on places like Top Anime
  • Fixed "Your Score" text on places like Top Anime

Update 4!

  • Update to Seasonal view (noticed on Producer page, not sure if it was there for other pages

Update 5!

  • Removed Valentines stuff because I'm alone (and also just to keep a consistent look)
  • Removed add above main panel on home page
  • Minor changes here and there where styling was missed

Update 6!

  • Modified Easter stuff. I decided to keep it rather than remove it because it doesn't look too distracting, but you can comment the appropriate spot if you want.
  • Minor update to header colours

Update 6.5!

  • Apparently MAL decided to change something which broke the background of the style. It's fixed now.

Update 7!

  • Made the Main Page react kinda nicely with the webpage size being updated. Hopefully I can start working on most major pages supporting various page sizes...

Update 8!

  • Got my first profile comment, which revealed to me some missing portions of the style. They should be covered now!

Update 9!
Reviews on MAL updated apparently, so this is to catch up with that.

  • Update review BG
  • Update review avatar icon
  • Added arrows to things that AniList normally has arrows for

Update 10!
Forums on MAL updated apparently, so this is to catch up with that.

  • Update message BG
  • Update message sender BG
  • Updated minor UI elements
  • Disabled my page resize thing for now. Will prolly work on it again at some point, but MAL is a mess to work with effectively.

Update 11!
Minor update, actually

  • Update Sort bar in certain contexts
  • Give Genre description a theme-appropriate colour

Update 12!
Missed Stuff update

  • Updated elements on other Profile tabs

Update 13!

  • A bunch of stuff I must have forgotten already
  • Removed another ad banner
  • Prep work for new layout styles on the Home Page...

Update 14!
HOTFIX
MAL added their own Dark Mode (guess they left 2016...) and it broke a bunch of stuff.
I've attempted to restore most key stuff, but things are still in progress, albeit low-priority.

Update 15!
Been a while, I guess. Nothing major this time, just a few bits and pieces I felt needed ot be fixed or updated.

  • Improved spacing between elements on Profile page
  • Improved New Reply bar thing in Forums
  • Gave colour to some Forum buttons
  • Fixed the Interest Stacks on a media page
  • Improved my Quote hover effect (now nested quotes won't have all quotes have the hover bar)

Update 16
Been another while...

  • Fixed up the Reply and Comment input fields on Profiles and Forum threads
  • Applied styling to the new forum thread style
  • Applied styling to forum context menus
  • Probably some more things I've forgotten...

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name         AL MAL
@version      20240531.05.44
@namespace    https://userstyles.world/user/jordy3d
@description  Makes MyAnimeList look a bit more like AniList.
@author       jordy3d
@license      No License
==/UserStyle== */

@-moz-document domain("myanimelist.net") {
/*Primarily style theme*/

/*Dark Scrollbar*/
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #fff0; }
::-webkit-scrollbar-thumb { background: #192739; }
::-webkit-scrollbar-thumb:hover { background: #39516b; }
::-webkit-scrollbar-corner { background: #0000; }

body, html,
body:not(.ownlist),
.page-common #myanimelist,

.page-common #contentWrapper,
.page-common #content,

.page-forum .forum_boardrowspacer,

#fancybox-outer,

.page-rwd.page-history #contentWrapper,

.review-element,

a.mal-btn.outline, button.mal-btn.outline
{
  background: var(--aniListMainBG);
}

body, html
{
    background: var(--aniListMainBG) !important;
}

.page-common #menu,
.anime-detail-header-stats .stats-block,
.anime-detail-header-stats .user-status-block,

.page-common #horiznav_nav ul li a,

.detail-characters-list .left-column table:nth-of-type(even), .detail-characters-list .left-right table:nth-of-type(even),

.page-forum .forum_boardrow1,

.page-common .footer-ranking,

.page-common .incrementalSearchResultList .list,

.page-common .bgColor1,

body.news .news-container .news-info-block, body.news .news-container .tags,
.news-list .comment-list:nth-of-type(even),
.seasonal-anime-list .seasonal-anime .prodsrc,
.seasonal-anime-list .seasonal-anime .genres .genre,
.seasonal-anime-list .seasonal-anime .synopsis,

.ranking-digest,
.widget-slide-block .widget-slide .btn-anime .external-link,

.navi-seasonal,

.page-common .halloween .h1,

.btn-rect-grey1,
.page-common .btn-forum,

.page-forum .btn-forum-manga-store,

.forum .forum-board:nth-of-type(even),

body.notification .notificaiton-category-nav a.active,
body.notification .notificaiton-category-nav a:hover,

body.notification .notification-item:hover,

.quickadd-content .quickAdd-anime-result-unit:nth-of-type(odd), .quickadd-content .quickAdd-manga-result-unit:nth-of-type(odd),

.ownlist_style #new-style .info,
.ownlist_style .new-theme-list .new-theme-unit,

.pmessage-message-history,
.page-common .bgbdrContainer,

.private-message-content .dialog-text,

.about-content.content-bg-grey,

.page-common .header-notification-item.new,

.page-common.ownlist_anime_update #dialog,

.header2,

.about-membership .pb24.mb16,
.membership .about-membership .about-no-ads,

.anime-character, .manga-character,

.c-box.has-bg,

[class*=submissions-answer],

.mal-navbar, .dark-mode .mal-navbar,

body.index .widget-container .widget.friend_list_updates .footer,

.anime-filter2 .navi-seasonal .horiznav-nav-seasonal .btn-type li,

.head-config,
.profile .boxlist-container .boxlist,

.page-forum .forum.thread .message .message-container
{
  background: var(--anilistLift1);
  
  border-radius: var(--borderRadius);
}

.top-ranking-table tr.ranking-list td,

.user-profile .user-status li,
.dark-mode .user-profile .user-status li,

.sns-setting .table tr:nth-of-type(odd) td,

.message.read > .mym,

.ownlist_style_theme .customize-content-left h2.theme-custom-header,

#gdpr-modal-bottom,

.profile .user-comments .comment,

.page-forum .forum-topic-message .message-wrapper .content,
.page-common table.forum-topics
{
  background: var(--anilistLift1);
}

.setting-row.show-hidden,

.page-common .header-profile .header-profile-dropdown ul li a:hover
{
  background: var(--anilistLift1) !important;
}

.page-common #headerSmall,
.page-common #searchBar.searchBar #topSearchText, .page-common #searchBar.searchBar #topSearchValue,

.page-forum .forum_boardrow2,

.page-common #footer-block,

.page-common .incrementalSearchResultList, .page-common #searchBar.searchBar #topSearchButon,
.page-common .incrementalSearchResultList .list.separator,
.page-common .incrementalSearchResultList .list.focus,

.btn-detail-recommendations-view-all,

.page-common .quotetext, .page-common .codetext,
.replied,

body.news .news-container .tags .tag,

.seasonal-anime-list .seasonal-anime .genres,
.seasonal-anime-list .seasonal-anime .prodsrc a.button_add, .seasonal-anime-list .seasonal-anime .prodsrc a.button_edit,
.seasonal-anime-list .seasonal-anime .image,
.seasonal-anime-list .seasonal-anime .information .scormem,
.seasonal-anime-list .seasonal-anime .information .info,

.ranking-digest .ranking-header,
.page-common a.button_add.button_add, .page-common a.button_add.button_edit, .page-common a.button_edit.button_add, .page-common a.button_edit.button_edit,

.page-common .header-profile .header-profile-dropdown,
.page-common .header-profile .header-profile-dropdown a,
.page-common .header-notification-dropdown .arrow_box,

.page-common #nav li a:hover, .page-common #nav li.hover a,

.user-profile .user-status li:nth-of-type(even),

.profile .user-statistics .stats-graph,
.profile .user-statistics .stats-graph .graph.plan_to_watch, .profile .user-statistics .stats-graph .graph.plan_to_read,
.profile .statistics-updates .data .graph,

.user-profile .user-function .icon-user-function,

.top-ranking-table tr.ranking-list:nth-of-type(odd) td,

.page-common .header-list .header-list-dropdown, .page-common .header-list .header-list-dropdown a,

body.notification .notificaiton-category-nav a .counter.zero,

.quickadd-content .quickadd-form-search .inputtext, .quickadd-content .quickadd-form-search .inputButton,

.notification_settings .notification-setting-content .settings-notification .setting.header td,

.private-message-content .message.selected:first-of-type > .mym,

.page-common div.picSurround img,

.seasonal-anime-list .seasonal-anime .information,

.page-common #menu #menu_left #nav li:hover,

.profile .user-comments .comment > .text > .postActions + div > .spaceit,

.review-element > div > .body,

.review-element .thumbbody .body .bottom-navi .menu .menu-block,

.page-forum .forum-topic-message .message-wrapper .profile,

.page-common table.forum-topics tr td:nth-child(2n+1),

.page-common .bg-color-base5,

.history_content_wrapper .history-updates .work-graph,

.dark-mode a.mal-btn.secondary.outline.noborder.pressed, .dark-mode button.mal-btn.secondary.outline.noborder.pressed
{
  background-color: var(--anilistLift2) !important;
}

.navi-seasonal .horiznav_nav ul li a, .navi-seasonal .horiznav_nav ul li a.navtab,
.navi-seasonal .horiznav-nav-seasonal .btn-seasonal .btn-type,

.spoiler input,

.setting-row.locate-right,

.notification_settings .notification-setting-content .settings-notification .setting td.button input[type=checkbox]:checked+label,

.footer-container,

.profile .user-comments .comment:nth-of-type(odd),

.page-forum .topic-poll .topic-poll-result .topic-poll-option .vote .topic-poll-button,

.dark-mode .mal-navbar button.mal-btn.secondary.outline
{
  background: var(--anilistLift2);
}

.anime-search-form-block .anime-search-form-search .inputtext,

.anime-search-form-block .anime-search-form-search .inputButton,

.page-common .borderClass[style*="f6f6f6"],

.footer-divider::after,

.page-common #nav ul,
.review-element .thumbbody .body .reaction-box .btn-reaction
{
  background-color: var(--anilistLift2) !important;
}

.quotetext > .quotetext,

.quotetext input[type="button" i],

#douki-anilist-username,

.page-common .header-profile .header-profile-dropdown a:hover,
.page-common .header-notification-item:hover, .page-common .header-notification-view-all a,

.top-ranking-table .status .btn-addEdit-large.btn-anime-watch-status,

.top-ranking-table .title .button-preview,

.page-common .header-list .header-list-dropdown:hover,

.page-common #menu.halloween #nav ul a:hover,

.review-element .thumbbody .body .reaction-box
{
    background-color: #0c1724b3 !important;
}

.anime-manga-search .genre-link .genre-list .genre-name-link:hover,

.user-profile .user-status li.link:hover, .user-profile .user-status li.link:hover
{
    background-color: #0f253eb3 !important;
}

.page-common .badresult,

.page-common a.button_add.button_add.dropped, .page-common a.button_add.button_edit.dropped, .page-common a.button_edit.button_add.dropped, .page-common a.button_edit.button_edit.dropped
{
    background-color: #391919 !important;
}

.page-common a.button_add.button_add.reading, .page-common a.button_add.button_add.watching, .page-common a.button_add.button_edit.reading, .page-common a.button_add.button_edit.watching, .page-common a.button_edit.button_add.reading, .page-common a.button_edit.button_add.watching, .page-common a.button_edit.button_edit.reading, .page-common a.button_edit.button_edit.watching,

.review-element .thumbbody .body .tags .tag.recommended,

.msg-frame
{
  background-color: #193922 !important;
  color: #50a735 !important;
}
.page-common a.button_add.button_add.completed, .page-common a.button_add.button_edit.completed, .page-common a.button_edit.button_add.completed, .page-common a.button_edit.button_edit.completed
{
  background-color: #4a76dc !important;
  color: #82dae9 !important;
}


.review-element .thumbbody .body .tags .tag.mixed-feelings
{
  background-color: #573e0c !important;
  color: #d2802d !important;
}
.review-element .thumbbody .body .tags .tag.not-recommended,

.mal-alert.danger
{
  background-color: #391919 !important;
  color: #dc4a4a !important;
}

.page-common .goodresult, .page-common .successQuery
{
    background-color: #193922;
}

.user-status-block .form-user-score,
.user-status-block .form-user-status, .user-status-block .btn-user-status-add-list,
.user-status-block .form-user-episode,

.page-common .inputtext,

.top-ranking...

Reviews

No reviews yet.