Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Улучшение адаптивной вёрстки #2 #726

Open
wants to merge 13 commits into
base: master
Choose a base branch
from
Open

Улучшение адаптивной вёрстки #2 #726

Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
d107ea9
Правка отступов под некоторые экраны
dimasites Jun 21, 2023
101c948
Убрал неиспользуемые CSS-переменные
dimasites Jun 21, 2023
6ded687
Подготовка к слиянию, форматирование
dimasites Jun 21, 2023
2abd14b
Возврат оригинального форматирования
dimasites Jun 21, 2023
b1149bd
Возвращен сокращенный синтаксис написания дробных значений CSS
dimasites Jun 21, 2023
0cbbb61
Merge branch 'modx-pro:master' into feature/adaptive-styles
dimasites Jun 22, 2023
a802817
Fix размера контейнера в одном из промежуточных разрешений
dimasites Jun 22, 2023
226d6fd
Исправлено положение маркера в связи с предыдущими правками
dimasites Jun 22, 2023
59878c5
fix: Исправлено форматирование
GulomovCreative Jun 22, 2023
1438265
Больше кастомных стилей в поисках совершенства
dimasites Jun 22, 2023
c396745
Merge branch 'feature/adaptive-styles' of https://github.com/dramspro…
dimasites Jun 22, 2023
07ffb72
fix: Убрал максимальную ширину у контента
GulomovCreative Jun 24, 2023
46c05e7
Совмещенное решение с отключенной макс шириной
dimasites Jun 24, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 52 additions & 7 deletions docs/.vitepress/theme/styles/global.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,8 @@
--vp-local-search-result-bg: var(--vp-c-white);
--vp-local-search-result-shadow: 0 1px 3px 0 #d4d9e1;
--vp-local-search-footer-shadow: 0 -1px 0 0 #e0e3e8, 0 -3px 6px 0 rgba(69, 98, 155, .12);

--vp-layout-max-width: 1600px;
}

.dark {
Expand Down Expand Up @@ -74,7 +76,7 @@
.VPDocAsideOutline {
border: var(--vp-border);
border-radius: var(--vp-border-radius);
padding: 20px 20px 20px 0;
padding: 20px;
}

.VPDocAsideOutline .content {
Expand All @@ -84,7 +86,11 @@

.VPDocAsideOutline .outline-marker {
width: 4px;
left: -4px;
left: -24px;
}

.VPDoc .content-container {
max-width: unset !important;
}

.pager .pager-link {
Expand All @@ -96,6 +102,45 @@
display: none;
}

@media (min-width: 960px) {
.content {
padding-left: 0 !important;
padding-right: 0 !important;
}
.VPDoc{
padding-right: 24px !important;
}
}

@media (min-width: 960px) and (max-width: 1599px) {
.VPNavBar,
.VPSidebar,
.VPDoc {
padding-left: 15px !important;
padding-right: 15px !important;
}

.VPSidebar {
width: calc(var(--vp-sidebar-width) - calc(32px - 15px)) !important;
}
}

@media (min-width: 1440px) and (max-width: 1599px) {
.VPDoc.has-aside .content-container {
max-width: 860px !important;
}

.VPContent.has-sidebar{
padding-left: calc((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width) + 3%) !important;
}
}

@media (min-width: 1600px){
.VPDoc.has-aside .content-container {
max-width: 925px !important;
}
}

kbd {
border: 1px solid var(--vp-c-border);
box-shadow: var(--vp-c-mute-darker) 0px 1px 1px 0px, var(--vp-c-neutral-inverse) 0px 1px 0px 0px inset;
Expand Down Expand Up @@ -126,11 +171,11 @@ kbd {
position: relative;
}

.vp-doc ol li {
.vp-doc ol > li {
padding-left: 1.25rem;
}

.vp-doc ol li::before {
.vp-doc ol > li::before {
width: calc(1.5rem - 2px);
height: calc(1.5rem - 2px);
font-size: calc(1rem - 2px);
Expand All @@ -146,7 +191,7 @@ kbd {
background-color: var(--vp-sidebar-bg-color);
}

@media screen and (max-width: 1024px) {
@media (max-width: 1024px) {
.vp-doc table {
border: 0;
}
Expand All @@ -167,12 +212,12 @@ kbd {
}

.vp-doc table tr {
border-bottom: 1px solid var(--vp-c-divider);;
border-bottom: 1px solid var(--vp-c-divider);
display: block;
margin-bottom: 1rem;
}

.vp-doc tr:nth-child(2n) {
.vp-doc table tr:nth-child(2n) {
background-color: inherit;
}

Expand Down