Title: Epochtalk Dark Theme Post by: omer-jamal on June 17, 2019, 07:54:07 PM hi there,
this Simple try edit Epochtalk style (CSS) to Dark Theme Screenshots https://i.ibb.co/0X1w3Qx/image.png https://i.ibb.co/N6P150M/image.png https://i.ibb.co/sW1m0y4/image.png (https://i.ibb.co/sW1m0y4/image.png) https://i.ibb.co/NT032GK/image.png (https://i.ibb.co/NT032GK/image.png) https://i.ibb.co/ZBpkztp/image.png https://i.ibb.co/tsDqbVD/image.png https://i.ibb.co/j5JMtXc/image.png (https://i.ibb.co/j5JMtXc/image.png) https://i.ibb.co/XJKGh6K/image.png (https://i.ibb.co/XJKGh6K/image.png) How to change appearance? by using extensions in your browser like "Stylus" Don't use use Stylus extension https://i.ibb.co/jySyPWY/ico.jpg here to know how (GUIDE) How to easy change the appearance of Bitcointalk to dark (Dark Theme)? (https://bitcointalk.org/index.php?topic=5152016.0) (written by wwzsocki (https://bitcointalk.org/index.php?action=profile;u=131333)) you can test https://www.cryptos-currencies.com (First forum using Epochtalk) Copy this style code to your stylish extension Dark Theme Style Code Code: /* to hide quote from top! --------------*/ #motd-wrap {display:none} html, body,footer, .thread-editor-container .editor-form .editor-header, .editor-form .editor-body .editor-preview, .editor-form .editor-body .editor-input { background-color: #1c1f25; color: #eee; } h1, h2, strong {color: #eee} hr { color: #313133 !important; background-color: #313133 !important } table.striped { border-color: #191b21; background: #25282d; } table.striped thead { background-color: #191b21; } table.striped tr:nth-of-type(even), table.striped tbody:nth-of-type(even) { background-color: #33363c; } .page-header-split div:not(:first-child).moderators .label { color: #999; } label { color: #ccc } header #motd-wrap { border-bottom-color: #3b3f46 } .input-text, .ng-modal-dialog input, input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], select, textarea, .input-text,tags-input .tags { background-color: #14161b !important; color: #ccc !important; border-color: #373b44; } input[type].ng-untouched, textarea.ng-untouched { border-color: #373b44 !important } input.toggle-switch+label:before { background-color: #1c1f25 !important;} /* disabled inputs! change background color to dark! -------------------------------*/ input[type="text"]:disabled, input[type="text"][disabled], input[type="password"]:disabled, input[type="password"][disabled], input[type="date"]:disabled, input[type="date"][disabled], input[type="datetime"]:disabled, input[type="datetime"][disabled], input[type="datetime-local"]:disabled, input[type="datetime-local"][disabled], input[type="month"]:disabled, input[type="month"][disabled],input[type="week"]:disabled, input[type="week"][disabled], input[type="email"]:disabled, input[type="email"][disabled],input[type="number"]:disabled, input[type="number"][disabled], input[type="search"]:disabled, input[type="search"][disabled],input[type="tel"]:disabled, input[type="tel"][disabled], input[type="time"]:disabled, input[type="time"][disabled],input[type="url"]:disabled, input[type="url"][disabled], input[type="color"]:disabled, input[type="color"][disabled], select:disabled,select[disabled], textarea:disabled, textarea[disabled], .input-text:disabled, .input-text[disabled] { background-color: #3e4146 !important; } header #menu-wrap #menu ul .search .search-input { background-color: inherit !important } .editor-form.new-thread .editor-body .editor-input, .editor-form.new-thread .editor-body .editor-preview { color: #ccc !important; border-color: #373b44 !important; background-color: #1c1f25 !important; } .thread-editor-container { background-color: #1c1f25 !important; } input[type].ng-untouched, textarea.ng-untouched { border-color: #393c42; } .input-info { background-color: #ccc; } body, footer, .thread-controls-wrap, .page-header-split div:first-child h4, header #breadcrumbs-wrap #breadcrumbs ul li a, header #breadcrumbs-wrap #breadcrumbs ul li, .page-header-split div:first-child, select { color: #ccc !important; } header #breadcrumbs-wrap { border-bottom: 1px solid #1c1f27; } footer, .thread-controls-wrap, header #breadcrumbs-wrap, .board-controls-wrap, header #motd-wrap { background-color: #25282f !important; } .thin-underline { border-bottom: 1px solid #434750; } .thread-data .post-block.highlighted { background-color: HSL(223, 13%, 17%); } .thread-data .post-block.editing { background-color: rgba(95, 131, 162, 0.15); } .polls { color: #dedede; border: 1px solid #40444c; } .polls .poll-answer .poll-select { color: #ececec; } .ng-modal-dialog { background-color: #24272c; } /* Style Messages */ .messages .msg-container .message.sender, .conversations .list .cell.active { background-color: #181b21; } .messages .msg-container .message { border-bottom-color: #2a2d33; } .messages .msg-container .message:first-child { border-top-color: #2a2d33; } /*motd.ng-scope { display: none !important; }*/ .thread-data .post-block .post-user .user-avatar img, .profile-content .profile-left .profile-avatar-container img.loaded{ border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-width: 3px !important; } .post-content .post-title .username { border-radius: 5px; } .post-content .post-body { padding-left: 15px !important; } .thread-data .post-block:first-child { border-top: 1px solid #2d2e31 !important; } .thread-data .post-block { border-bottom: 1px solid #2d2e31 !important; } .thread-data .post-block .post-content .post-title .post-action li a strong { color: #65676d !important; } /*hide Post Hidden!*/ .thread-data .post-block.deleted { display: none !important; } /*change link color to blue .post-block a {color: #476C8E} .post-block a:hover {color: green; text-decoration: underline; }*/ .thread-data .post-block .post-content .post-title { margin-bottom: 8px !important; } /* change username font-weight ----------------------------------*/ .thread-data .post-block .post-content .post-title a.username { color: #fff !important; font-weight: 700 !important; } /* change online username icon ----------------------------------*/ .online .fa-circle-o:before { content: ' ' !important; } .online:before { font-family: FontAwesome; content: "\f111"; display: inline-block; font-size: 11px; } /* quote style -------------------*/ .quoteHeader { border:0; margin: 0.4rem 0 0 0; } .quote { border-left: 4px solid #474c56 !important; margin: 0 0 0.6rem 0.6rem; padding: 0 0.6rem !important; } .quoteHeader a { color: #464b54 !important; font-size: 14px !important; } /* #post-tools-fixed ---------------------*/ #post-tools-fixed { background-color: rgba(28, 31, 37, 0.9); border-top-color: #33363e; } .editor-form .editor-footer { background-color: #1b1e24; border-top-color: #33363e; } /*--------*/ /* editor ----------------------*/ .editor-top-bar, .editor-container { background-color: #2b2e35; } .editor-container { border-color: #32363e; } .editor-form .editor-body input[type], .editor-form .editor-body .editor-input, .editor-form .editor-body .editor-preview { border-top-color: #60646f; border-bottom-color: #60646f; } .inverted-button { border-color: #404550; } .editor-top-bar .editor-formatting { background-color: #25282f; } if you do not like Dark Theme and you want Default theme with Some changes (https://i.ibb.co/mcHX67G/image.png) you can use this style code: https://pastebin.com/awwtxUPf it's not completed, so you can see some page or inputs not been applied Title: Re: Epochtalk Dark Theme Post by: TryNinja on June 28, 2019, 11:51:31 PM Don't use Stylish...
For reference: "Stylish" browser extension steals all your internet history (https://robertheaton.com/2018/07/02/stylish-browser-extension-steals-your-internet-history/) Use "Stylus", a Stylish fork but without any tracking or analytics. Title: Re: Epochtalk Dark Theme Post by: Joel_Jantsen on June 30, 2019, 11:43:21 PM I simply hate using browser extensions or user-scripts to modify some behavior on my web-page if it is not an absolute necessity. Current bitcointalk has lot of user-scripts out of which some are useful while some are subjective. If the developers can survey the most widely used user-scripts and embed their functionality by default in the new forum, it will be helpful. For instance, a button that allows you to toggle between day-theme and night-mode.
|