From 61b39823498dc4c023bd49f4523a9bf8bb05b5e0 Mon Sep 17 00:00:00 2001 From: marshallovski <68496774+marshallovski@users.noreply.github.com> Date: Fri, 19 Apr 2024 10:12:41 +0200 Subject: [PATCH] fix(theme-midnight): change photo viewer bg color and "beautify" the stylesheet (#1107) --- themepacks/midnight/stylesheet.css | 253 +++++++++++++++++++++++++---- 1 file changed, 218 insertions(+), 35 deletions(-) diff --git a/themepacks/midnight/stylesheet.css b/themepacks/midnight/stylesheet.css index d733f5d1..93f86d8a 100644 --- a/themepacks/midnight/stylesheet.css +++ b/themepacks/midnight/stylesheet.css @@ -6,7 +6,10 @@ html { color-scheme: dark !important; } -body, #backdropDripper, #standaloneCommentBox { +body, +#backdropDripper, +#standaloneCommentBox, +.ovk-photo-view { background-color: #0e0b1a; color: #c6d2e8; } @@ -15,11 +18,17 @@ body, #backdropDripper, #standaloneCommentBox { box-shadow: -30px 0px 20px 20px #0e0b1a, -50px 0px 20px 20px hsl(252 41% 7% / 59%), -70px 0px 20px 20px hsl(252 41% 7% / 43%), -90px 0px 20px 20px hsl(252 41% 7% / 35%), -110px 0px 20px 20px hsl(252 41% 7% / 28%), -130px 0px 20px 20px hsl(252 41% 7% / 16%), 30px 0px 20px 20px #0e0b1a, 50px 0px 20px 20px hsl(252 41% 7% / 59%), 70px 0px 20px 20px hsl(252 41% 7% / 43%), 90px 0px 20px 20px hsl(252 41% 7% / 35%), 110px 0px 20px 20px hsl(252 41% 7% / 28%), 130px 0px 20px 20px hsl(252 41% 7% / 16%); } -span, .post-author .date, .crp-entry--message---text, .messenger-app--messages---message .time, .navigation-lang .link_new, .tippy-box text { +span, +.post-author .date, +.crp-entry--message---text, +.messenger-app--messages---message .time, +.navigation-lang .link_new, +.tippy-box text { color: #8b9ab5 !important; } -.nobold, nobold { +.nobold, +nobold { color: #6f82a8; } @@ -31,15 +40,103 @@ span, .post-author .date, .crp-entry--message---text, .messenger-app--messages-- color: #8eb2d0; } -.wrap1, .wrap2, .page-wrap, #wrapH, #wrapHI { +.wrap1, +.wrap2, +.page-wrap, +#wrapH, +#wrapHI { border-color: #1c202f; } -.accountInfo, .left_small_block, #profile_link, .profile_link, .navigation .link, .navigation .link:hover, .navigation_footer .link, .navigation_footer .link:hover, .completeness-gauge, input[type="text"], input[type="password"], input[type~="text"], input[type~="password"], input[type="email"], input[type="phone"], input[type~="email"], input[type~="phone"], input[type="search"], input[type~="search"], input[type~="date"], select, .content_title_expanded, .content_title_unexpanded, .content_subtitle, textarea, .post-content, .post-author, hr, h4, .postFeedWrapper, .tabs, #wallAttachmentMenu, .ovk-diag, .ovk-diag-head, #ovkDraw, #ovkDraw .literally .lc-picker, .literally .lc-options.horz-toolbar, .page_wrap, .container_gray .content, .summaryBar, .groups_options, form[action="/search"] > input, .header_search_input, .header_search_inputbt, .accent-box, .page_status_popup, .messenger-app--input, .messenger-app, .crp-entry:first-of-type, .crp-list, .crp-entry, .note_footer, .page_content > div, #editor, .note_header, center[style="background: white;border: #DEDEDE solid 1px;"], .album-photo img, .mb_tabs, .mb_tab#active div, .navigation-lang .link_new, #faqhead, #faqcontent, .post-divider, .comment, .commentsTextFieldWrap, tr, td, th, #votesBalance, .paginator a.active, .paginator a:hover, .topic-list-item, #userContent blockquote, .tippy-box[data-theme~="vk"], .poll, #standaloneCommentBox, .searchBtn, .searchList #used, .searchOptionName, .borderup, #tour, #auth, .ovk-photo-view, .searchOptions { +.accountInfo, +.left_small_block, +#profile_link, +.profile_link, +.navigation .link, +.navigation .link:hover, +.navigation_footer .link, +.navigation_footer .link:hover, +.completeness-gauge, +input[type="text"], +input[type="password"], +input[type~="text"], +input[type~="password"], +input[type="email"], +input[type="phone"], +input[type~="email"], +input[type~="phone"], +input[type="search"], +input[type~="search"], +input[type~="date"], +select, +.content_title_expanded, +.content_title_unexpanded, +.content_subtitle, +textarea, +.post-content, +.post-author, +hr, +h4, +.postFeedWrapper, +.tabs, +#wallAttachmentMenu, +.ovk-diag, +.ovk-diag-head, +#ovkDraw, +#ovkDraw .literally .lc-picker, +.literally .lc-options.horz-toolbar, +.page_wrap, +.container_gray .content, +.summaryBar, +.groups_options, +form[action="/search"]>input, +.header_search_input, +.header_search_inputbt, +.accent-box, +.page_status_popup, +.messenger-app--input, +.messenger-app, +.crp-entry:first-of-type, +.crp-list, +.crp-entry, +.note_footer, +.page_content>div, +#editor, +.note_header, +center[style="background: white;border: #DEDEDE solid 1px;"], +.album-photo img, +.mb_tabs, +.mb_tab#active div, +.navigation-lang .link_new, +#faqhead, +#faqcontent, +.post-divider, +.comment, +.commentsTextFieldWrap, +tr, +td, +th, +#votesBalance, +.paginator a.active, +.paginator a:hover, +.topic-list-item, +#userContent blockquote, +.tippy-box[data-theme~="vk"], +.poll, +#standaloneCommentBox, +.searchBtn, +.searchList #used, +.searchOptionName, +.borderup, +#tour, +#auth, +.ovk-photo-view, +.searchOptions { border-color: #2c2640 !important; } -.tippy-box[data-theme~="vk"][data-placement^='top'] > .tippy-arrow::before, .tippy-box[data-theme~="vk"][data-placement^='bottom'] > .tippy-arrow::before { +.tippy-box[data-theme~="vk"][data-placement^='top']>.tippy-arrow::before, +.tippy-box[data-theme~="vk"][data-placement^='bottom']>.tippy-arrow::before { border-top-color: #1e1a2b; border-bottom-color: #1e1a2b; } @@ -53,7 +150,13 @@ hr { box-shadow: unset; } -.button, #activetabs, .messagebox-content-header, .accent-box, .button_search, .searchBtn, .searchOptionName { +.button, +#activetabs, +.messagebox-content-header, +.accent-box, +.button_search, +.searchBtn, +.searchOptionName { background-color: #383052; } @@ -61,7 +164,9 @@ hr { background-color: #40375e; } -.menu_divider, .ovk-diag-action, .minilink .counter { +.menu_divider, +.ovk-diag-action, +.minilink .counter { background-color: #2c2640; } @@ -70,11 +175,14 @@ hr { border-color: #2c2640; } -.bsdn_contextMenuElement:hover, .searchList li:hover { +.bsdn_contextMenuElement:hover, +.searchList li:hover { background-color: #29223a; } -#ovkDraw .literally .lc-picker, .literally .lc-options.horz-toolbar, .mb_tab#active { +#ovkDraw .literally .lc-picker, +.literally .lc-options.horz-toolbar, +.mb_tab#active { background-color: #453e5e !important; } @@ -82,19 +190,35 @@ hr { background-color: #272e4894; } -a, .page_footer .link, #profile_link, .profile_link { +a, +.page_footer .link, +#profile_link, +.profile_link { color: #8fb9d8; } -.page_footer .link:hover, .navigation .link:hover, .navigation .edit-button:hover, #profile_link:hover, .profile_link:hover, #wallAttachmentMenu > a:hover, .crp-entry:hover, .navigation-lang .link_new:hover, .paginator a:hover, .post-share-button:hover, .post-like-button:hover, .searchBtn:active { +.page_footer .link:hover, +.navigation .link:hover, +.navigation .edit-button:hover, +#profile_link:hover, +.profile_link:hover, +#wallAttachmentMenu>a:hover, +.crp-entry:hover, +.navigation-lang .link_new:hover, +.paginator a:hover, +.post-share-button:hover, +.post-like-button:hover, +.searchBtn:active { background-color: #272138 !important; } -.header_navigation .link a, .searchOptionName { +.header_navigation .link a, +.searchOptionName { color: #bcc3d0; } -.header_navigation .link a:hover, .home_button_custom { +.header_navigation .link a:hover, +.home_button_custom { color: #c7cdd9; } @@ -107,7 +231,8 @@ a, .page_footer .link, #profile_link, .profile_link { color: #7b94c4 !important; } -#test-label, .msg.msg_err { +#test-label, +.msg.msg_err { background-color: #30161d; } @@ -115,19 +240,47 @@ a, .page_footer .link, #profile_link, .profile_link { background-color: #163f13; } -h4, .content_title_expanded, .summaryBar .summary, .content_title_unexpanded { +h4, +.content_title_expanded, +.summaryBar .summary, +.content_title_unexpanded { color: #7c94c5; } -.notes_titles small, .post-upload, .post-has-poll { +.notes_titles small, +.post-upload, +.post-has-poll { color: #6f82a8; } -.content_title_expanded, .content_title_unexpanded, .ovk-diag, .settings_delete, center[style="background: white;border: #DEDEDE solid 1px;"], .album-photo img, #faqhead, td.e, tr.e { +.content_title_expanded, +.content_title_unexpanded, +.ovk-diag, +.settings_delete, +center[style="background: white;border: #DEDEDE solid 1px;"], +.album-photo img, +#faqhead, +td.e, +tr.e { background-color: #231e33 !important; } -.content_subtitle, .postFeedWrapper, .ovk-diag-head, .container_gray, .page_status_popup, .messenger-app--input, .note_header, #faqcontent, .commentsTextFieldWrap, td.v, tr.v, #votesBalance, .expand_button, #userContent blockquote, .tippy-box[data-theme~="vk"], .searchOptions { +.content_subtitle, +.postFeedWrapper, +.ovk-diag-head, +.container_gray, +.page_status_popup, +.messenger-app--input, +.note_header, +#faqcontent, +.commentsTextFieldWrap, +td.v, +tr.v, +#votesBalance, +.expand_button, +#userContent blockquote, +.tippy-box[data-theme~="vk"], +.searchOptions { background-color: #1e1a2b !important; } @@ -144,15 +297,20 @@ h4, .content_title_expanded, .summaryBar .summary, .content_title_unexpanded { background-image: url("/themepack/midnight/0.0.2.8/resource/flex_arrow_shut.gif") !important; } -.ovk-video > .preview, .video-preview { +.ovk-video>.preview, +.video-preview { box-shadow: inset 0 0 0 1px #231e33, inset 0 0 0 2px #1e1a2b; } -#wallAttachmentMenu, .container_gray .content, .mb_tabs { +#wallAttachmentMenu, +.container_gray .content, +.mb_tabs { background-color: #120e1f; } -#wallAttachmentMenu > .header, .messenger-app--messages---message.unread, tr.h { +#wallAttachmentMenu>.header, +.messenger-app--messages---message.unread, +tr.h { background-color: #1d192b; } @@ -176,19 +334,37 @@ h4, .content_title_expanded, .summaryBar .summary, .content_title_unexpanded { background-image: url("/themepack/midnight/0.0.2.8/resource/header_custom.png") !important; } -.page_yellowheader span, .page_yellowheader a { +.page_yellowheader span, +.page_yellowheader a { color: #a48aff !important; } -.completeness-gauge, .poll-result-bar { +.completeness-gauge, +.poll-result-bar { background-color: #231e33; } -.completeness-gauge > div, .poll-result-bar-sub { +.completeness-gauge>div, +.poll-result-bar-sub { background-color: #2c2640; } -form[action="/search"] > input, .header_search_input, textarea, input[type="text"], input[type="password"], input[type~="text"], input[type~="password"], input[type="email"], input[type="phone"], input[type~="email"], input[type~="phone"], input[type="search"], input[type~="search"], input[type~="date"], select, .crp-entry--message.unread { +form[action="/search"]>input, +.header_search_input, +textarea, +input[type="text"], +input[type="password"], +input[type~="text"], +input[type~="password"], +input[type="email"], +input[type="phone"], +input[type~="email"], +input[type~="phone"], +input[type="search"], +input[type~="search"], +input[type~="date"], +select, +.crp-entry--message.unread { background-color: #181826 !important; } @@ -208,7 +384,8 @@ input[type="radio"] { background-image: url("/themepack/midnight/0.0.2.8/resource/like.gif") !important; } -.pinned-mark, .post-author .pin { +.pinned-mark, +.post-author .pin { background-image: url("/themepack/midnight/0.0.2.8/resource/pin.png") !important; } @@ -260,11 +437,13 @@ input[type="radio"] { background-color: rgb(30, 26, 43) !important; } -.bigPlayer .selectableTrack, .audioEmbed .track > .selectableTrack { +.bigPlayer .selectableTrack, +.audioEmbed .track>.selectableTrack { border-top: #b9b9b9 1px solid !important; } -.bigPlayer .paddingLayer .slider, .audioEmbed .track .slider { +.bigPlayer .paddingLayer .slider, +.audioEmbed .track .slider { background: #b9b9b9 !important; } @@ -323,7 +502,8 @@ input[type="radio"] { filter: invert(81%); } -img[src$='/assets/packages/static/openvk/img/camera_200.png'], img[src$='/assets/packages/static/openvk/img/song.jpg'] { +img[src$='/assets/packages/static/openvk/img/camera_200.png'], +img[src$='/assets/packages/static/openvk/img/song.jpg'] { filter: invert(100%); } @@ -339,7 +519,8 @@ img[src$='/assets/packages/static/openvk/img/camera_200.png'], img[src$='/assets color: unset !important; } -#upload_container, .whiteBox { +#upload_container, +.whiteBox { background: #1d1928 !important; border: 1px solid #383052 !important; } @@ -375,14 +556,16 @@ ul { cursor: pointer; } -.showMore, .showMoreAudiosPlaylist { +.showMore, +.showMoreAudiosPlaylist { background: #181826 !important; } /* Tour */ -.rightNav h1{ +.rightNav h1 { background: #000; } -.tabcontent{ + +.tabcontent { background: #2c2640 !important; -} \ No newline at end of file +}