Редизайн сайту Mezha.Media в дусі старого дизайну.
Після встановлення не забувайте оновлювати стилі в програмі або увімкніть автоматичне оновлення.
Authorukr
LicenseMIT License
Categorymezha.media
Created
Updated
Size11 kB
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Редизайн сайту Mezha.Media в дусі старого дизайну.
Після встановлення не забувайте оновлювати стилі в програмі або увімкніть автоматичне оновлення.
/* ==UserStyle==
@name Mezha.Media 2.0: Redesign
@version v0.5.4
@namespace userstyles.world/user/ukr
@description Редизайн Mezha.Media 2.0
@author ukr
@license MIT License
@preprocessor stylus
@var checkbox HideNewsBlock "Приховати великий блок новин" 1
@var checkbox HideTopDiscussions "Приховати топ обговорень" 1
==/UserStyle== */
@-moz-document domain("mezha.media") {
:root {
--light-blue-color-dark: #303133;
--light-green-color: #fffaf1;
--light-color: #f1f1f1;
--img-border-radius: 10px;
--black-color: #212121;
--light-blue-color: #e3f2fd;
--link-border-color: #00afea;
--medium-green-color: #00afea;
--link-hover-color: #00afea;
--light-link-hover-color: #54c3e9;
--medium-green-color: #54c3e9;
--medium-blue-color: #54c3e9;
}
[data-theme="dark"] {
--link-border-color: #3C71BE;
--medium-green-color: #3C71BE;
--link-hover-color: #3C71BE;
--light-link-hover-color: #3C71BE;
--medium-blue-color: #3C71BE;
}
body {
font-family: Roboto,sans-serif;
font-size: 18px;
color: #212121;
}
.post_social .facebook_icon, .post_social .x_icon, .post_social .telegram_icon, .post_social .link_icon {
width: 36px;
height: 36px;
}
.header_top, .main_page .header_top_wrapper .header_top {
display: none;
}
.post_side_discussions {
background: var(--light-green-color);
}
.section_side_list {
background: #f8e9ec;
}
.post_side_news {
background: #fff;
}
.post_text {
font-weight: 400;
line-height: 1.6;
font-size: 1em;
}
.section_side_list, .article_news, .post_side_news {
border: none;
}
.header_crumbs a:not(.breadcrumbs_item) {
display: none;
}
.header_crumbs .breadcrumbs_item {
margin: 0 auto;
font-weight: 500;
font-size: 14px;
}
.post_author_name, .post_author_name > span {
font-size: 14px;
}
.post_author_name а {
padding-bottom: 5px;
}
.post_author_name {
display: flex;
flex-direction: column;
gap: 4px;
}
.section_news_side, .section_news_adv {
padding: 30px 0px;
max-width: 280px;
}
.section_news_wrapper {
max-width: 1470px;
grid-template-columns: 280px auto 280px;
}
.layout_wrapper, .section_article_wrapper {
max-width: 1470px;
}
.section_article_adv {
margin-top: 30px;
max-width: 280px;
padding: 0;
}
.post_article_body .post_text > :not(.back_top, .fullwidth_element), .post_article_body :is(.post_title, .header_crumbs, .post_author, .post_service, .post_tags, .post_social_wrapper, .post_article .article_label_adv) {
max-width: 680px;
}
.post_article_body {
max-width: 870px;
margin-left: auto;
}
.post_title {
font-size: 2em;
font-weight: 500;
line-height: 1.2;
}
.post_date, .post_comments {
font-size: 14px;
text-transform: inherit;
}
.post_service {
padding: 16px 20px 40px 20px;
}
.post_photo {
padding-bottom: 30px;
}
.post_author_media {
width: 60px;
height: 60px;
flex: 0 0 60px;
margin-right: 10px;
}
.post_news_body .post_text > :not(.back_top, .fullwidth_element), .post_author, .post_service {
max-width: 680px;
margin-left: auto;
margin-right: auto;
}
.side_sm_title {
font-size: 14px;
justify-content: center;
padding: 20px 20px 16px 20px;
}
.article_news .article_title {
line-height: 1.5em;
}
.post_tags, .post_social {
justify-content: center;
}
.post_social_wrapper {
text-align: center;
margin-top: 2rem;
}
.post_tags {
padding: 30px 20px 10px 20px;
gap: 10px;
}
.post_tags a, .post_tags span {
margin-right: 0;
}
.post_social_title {
display: inline-block;
font-size: 9pt;
font-weight: 700;
line-height: 1.2;
margin: 0 0 1em;
text-transform: inherit;
}
.post_social_title::before {
border-top: 1px solid #dcdcde;
content: "";
display: block;
margin-bottom: 1em;
min-width: 30px;
width: 100%;
}
#disqus_thread {
margin-top: 50px;
}
.post_social > a {
border: var(--black-color) 1px solid;
margin-right: 0;
}
.post_social {
gap: 15px;
}
.article_story_list {
border: none;
background: #fff;
border-radius: var(--img-border-radius);
padding: 0;
width: 100%;
}
.article_story_list .article_media {
margin: 0 20px 0 0;
}
.article_story_list .article_title {
font-size: 20px;
line-height: 1.5;
}
.section_articles_list_wrapper .article_story_list:first-child {
padding-top: 0;
}
.article_story_list .article_content {
padding: 10px 20px 10px 0;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 137.65px;
}
.article_story_list .article_media img {
min-height: 137.65px;
object-fit: cover;
}
.article_story_list:has(a[href*="/reviews/"]), .article_story_list:has(a[href*="/video/"]), .article_story_list:has(a[href*="/articles/"]) {
background-color: #e3f2fd;
}
.article_story_list:has(a[href*="/special-project/"]) {
background-color: #f8e9ec;
}
.article_story_list a[href*="/reviews/"], .article_story_list a[href*="/articles/"], .article_story_list_bold .article_title {
font-weight: 700;
}
.article_story_list .article_date .comment_icon .disqus-comment-count, .article_story_list_sm .article_date .comment_icon .disqus-comment-count, .article_story_grid .article_date .comment_icon .disqus-comment-count {
margin-right: 0;
font-weight: 400;
}
.article_story_grid .article_date {
font-size: 14px;
line-height: 1.5em;
text-transform: inherit;
}
.section_title {
padding: 24px 0 13px 0;
}
.article_story_list_sm {
border: none;
}
.article_story_list_sm .article_date, .article_story_grid .article_date {
padding: 15px 0 5px 0;
}
.article_story_list_sm .article_date span:not(.comment_icon) {
margin-right: 10px;
}
.article_story_grid .comment_icon *, .article_story_list .comment_icon *, .article_story_list_sm .comment_icon * {
bottom: -2px;
}
.article_story_list .article_label {
display: none;
}
.layout_n_wrapper {
max-width: 1470px;
}
.section_list_content {
max-width: calc(910px);
padding: 0;
margin-left: auto;
}
.section_side {
max-width: 280px;
}
.section_list_wrapper {
justify-content: center;
}
.article_story_list .article_date, .article_story_list_sm .article_date {
text-transform: inherit;
font-size: 14px;
}
.article_story_list .article_date, .article_story_list_sm .article_date {
display: flex;
flex-wrap: wrap;
}
.article_date .comment_icon {
margin-left: auto;
}
.article_story_list .article_date span:not(.comment_icon) {
margin-right: 10px;
}
.pagination {
display: flex;
justify-content: center;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.footer_social_wrapper [class$="_icon"] {
width: 50px;
height: 50px;
}
.footer_social_wrapper .icon {
border: var(--dark-color) 1px solid;
}
.post_side_discussions .article_news .comment_s_icon {
bottom: -6px;
}
.post_side_discussions .article_news .comment_icon {
font-size: 14px;
}
.search_field {
border-radius: var(--img-border-radius);
}
.top_menu_topic a {
border: var(--dark-color) 1px solid;
}
.main_menu > .special_tag a::before {
background: var(--link-border-color);
}
.section_main_discussions_wide_list .article_story_grid .comment_icon {
font-size: 14px;
}
.section_main_discussions_wide_list .article_story_grid .comment_s_icon {
bottom: -5px;
}
.post_title {
max-width: 100%;
}
.pagination .pagination_item_active a:hover, .pagination_item_active a, .lang_menu_item_active:hover span {
color: var(--white-color);
}
.lang_menu_item_active:hover {
background: var(--light-link-hover-color);
color: var(---light-link-hover-color);
}
.pagination .pagination_item .arr_r_icon:hover, .pagination .pagination_item .arr_l_icon:hover {
fill: var(--light-link-hover-color);
}
.post_contents_close_button .icon_arrow {
top: -7px;
}
.post_contents {
padding: 7px 20px 7px 20px;
}
.post_text :is(.post_contents, .post_rating) ul:not(.hidden) {
padding-top: 15px;
}
.post_contents_title, .post_rating_title {
font-size: 16px;
}
.post_text :is(.post_rating) ul li::before {
top: 11px;
}
.post_text #mainNav ul li::before {
top: 13px;
}
.post_rating_properties_title :is(.pros_icon, .cons_icon) {
margin-right: 10px;
}
.section_article_wrapper #disqus_thread {
max-width: 870px;
margin-left: auto;
}
.table {
background: #ebf9fe;
}
.table td, .table th {
font-size: 16px;
}
.section_topic_b {
margin: 13px 0 0px 0;
}
[data-theme="dark"] :is(.section_topic_b, .section_topic_c, .menu_popup, .search_form_wrapper .search_button, .post_side_discussions, .post_news_body, .post_article_body, .section_article_wide, .section_other_sp_list_wrapper .article_body, .post_side_news) {
background: var(--light-blue-color-dark);
}
[data-theme="dark"] :is(.section_title, .section_title a, .section_list_wrapper .article_title a, .section_list_wrapper .article_date, .footer_info, .footer_copy, .footer_menu a, .pagination, .section_main_discussions_wide .article_story_grid, .section_main_discussions_wide .article_story_grid a, .top_menu a, .top_menu_proj a, .top_menu_topic a, .menu_title, .section_page_title, .main_menu > li a, .side_sm_title, .side_sm_title a, .comment_icon, .section_menu > li a, .section_author_info, .header_crumbs, .header_crumbs a, .article_author_list a, .ui_datepicker_title, .ui_datepicker_calendar td a, .ui_datepicker_calendar td, .post_news_body, .news_grid_wrapper a, .post_author_name a, .post_tags a, .section_title_sm, .section_other_news_wrapper a, .post_article_body, .post_gallery_source, .post_title, .post_photo_source, .button_more, .section_other_sp_list_wrapper .article_title a, .article_story_grid .article_date, .section_other_sp_wrapper .article_title a, .section_search_title, .post_comments){
color: #cccccd;
}
[data-theme="dark"] .disqus-comment-count {
color: #cccccd;
}
[data-theme="dark"] .section_side_list {
background-color: #6b5458;
}
[data-theme="dark"] .article_story_list {
background-color: #30313...