Skip to content

Commit 0e292fb

Browse files
javimedjavimed
authored
Merge pull request #8458 from wazuh/change/99-theme-wider-content-column-3.7
[3.7] Sphinx theme: wider main content column
2 parents d0179fe + f31c174 commit 0e292fb

18 files changed

+140
-67
lines changed

‎source/_themes/wazuh_doc_theme_v3/src/scss/components/_breadcrumbs.scss

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,21 @@
1515
.not-top {
1616
.breadcrumb-wrapper {
1717
position: fixed;
18-
@include media-only(xl, xxl){
19-
max-width: calc(100% - #{$left-sidebar-width-narrow + $right-sidebar-width});
18+
@include media-only(xl,wzh-xl){
19+
max-width: calc(1180px - #{$left-sidebar-width-narrow + $right-sidebar-width-narrow});
2020
}
21-
@include media-min(xxl){
22-
max-width: calc(1600px - #{$left-sidebar-width-narrow + $right-sidebar-width});
21+
@include media-only(wzh-xl,mid-xxl){
22+
max-width: calc(1250px - #{$left-sidebar-width + $right-sidebar-width-narrow});
23+
}
24+
@include media-only(mid-xxl, xxl){
25+
width: calc(100% - #{$left-sidebar-width + $right-sidebar-width-narrow});
26+
max-width: calc(1530px - #{$left-sidebar-width + $right-sidebar-width-narrow});
27+
}
28+
@include media-only(xxl,xxxl){
29+
max-width: calc(1600px - #{$left-sidebar-width + $right-sidebar-width-narrow});
30+
}
31+
@include media-min(xxxl){
32+
max-width: calc(1780px - #{$left-sidebar-width-wide + $right-sidebar-width-narrow});
2333
}
2434
}
2535
}

‎source/_themes/wazuh_doc_theme_v3/src/scss/components/_local-toc.scss

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,13 @@
1313

1414
.toc-title {
1515
display: inline-block;
16-
height: 45px;
17-
font-size: 22px;
16+
height: 25px;
17+
font-size: 14px;
18+
line-height: 32px;
1819
font-weight: 600;
19-
text-transform: uppercase;
20+
color: #d9d9d9;
21+
letter-spacing: -0.14px;
22+
margin-bottom: 12px;
2023
}
2124

2225
> ul {
@@ -38,10 +41,9 @@
3841
a {
3942
display: block;
4043
position: relative;
41-
padding-top: 6px;
42-
padding-bottom: 6px;
43-
font-size: 14px;
44-
line-height: 24px;
44+
padding: 6px 15px;
45+
font-size: 11px;
46+
line-height: 18px;
4547
border-radius: 0 15px 15px 0;
4648
&:before {
4749
content: "";
@@ -82,9 +84,6 @@
8284
background-color: $light-color-base-space;
8385
margin-bottom: 4px;
8486
}
85-
.toc-title {
86-
color: $light-color-main-text;
87-
}
8887
ul {
8988
a {
9089
&:hover,
@@ -113,9 +112,6 @@
113112
.navbar-nav {
114113
background-color: $dark-color-base-space;
115114
}
116-
.toc-title {
117-
color: $dark-color-main-text;
118-
}
119115
ul {
120116
a {
121117
&:hover,

‎source/_themes/wazuh_doc_theme_v3/src/scss/components/_version-notice.scss

Lines changed: 27 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,8 @@
1515
@include media-max(xl) {
1616
padding-left: 15px;
1717
}
18-
@include media-only(xl, xxl) {
19-
width: 100%;
20-
}
21-
@include media-min(xxl) {
22-
width: calc(#{$outer-container-xxl} - #{$left-sidebar-width-narrow} - #{$right-sidebar-width});
18+
@include media-min(xl) {
19+
width: calc(100% - 2px);
2320
}
2421

2522
.no-latest-notice {
@@ -56,18 +53,38 @@
5653
.not-top {
5754
.no-latest-notice-wrapper {
5855
position: fixed;
59-
@include media-only(xl, xxl) {
60-
right: $right-sidebar-width;
61-
left: $left-sidebar-width-narrow;
62-
width: calc(100% - #{$right-sidebar-width} - #{$left-sidebar-width-narrow});
56+
@include media-min(xl) {
57+
right: $right-sidebar-width-narrow;
58+
margin-left: auto;
59+
margin-right: auto;
60+
}
61+
@include media-only(xl, wzh-xl) {
62+
left: $left-sidebar-width-narrow - 2px;
63+
width: calc(1180px - #{$right-sidebar-width-narrow} - #{$left-sidebar-width-narrow} - 2px);
64+
}
65+
@include media-only(wzh-xl,mid-xxl) {
66+
left: $left-sidebar-width - 2px;
67+
width: calc(1250px - #{$right-sidebar-width-narrow} - #{$left-sidebar-width} - 2px);
68+
}
69+
@include media-only(mid-xxl, xxl) {
70+
left: $left-sidebar-width - 2px;
71+
width: calc(100% - #{$right-sidebar-width-narrow} - #{$left-sidebar-width} - 2px);
72+
max-width: calc(1530px - #{$right-sidebar-width-narrow} - #{$left-sidebar-width} - 2px);
73+
}
74+
@include media-only(xxl, xxxl) {
75+
left: $left-sidebar-width - 2px;
76+
width: calc(1600px - #{$right-sidebar-width-narrow} - #{$left-sidebar-width} - 2px);
77+
}
78+
@include media-min(xxxl) {
79+
left: 1780px - 1220px - $right-sidebar-width-narrow - 2px;
80+
width: calc(1780px - #{$right-sidebar-width-narrow} - #{1780px - 1220px - $right-sidebar-width-narrow} - 2px);
6381
}
6482
}
6583
}
6684

6785
.no-latest-docs {
6886
&.document {
6987
#central-column {
70-
// padding-top: calc(#{$breadcrumbs-height-xl} + #{$no-latest-notice-height-xl} + 20px);
7188
* {
7289
scroll-margin-top: calc(#{$header-height-xl} + #{$breadcrumbs-height-xl} + #{$no-latest-notice-height-xl} + 20px);
7390
}
@@ -95,7 +112,6 @@
95112
}
96113
#central-column {
97114
padding-top: calc(#{$breadcrumbs-height-xl} + #{$no-latest-notice-height-xl} + 20px);
98-
// padding-top: #{$breadcrumbs-height-xl} + #{$no-latest-notice-height-xl};
99115
}
100116
}
101117
}
@@ -116,12 +132,6 @@
116132
}
117133
}
118134
}
119-
#central-column {
120-
// padding-top: $no-latest-notice-height-xl;
121-
// @include media-max(sm){
122-
// padding-top: calc(#{$no-latest-notice-height-xl} + 40px);
123-
// }
124-
}
125135
}
126136
}
127137

‎source/_themes/wazuh_doc_theme_v3/src/scss/inc/_content.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,19 @@
3838
@include media-max (xl) {
3939
padding-top: 75px;
4040
}
41+
@include media-min (xl) {
42+
position: relative;
43+
&::after {
44+
content: "";
45+
position: absolute;
46+
width: 2px;
47+
border-radius: 0px 0px 15px 15px;
48+
background-color: rgba(227, 227, 227, .5);
49+
top: 0;
50+
right: 0;
51+
bottom: 95px;
52+
}
53+
}
4154
}
4255
}
4356

‎source/_themes/wazuh_doc_theme_v3/src/scss/inc/_root.scss

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,26 @@ body {
3535
display: flex;
3636
flex-direction: row;
3737
}
38+
@include media-only (xl,wzh-xl) {
39+
max-width: 1180px;
40+
margin-left: auto;
41+
margin-right: auto;
42+
}
43+
@include media-only (wzh-xl,mid-xxl) {
44+
max-width: 1250px;
45+
margin-left: auto;
46+
margin-right: auto;
47+
}
48+
@include media-only (mid-xxl,xxl) {
49+
max-width: 1530px;
50+
margin-left: auto;
51+
margin-right: auto;
52+
}
53+
@include media-min (xxxl) {
54+
max-width: 1780px;
55+
margin-left: auto;
56+
margin-right: auto;
57+
}
3858
}
3959

4060
h1,

‎source/_themes/wazuh_doc_theme_v3/src/scss/inc/_variables.scss

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@ $breakpoints: (
1010
lg: 992px,
1111
xl: 1200px,
1212
wzh-xl: 1300px,
13+
mid-xxl: 1400px,
1314
xxl: 1600px,
15+
xxxl: 1780px,
1416
) !default;
1517

1618
/* -- Color variables ------------------------------------------------------------------------------------ */
@@ -123,10 +125,11 @@ $header-height-xl: 80px !default;
123125
$breadcrumbs-height-xs: 70px !default;
124126
$breadcrumbs-height-xl: 80px !default;
125127
$footer-height: 70px !default;
126-
$left-sidebar-width: 385px !default;
127-
$left-sidebar-width-narrow: 320px !default;
128+
$left-sidebar-width-wide: 370px !default;
129+
$left-sidebar-width: 320px !default;
130+
$left-sidebar-width-narrow: 275px !default;
128131
$right-sidebar-width: 290px !default;
129-
$right-sidebar-width-narrow: 240px !default;
132+
$right-sidebar-width-narrow: 190px !default;
130133
$left-redoc-sidebar-width: 294px !default;
131134
$right-redoc-sidebar-width: 40% !default;
132135
$redoc-header-height: 110px !default;

‎source/_themes/wazuh_doc_theme_v3/src/scss/pages/api-reference.scss

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,9 @@ body {
9696

9797
.inner-body {
9898
display: block;
99+
@include media-min (xl) {
100+
max-width: 100%;
101+
}
99102
}
100103

101104

@@ -131,17 +134,15 @@ header {
131134
width: 100%;
132135
height: $redoc-header-height;
133136
}
134-
@include media-min (xxl) {
135-
max-width: calc(#{($outer-container-xxl - $left-redoc-sidebar-width)* 0.6} + #{$left-redoc-sidebar-width - .6});
136-
margin-left: auto;
137-
margin-right: auto;
138-
}
139137
#version-selector {
140138
.dropdown-btn {
141139
@media screen and (min-width: 50.01rem) and (max-width: 75rem) {
142140
padding: 5px 10px;
143141
border: 2px solid;
144142
}
143+
@include media-only (lg, xl) {
144+
width: 263px;
145+
}
145146
}
146147
.dropdown-menu {
147148
@media screen and (min-width: 50.01rem) and (max-width: 75rem) {

‎source/_themes/wazuh_doc_theme_v3/src/scss/pages/index.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -187,6 +187,12 @@ header {
187187
}
188188
}
189189

190+
.inner-body {
191+
@include media-min (xxxl) {
192+
max-width: 1600px;
193+
}
194+
}
195+
190196
.sidebar .sidebar-container {
191197
position: relative;
192198
top: 135px;

‎source/_themes/wazuh_doc_theme_v3/src/scss/parts/_central-column.scss

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,14 @@
3939
#central-column {
4040
width: 100%;
4141
position: relative;
42-
@include media-min(xl){
43-
max-width: calc(100% - #{$left-sidebar-width-narrow + $right-sidebar-width});
42+
@include media-only(xl,wzh-xl){
43+
max-width: calc(100% - #{$left-sidebar-width-narrow + $right-sidebar-width-narrow});
44+
}
45+
@include media-only(wzh-xl,xxxl){
46+
max-width: calc(100% - #{$left-sidebar-width + $right-sidebar-width-narrow});
47+
}
48+
@include media-min(xxxl){
49+
max-width: calc(100% - #{$left-sidebar-width-wide + $right-sidebar-width-narrow});
4450
}
4551
}
4652

‎source/_themes/wazuh_doc_theme_v3/src/scss/parts/_footer.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,6 @@ footer {
7676
svg {
7777
fill: white;
7878
transform: rotate(180deg) scale(0.7, 0.6);
79-
// stroke-width: 1px;
8079
}
8180
}
8281
.website-links {

‎source/_themes/wazuh_doc_theme_v3/src/scss/parts/_left-sidebar.scss

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,17 @@
2222
display: block;
2323
}
2424

25-
@include media-min(xl) {
25+
@include media-only(xl, wzh-xl) {
2626
flex-basis: $left-sidebar-width-narrow;
2727
width: $left-sidebar-width-narrow;
2828
}
29+
@include media-min(wzh-xl) {
30+
flex-basis: $left-sidebar-width;
31+
width: $left-sidebar-width;
32+
}
33+
@include media-min(xxl) {
34+
margin-left: auto;
35+
}
2936

3037
.sidebar-container {
3138
@include media-max(xl) {
@@ -44,9 +51,12 @@
4451
height: calc(100vh - #{$header-height-xl});
4552
padding: 30px 0;
4653
}
47-
@include media-min(xl) {
54+
@include media-only(xl, wzh-xl) {
4855
width: $left-sidebar-width-narrow;
4956
}
57+
@include media-min(wzh-xl) {
58+
width: $left-sidebar-width;
59+
}
5060

5161
& > nav {
5262
padding-top: 10px;

0 commit comments

Comments
 (0)