Dark Theme!

[Jeembo]

Hi!
I played around in CSS and made a "dark theme" for BGA.
It's a work in progress but I guess it could be helpful!

Feel free to use it:
https://boardgamearena.com/?use_custom_style=85462014

[Kerley]

Good work.. however...

I clicked to have a look and now I don't know how to change back!

[t_mcpardi]

Good work.. however...

I clicked to have a look and now I don't know how to change back!

https://boardgamearena.com/?use_custom_style=0

[Sweaty Butcher]

Thanks for this OP. I followed the link and really liked the theme, but I wasn't able to save it. Could you please share the CSS? Thank you!

[Froskur]

I really like your Dark Theme, but I am having a hard time figuring out how to make it stick permanently. BGA tells you to share the URL, but how does that help?

[agentcobra]

Could you please share the CSS? Thank you!

Code: Select all

html,body {
background:url(https://cnet1.cbsistatic.com/img/pecM5xCV-zw0mXTSlBwpAbYuPLw=/2018/06/07/78e06ce4-81e0-4b35-992f-6a2b3585b931/mojave-night.jpg) no-repeat center center fixed;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
}

h1 {
color:#4268A8!important;
}

a:link,a:visited,a:hover,a:active {
color:#FFF;
font-weight:700;
}

#current_table_banner,#async_table_banner {
background-color:rgba(200,0,0,0.6);
}

.pageheader_big_switch {
background:#979db0!important;
background-color:#979db0!important;
}

#server_status_warning_message {
color:#fff;
background-color:rgba(255,111,0,0.6);
}

.roundedbox,.log,.chatlog,.ownchatlog,.roundedboxinner,.sameauthor,.chatlog {
color:#000;
}

.pageheader_menuitem,.pageheader_menuitemselected {
background-color:#1C1C1C!important;
background:#1C1C1C!important;
color:#FFF;
}

#page-title {
background-color:#494949!important;
}

#login-menu span,#mobile_myprofile span,#mobile_preference-menu-item span,#mobile_doc-menu-item span,#mobile_disconnect_button span,#player_name,#dijit__MasterTooltip_0 span,div [id^=table_expected_banner] span,#time_to_think_descr,#game_result_label,div [id^=postmessage_f_] span,div [id^=postmessage_commentcontent] {
color:#1C1C1C;
}

.roundedbox,.gametable,.game_suggestion,#suggestion_carousel,#game_wannaplay_add_dropdown {
background-color:#494949;
color:#fff;
}

a.bgabutton_gray,.button_gray,.replay_last_move_button,#use_time_joker,#cantstartgame,#quit_game,#invite_friend,#addToFriend,#unregister_tournament,.bgabutton_large,.display_cannot_join,.display_inline,.buybuttonlink,#buygame,#reviewgame,#playersaroundtable_startchat,#invite_to_groupe_toggle,#show_more_filters,.diceactions,#estimated_duration_wrap,#creationtime,#tournament_link,#pageheader,#pageheaderlobby,#reviewgame,.pageheader,.newbgatable,#player-module,a[id^=playersaroundtable_startvideochat_table_],a[id^=playersaroundtable_startaudiochat_table_],a[id^=add_to_my_game_],#start_game_refuse,#updateProfileInfos_btn,#pagesection_prestige a,#pagesection_lastresults a,#seefriends,#pagesection_groups a,#limit_table_access a {
color:#fff;
border-color:#fff;
}

#join_cancel,#infirm_btn_1 span,#infirm_btn_1,#cancel_button,a[id^=expected_refuse_],#fireplayer_cancel {
color:#1c1c1c;
border-color:#1c1c1c;
}

#game_in_progress_stats td,#game_in_progress_stats th,a,#pageheader_gameresult,#pageheader_gameview,#pageheader_gameview,#pageheader_buy,#time_to_think_descr,div [id^=postmessage_a],#round_count,#deck_count_nbr,#diceboard {
color:#fff;
}

h2,h3,h4,h5,h6,p,h3 a,#pagemaintitletext,#gameaction_status {
color:#FFF!important;
}

#playwithfriend_link,#favorite_see_all_tables_label,#newsfeed span.gamename,div [id^=table_expected_banner] span {
color:#4268A8;
}

a.gametablelink,.chatwindowcollapsed {
background-color:#494949;
}

.activep_layer,.whiteblock,#topbar,#wannaplay_title,#main-content h3,#overall-content h3,#pagesection_howtoplay h2 {
background:#494949;
}

.chatwindowlogs_zone,.player-board {
background:#979db0;
}

.roundedbox,#current_table_banner span,#async_table_banner span,.date_to_format,.postdate,#joinGameDialog span,#async_table_banner a,#wannaplay_title,#wannaplay_title span,#mobile-menu-icon-button i,#menu_label,#reflexiontime_value,#its_your_turn,#tournamentfullname,#main-content h3,#overall-content h3,#pagesection_howtoplay span {
color:#FFF;
}

.login-menu-item,.displaysize,.notselected,.sortby,.selected,.standard_popin_title,#popin_playVideoDialog_title {
color:#000!important;
}

div [id^=tournament_],.pageheader,#pageheader_lobbymenunav,#lobby_invite_friend_zone,#page-title {
background-color:#1C1C1C;
}

.pagesection,#bga_statistics,#follow_us_portlet,.tips,#pageheader_realtime,#pageheader_async,#pageheader_inprogress {
background-color:#1c1c1c;
color:#fff;
}

[harmonius]

Pas mal du tout !
Je voulais me faire un thème également mais mes modifications ne semble jamais prisent en compte. J'ai essayé avec ton code et il n'ai pas pris en compte.

Quand je prend le lien vers un css custom ça marche et je retrouve le code dans mes paramètres. Mais dés que je change un paramètre et fait enregistrer tout disparaît.

Une idée de ce que je fais mal ?

English version:
Not bad at all !
I wanted to a style myself but my modification are never taken into account. I tried to use your code but it does not work either.

When I use a link to a custom css it works fine. And I find the code in my settings. But as soon as I modify some value it gets ignored again.

Any idea of what I may be doing wrong ?

[VinceDuGG]

Thanks for sharing. I try to modify my CSS. For example with a simple :

Code: Select all

html {
color:red;
}

But when I save it does not apply and basically write my css rule on top of the #topbar ! On sourcecode my css rule appears in plain text, without style tags, like this :

Code: Select all

<link rel="stylesheet" type="text/css" href="https://x.boardgamearena.net/data/themereleases/current/css/libraries.css?1"/>

html {
color:red;
}

<link rel="apple-touch-icon" sizes="57x57" href="https://x.boardgamearena.net/data/themereleases/200316-1631/img/favicon/apple-icon-57x57.png" />

I already to add manually the style tags around my CSS rules but they are not interpreted.
Any idea of how to make it work ?

[harmonius]

Same time, same problem !

[VinceDuGG]

Héhé, tout à fait

Found it, we have to use the custom css URL of our profile to see modifications applied !
https://boardgamearena.com/?use_custom_style=123456789