Skip to content

Commit 9d4fa0d

Browse files
ProcStackProcStack
committed
Page Spacing & FireFox
_Firefox doesn't like mixing justify-self as a child of a Grid css object, so Justify-self only works on display:grid objects, this seems wrong.... But firefox is the new Internet Explorer of CSS + JS _AboutMe and Init didn't have any width with the page content
1 parent 3bb224f commit 9d4fa0d

File tree

13 files changed

+60
-107
lines changed

13 files changed

+60
-107
lines changed

‎docs/js/pxlRooms/CampfireEnvironment/CampfireEnvironment.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -277,6 +277,11 @@ export class CampfireEnvironment extends RoomEnvironment{
277277
//emberSettings["offsetPos"] = particleSourcePos;
278278
//emberSettings["wanderInf"] = wanderInfluence;
279279
//emberSettings["wanderFrequency"] = wanderFrequency;
280+
281+
emberSettings["EmberSpread"] = 9.0;
282+
emberSettings["EmberFadeDistance"] = 0.04;
283+
emberSettings["ShiftFromZero"] = 0.5;
284+
emberSettings["MultPosXZ"] = 1.120;
280285

281286
//
282287
let emberAtlasPicks=eWisps.elementDuplicator([ [0.0,0.75], [0.0,0.5], [0.25,0.75], [0.25,0.5] ],4);

‎docs/pages/aboutMe.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const pageContentObject = {
2525
'subHeader' : '',
2626
'pageStyles' : {
2727
'block' : ['procPagesContentStyle', 'gitAboutMePageStyle'],
28-
'before' : [ 'procPagesInnerBefore' ],
28+
'before' : [ 'procPagesInnerBeforeBase', 'procPagesInnerBefore' ],
2929
'parent' : [ 'procPagesParentStyle', 'gitAboutMePageParentStyle', 'procPagesLockVertical' ],
3030
'header' : [ 'procPagesHeaderStyle' ],
3131
'subHeader' : [],
@@ -40,7 +40,7 @@ const pageContentObject = {
4040
'sectionCaption' : [ 'gitAboutMePage-sectionCaptionStyle' ],
4141
'content' : [ 'procPagesScrollbarStyle' ],
4242
'media' : [ 'procPagesScrollbarStyle' ],
43-
'after' : [ 'procPagesInnerAfter' ]
43+
'after' : [ 'procPagesInnerAfterBase', 'procPagesInnerAfter' ]
4444
},
4545
'styleOverrides' : {
4646
'procPagesNavBlock' : 'procPagesNav_aboutMeStyle',

‎docs/pages/blog.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const pageContentObject = {
1919
'subHeader' : '',
2020
'pageStyles' : {
2121
'block' : ['procPagesContentStyle', 'gitBlogPageStyle'],
22-
'before' : [ 'procPagesInnerBefore' ],
22+
'before' : [ 'procPagesInnerBeforeBase', 'procPagesInnerBefore' ],
2323
'parent' : [ 'procPagesParentStyle', 'gitBlogPageParentStyle', 'procPagesLayoutTripleStyle' ],
2424
'header' : [ 'procPagesHeaderStyle' ],
2525
'headerLine' : [ 'gitBlogPage-headerLine' ],
@@ -35,7 +35,7 @@ const pageContentObject = {
3535
'sectionCaption' : [ 'gitBlogPage-sectionCaptionStyle' ],
3636
'content' : [ 'gitBlogPageScrollbarStyle' ],
3737
'media' : [ 'gitBlogPageScrollbarStyle' ],
38-
'after' : [ 'procPagesInnerAfter' ]
38+
'after' : [ 'procPagesInnerAfterBase', 'procPagesInnerAfter' ]
3939
},
4040
'styleOverrides' : {
4141
'procPagesNavBlock' : 'procPagesNav_blogStyle',

‎docs/pages/makingOf.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const pageContentObject = {
1919
'subHeader' : '',
2020
'pageStyles' : {
2121
'block' : [ 'procPagesContentStyle', 'gitReposPageStyle' ],
22-
'before' : [ 'procPagesInnerBefore' ],
22+
'before' : [ 'procPagesInnerBeforeBase', 'procPagesInnerBefore' ],
2323
'parent' : [ 'procPagesParentStyle', 'gitReposPageParentStyle', 'procPagesLayoutTripleStyle' ],
2424
'header' : [ 'procPagesHeaderStyle' ],
2525
'headerLine' : [ 'gitReposPage-headerLine' ],
@@ -35,7 +35,7 @@ const pageContentObject = {
3535
'sectionCaption' : [ 'gitReposPage-sectionCaptionStyle' ],
3636
'content' : [ 'gitReposPageScrollbarStyle' ],
3737
'media' : [ 'gitReposPageScrollbarStyle' ],
38-
'after' : [ 'procPagesInnerAfter' ]
38+
'after' : [ 'procPagesInnerAfterBase', 'procPagesInnerAfter' ]
3939
},
4040
'styleOverrides' : {
4141
'procPagesNavBlock' : 'procPagesNav_reposStyle',

‎docs/pages/projects.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const pageContentObject = {
3939
`,
4040
'pageStyles' : {
4141
'block' : ['procPagesContentStyle', 'gitProjectsPageStyle'],
42-
'before' : [ 'procPagesInnerBefore' ],
42+
'before' : [ 'procPagesInnerBeforeBase', 'procPagesInnerBefore' ],
4343
'parent' : [ 'procPagesParentStyle', 'gitProjectsPageParentStyle', 'procPagesLayoutTripleStyle' ],
4444
'header' : [ 'procPagesHeaderStyle' ],
4545
'headerLine' : [ 'gitProjectsPage-headerLine' ],
@@ -56,7 +56,7 @@ const pageContentObject = {
5656
'sectionCaption' : [ 'gitProjectsPage-sectionCaptionStyle' ],
5757
'content' : [ 'gitProjectsPageScrollbarStyle' ],
5858
'media' : [ 'gitProjectsPageScrollbarStyle' ],
59-
'after' : [ 'procPagesInnerAfter' ]
59+
'after' : [ 'procPagesInnerAfterBase', 'procPagesInnerAfter' ]
6060
},
6161
'styleOverrides' : {
6262
'procPagesNavBlock' : 'procPagesNav_projectsStyle',

‎docs/pages/pxlNav.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const pageContentObject = {
2525
'subHeader' : `<span>A javascript player controller & environment manager<span class='procPagesHideWhenThin'>&nbsp;for Three.js</span></span>`,
2626
'pageStyles' : {
2727
'block' : ['procPagesContentStyle', 'gitPxlNavPageStyle'],
28-
'before' : [ 'procPagesInnerBefore' ],
28+
'before' : [ 'procPagesInnerBeforeBase', 'procPagesInnerBefore' ],
2929
'parent' : [ 'procPagesParentStyle', 'gitPxlNavPageParentStyle', 'gitPxlNavPageScrollbarStyle', 'procPagesLayoutTripleStyle' ],
3030
'header' : [ 'procPagesHeaderStyle' ],
3131
'headerLine' : [ 'gitPxlNav-headerLine' ],
@@ -42,7 +42,7 @@ const pageContentObject = {
4242
'sectionCaption' : [ 'gitPxlNav-sectionCaptionStyle' ],
4343
'content' : [ 'gitPxlNavPageScrollbarStyle' ],
4444
'media' : [ 'gitPxlNavPageScrollbarStyle' ],
45-
'after' : [ 'procPagesInnerAfter' ]
45+
'after' : [ 'procPagesInnerAfterBase', 'procPagesInnerAfter' ]
4646
},
4747
'styleOverrides' : {
4848
'procPagesNavBlock' : 'procPagesNav_pxlNavStyle',

‎docs/style/procPages/procPages_aboutMeStyle.css‎

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
z-index: 6;
88
overflow: hidden;
99
position: fixed;
10-
left: max(0px, calc(min(15vw, max(0px, 100vw - 1250px) / 4.5)));
10+
left: max( 1vmax, calc(min(15vw, max(0px, 100vw - 1250px) / 4.5)) );
1111
bottom: 2.5vmin;
1212
}
1313

@@ -64,7 +64,7 @@
6464

6565

6666
.gitAboutMePageParentStyle{
67-
width: min(100vw, 1100px);
67+
width: min( calc(100vw - 2vmax), 1100px);
6868
height: calc(90vh - 40px);
6969
display: grid;
7070
grid-auto-flow: row;
@@ -81,27 +81,11 @@
8181
}
8282

8383
.gitAboutMePageStyle .procPagesInnerBefore {
84-
content : '';
85-
border-radius: var(--inner-before-after-radiusBefore);
86-
background: transparent;
87-
border-width: 0px 2px 2px 2px;
8884
border-color: #5d5d5d;
89-
border-style: solid;
90-
height: var(--inner-before-after-height);
91-
width: 99.8%;
92-
margin-bottom: var(--inner-before-after-margin);
9385
}
9486

9587
.gitAboutMePageStyle .procPagesInnerAfter {
96-
content : '';
97-
border-radius: var(--inner-before-after-radiusAfter);
98-
background: transparent;
99-
border-width: 2px 2px 0px 2px;
10088
border-color: #5d5d5d;
101-
border-style: solid;
102-
height: var(--inner-before-after-height);
103-
width: 99.8%;
104-
margin-top: var(--inner-before-after-margin);
10589
}
10690

10791
/* -- -- -- */

‎docs/style/procPages/procPages_blogStyle.css‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -103,27 +103,11 @@
103103
}
104104

105105
.gitBlogPageStyle .procPagesInnerBefore {
106-
content : '';
107-
border-radius: var(--inner-before-after-radiusBefore);
108-
background: transparent;
109-
border-width: 0px 2px 2px 2px;
110106
border-color: #2b0967;
111-
border-style: solid;
112-
height: var(--inner-before-after-height);
113-
width: 99.8%;
114-
margin-bottom: var(--inner-before-after-margin);
115107
}
116108

117109
.gitBlogPageStyle .procPagesInnerAfter {
118-
content : '';
119-
border-radius: var(--inner-before-after-radiusAfter);
120-
background: transparent;
121-
border-width: 2px 2px 0px 2px;
122110
border-color: #2b0967;
123-
border-style: solid;
124-
height: var(--inner-before-after-height);
125-
width: 99.8%;
126-
margin-top: var(--inner-before-after-margin);
127111
}
128112

129113
/* -- -- -- */

‎docs/style/procPages/procPages_initStyle.css‎

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,11 @@
1414

1515
@media screen and (max-width: 500px) {
1616
.gitInitPageStyle{
17-
left: 0px;
18-
width: 100vw;
17+
left: 1vmax;
18+
width: calc(100vw - 2vmax);
1919
max-width: 100vw;
20+
justify-self: center;
21+
pointer-events: fill;
2022
}
2123
}
2224

@@ -42,16 +44,7 @@
4244
}
4345

4446
.gitInitPageStyle .procPagesInnerBefore {
45-
content : '';
46-
padding-left: 8px;
47-
border-radius: var(--inner-before-after-radiusBefore);
48-
background: transparent;
49-
border-width: 0px 2px 2px 2px;
5047
border-color: #483107;
51-
border-style: solid;
52-
height: var(--inner-before-after-height);
53-
width: 99.8%;
54-
margin-bottom: var(--inner-before-after-margin);
5548
}
5649

5750
.gitInitPageStyle .procPagesInnerAfter {

‎docs/style/procPages/procPages_mainStyle.css‎

Lines changed: 39 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
--procPage-width: calc( 100vw - 6vmax );
1212
--procPage-mobile-width: calc( 100vw - 2vmax );
1313
--layout-toggle: 1000px;
14+
--max-inner-width: min(calc(100vw - 2.5vmax), 99.8%);
1415
}
1516

1617
/* -- -- -- -- -- -- -- -- -- -- -- -- */
@@ -115,10 +116,36 @@ BODY {
115116
grid-auto-flow: column;
116117
pointer-events: none;
117118
}
119+
118120
.gpnhScreenMedia{
119121
left: calc(max(3.5vw, 50vw - 765px));
120122
}
121123

124+
125+
.procPagesInnerBeforeBase {
126+
content : '';
127+
border-radius: var(--inner-before-after-radiusBefore);
128+
background: transparent;
129+
border-width: 0px 2px 2px 2px;
130+
border-color: #5d5d5d;
131+
border-style: solid;
132+
height: var(--inner-before-after-height);
133+
width: var(--max-inner-width);
134+
margin-bottom: var(--inner-before-after-margin);
135+
}
136+
137+
.procPagesInnerAfterBase {
138+
content : '';
139+
border-radius: var(--inner-before-after-radiusAfter);
140+
background: transparent;
141+
border-width: 2px 2px 0px 2px;
142+
border-color: #5d5d5d;
143+
border-style: solid;
144+
height: var(--inner-before-after-height);
145+
width: var(--max-inner-width);
146+
margin-top: var(--inner-before-after-margin);
147+
}
148+
122149
@media (max-width: 400px){
123150
.gpnhScreenMedia{
124151
left: 50%;
@@ -139,6 +166,14 @@ left: calc(max(3.5vw, 50vw - 765px));
139166
.procPagesShowWhenThin{
140167
display: inherit;
141168
}
169+
170+
.procPagesInnerBeforeBase {
171+
border-width: 0px 1px 1px 1px;
172+
}
173+
174+
.procPagesInnerAfterBase {
175+
border-width: 1px 1px 0px 1px;
176+
}
142177
}
143178

144179
@media screen and ((max-width: 1000px) or (min-aspect-ratio: 1)) {
@@ -152,12 +187,13 @@ left: calc(max(3.5vw, 50vw - 765px));
152187
.procPagesNavStyle {
153188
width: 100vw;
154189
max-width: 950px;
155-
display: flex;
156-
flex-wrap: wrap;
190+
display: grid;
157191
justify-content: space-around;
158-
justify-self: center;
159192
position: relative;
160193
z-index: 200;
194+
grid-auto-flow: column;
195+
margin-left: auto;
196+
margin-right: auto;
161197
}
162198

163199

0 commit comments

Comments
 (0)