EN: Improvement of the slider for bright pictures. gray background for slider titles
RU: Доработка слайдера для ярких картинок. серый фон для надписей на слайдере
https://ibb.co/pP8pJpJ
EN: without button and date
RU: без кнопки и даты
.owl-carousel .slide-text {
width: 100%;
bottom: 0px;
padding-left: 6px;
padding-right: 6px;
padding-top: 4px;
background-color: rgb(40, 40, 40, 60%);
}
.owl-carousel .slide-text .title {
font-size: 1.1rem;
padding-bottom: 3px;
margin-bottom: 4px;
}https://ibb.co/F68vBhZ
EN: with date and button
RU: с датой и кнопкой
.owl-carousel .slide-text {
width: 100%;
bottom: 0px;
padding-left: 6px;
padding-right: 6px;
padding-top: 4px;
margin-bottom: 15px;
background-color: rgb(40, 40, 40, 60%);
}
.owl-carousel .slide-text .title {
font-size: 1.1rem;
padding-bottom: 15px;
margin-bottom: 4px;
}.single .post-image {
text-align: center;
display: block;
}EN:
align the icon to the center in the post.
if the picture is smaller than the width of the central column, then the center looks better.
RU:
выровнять в посте иконку по центру.
если картинка меньше ширины центральной колонки – то по центру смотрится лучше.
EN: on screens 991px and less, the sidebars have padding only from 1 side.
RU: на экранах 991px и менее у сайдбар остаётся отступ только с 1 бока.
/wp-content/themes/salal/style.css?ver=1.2.9 – 1172
.centered-theme-layout .sidebar .widget {
padding-left: 0;
}EN: correcting:
RU: исправляю:
@media screen and (max-width: 991px) {
.centered-theme-layout .sidebar .widget {
padding-left: 30px; padding-top: 30px;
}
}https://ibb.co/f1Pfyy2
https://ibb.co/1TzDTXG
EN:
on small screens, remove indents from the top and sides of the picture, but leave the bottom and top. Especially if there is no picture, then the top margin should remain.
RU:
на малых экранах убрать отступы сверху и с боков от картинки но оставить снизу и сверху. Особено если картинки нет то отступ сверху должен остаться.
EN: like right now:
RU: как щас:
/wp-content/themes/salal/style.css?ver=1.2.9 – 777
.blog-list-layout .hentry {
margin-bottom: 60px;
padding: 20px;
}/wp-content/themes/salal/style.css?ver=1.2.9 – 792
.blog-list-layout .post-content {
padding: 0 30px;
}/wp-content/themes/salal/style.css?ver=1.2.9 – 953
.blog-list-layout .post-image {
align-items: flex-start;
margin-bottom: 20px;
}EN: correcting:
RU: исправляю:
@media screen and (max-width: 767px) {
.blog-list-layout .hentry {
padding: 0px;
}
.blog-list-layout .post-content {
padding: 30px;
}
.blog-list-layout .post-image {
margin-bottom: 0px;
}
}EN:
List layout
if you put a background image, then the <article> blocks on the main page on narrow screens there are no indents
RU:
вёрстка List
если поставить фоновую картинку – то отказывается у блоков <article> на главной на узких экранах нет отступов
https://ibb.co/3cYqt4L
https://ibb.co/72s5WYV
https://ibb.co/qYn6m8N
https://ibb.co/6m8nnhd
EN:
the footer div.bottom-sidebar has normal width and padding.
/wp-content/themes/salal/style.css?ver=1.2.9 – 3095
# bottom-sidebar {
padding: 30px 30px 10px;
}but 4 .sidebar-column doesn’t take up the full width of the footer – why?
it turns out that 4 columns .sidebar-column have different widths. it is not set strictly at 25%.
RU:
у футера div.bottom-sidebar нормальная ширина и отступы.
/wp-content/themes/salal/style.css?ver=1.2.9 – 3095
#bottom-sidebar {
padding: 30px 30px 10px;
}но 4 .sidebar-column не занимают всю ширину футера – почему?
получается у 4 колонок .sidebar-column разная ширина. она не задана строго 25%.
EN:
If you select “Centered Layout” and the menu on the right, then on the post page, the text has no left indentation.
“Boxed Layout” and “Wide Layout” have normal margins.
If you put a background other than white, then the indent is necessary. on the right, the widgets have it.
so far I’ve fixed it like this:
.sidebar-right .site-content.container {
padding-left: 30px;
}I think that it is necessary to set equal left and right padding
.site-content.container {
padding-left: 30px;
padding-right: 30px;
}and remove the side indent for widgets. because widgets are rearranged from left to right or not at all.
the sidebar should be indented inward – that is, between the columns.
RU:
Если выбрать “Centered Layout” и меню справа – то на странице поста у текста нет отступа слева.
у “Boxed Layout” и “Wide Layout” – отступы нормальные.
Если ставишь фон отличный от белого то отступ необходим. справа у виджетов он есть.
пока что я исправил так:
.sidebar-right .site-content.container {
padding-left: 30px;
}Я считаю что надо задать равный отступ слева и справа
.site-content.container {
padding-left: 30px;
padding-right: 30px;
}а у виджетов отступ боковой убрать. потому что виджеты переставляются слева направо или их нет вовсе.
у sidebar сделать отступ вовнутрь – то есть между колонками.
EN:
the widget has padding-top: 30px; and it turns out the widget visually stands much lower than the first photo on the main or main photo of the post.
remove padding-top from .widget!
padding is set like this:
RU:
у виджета есть padding-top: 30px; и получается виджет визуально стоит намного ниже первой фотки на главной или главной фотки поста.
удалите padding-top у .widget !
padding задан так:
/wp-content/themes/salal/style.css?ver=1.2.9 – 1172
.centered-theme-layout .sidebar .widget {
padding-left: 0;
}/wp-content/themes/salal/style.css?ver=1.2.9 – 1165
.sidebar .widget {
margin-bottom: 30px;
padding: 30px;
}EN:
When creating a new site on an old theme, I prefer to put the color settings in a separate file. in order not to make a child theme, but to include other css in the same theme.
for this, in your theme, it is preferable to create 2 options by analogy with <input type=”radio” “Sidebar Position”:
– “colors scheme” – in a new file /wp-content/themes/salal/inc/customizer/sections/customizer-colors-scheme.php
– “fonts scheme” – in a new file /wp-content/themes/salal/inc/customizer/sections/customizer-fonts-scheme.php
so that it would be convenient for another webmaster to recolor your theme by adding the names of their css files to the new php files.
then, in the wp_enqueue_style() function, request the css from the settings:
wp_enqueue_style( 'colors_scheme', get_theme_file_uri( '/colors_schemes/'. $theme_options['colors_scheme'] .'.css' ) );
wp_enqueue_style( 'fonts_scheme', get_theme_file_uri( '/fonts_schemes/'. $theme_options['fonts_scheme'] .'.css' ) );Naturally, this should be moved to the very beginning of the templates, that is, in header.php:
// Get theme options from database.
$theme_options = salal_theme_options();I looked carefully at your style.css, it turns out that all important colors and fonts have been moved to variables.
: root {}
it’s comfortable. I have not seen this before. apparently browsers did not support this before. if: root {} was not there, I would move each element into a new file, leaving only the colors and their rules.
it turns out that from: root {}, ideally, you need to make 2 css inclusions. pretty simple.
if the setting for colors and fonts is not done, then I can write 2 css into the wp_enqueue_style() function and without variables. ??
the default fonts you have installed may not contain the desired language. For example, on my site in many themes, only words in English are displayed in the title in the required font, since the font does not support Russian letters. so let it be better to type in the fonts individually.
* * *
RU:
При создании нового сайта на старой теме я предпочитаю выносить в отдельный файл настройки цветов. чтобы не делать дочернюю тему, а подключать другой css в той же теме.
для этого в вашей теме предпочительно создать 2 опции по аналогии с <input type=”radio” “Sidebar Position”:
– “наборы цветов” – в новом файле /wp-content/themes/salal/inc/customizer/sections/customizer-colors-scheme.php
– “наборы шрифтов” – в новом файле /wp-content/themes/salal/inc/customizer/sections/customizer-fonts-scheme.php
чтобы другому вебмастеру было удобно перекрашивать вашу тему, добавляя названия своих css файлов в новые php файлы.
затем в функции wp_enqueue_style() запрашивать css из настроек:
wp_enqueue_style( 'colors_scheme', get_theme_file_uri( '/colors_schemes/'. $theme_options['colors_scheme'] .'.css' ) );
wp_enqueue_style( 'fonts_scheme', get_theme_file_uri( '/fonts_schemes/'. $theme_options['fonts_scheme'] .'.css' ) );естественно что это надо перенести в самое начало шаблонов, то есть в header.php:
// Get theme options from database.
$theme_options = salal_theme_options();Я посмотрел внимательно ваш style.css, оказывается у вас вынесены в переменные все важные цвета и шрифты.
:root {}
это удобно. я такого раньше не видел. видимо раньше такого браузеры не поддерживали. если бы :root {} не было, я бы вынес каждый элемент в новый файл, оставил только цвета и их правил бы.
получается что из :root {} в идеале надо сделать 2 css инклюда. довольно просто.
если не будет сделана настройка для цветов и шрифтов, то я могу вписать в функцию wp_enqueue_style() 2 css и без переменных. ??
установленые вами шрифты по молчанию могут не содержать нужного языка. например у меня на сайте во многих темах нужным шрифтом в заголовке отображается только слова на английском, так как шрифт не поддерживает русские буквы. поэтому пусть лучше шрифты вписывают индивидуально.
]]>https://ibb.co/2jQFHzQ
https://ibb.co/w4TmjJB
monitor = 1280x1024px
demo-site – https://zdorov.ozozhe.ru/1173.html
EN:
in old browsers
Opera 36.0.2130.80,
Chromium 39.0.2150.5,
Hrome 42.0.2311.152,
the sidebar becomes not on the side but under the content, and both the sidebar and the content are 100% wide.
why?
browsers don’t understand completely non-standard responsive code.
Firefox 52.9.0 and Maxthon 5.2.3.3000 – understand.
in the firefox inspector the width of the columns div.content-area and aside.sidebar is not displayed as usual. but adaptability works!
for the adaptability of the columns are responsible:
<div id="primary" class="content-area">
and
<aside id="secondary" class="sidebar widget-area clearfix">
perhaps browsers don’t understand the lines:
grid-row-start:
grid-column-start:
order:
(-ms-high-contrast: none), (-ms-high-contrast: active)* * *
RU:
в старых браузерах
Opera 36.0.2130.80,
Сhromium 39.0.2150.5,
Hrome 42.0.2311.152
sidebar становится не сбоку а под контентом, причём и sidebar и контент width 100%.
почему?
браузеры не понимают абсолютно нестандартный код адаптивности.
Firefox 52.9.0 и Maxthon 5.2.3.3000 – понимают.
в инспекторе firefox не отображается как обычно ширина колонок div.content-area и aside.sidebar. но адаптивность работает!
за адаптивность колонок отвечают:
<div id="primary" class="content-area">
и
<aside id="secondary" class="sidebar widget-area clearfix">
возможно браузеры не понимают строки:
grid-row-start:
grid-column-start:
order:
(-ms-high-contrast: none), (-ms-high-contrast: active)https://ibb.co/CP1gxMX
https://ibb.co/rxP6Pjm
if the sidebar is on the right, then the padding is fine,
and if on the left, then the sidebar is pressed to the left edge of the screen. since it is still indented to the right and not to the left.
here is where the error is:
/wp-content/themes/salal/style.css?ver=1.2.9 - 1172
.centered-theme-layout .sidebar .widget {
padding-left: 0;
}correcting:
.centered-theme-layout .sidebar .widget {
padding-right: 0;
}Hello!
This bug is only in Firefox 52.9.0 (32-bit). In Hromium and Maxthon – ok.
If you make the Firefox browser narrower, then when you hover the mouse, a submenu opens itself. although the submenu should open on click.
if you move the mouse away, the submenu items disappear, and the space under them remains.
if you move the mouse to the next menu item, then the menu starts to jerk.
it is impossible to close the submenu by clicking. as well as open.
however, if you use a smartphone emulation in Firefox 52.9.0 (32-bit), then there is no such error. everything works perfectly.
]]>Hello!
slider arrows appear only when you hover the mouse over the slider and only on the screen where there are 2 or 3 elements. it is not obvious that this is a slider. the slider looks like a regular blog post layout.
on a narrow screen (smartphone) there are no arrows even when you hover the mouse.
slider arrows should always be visible!