Skip to content

Commit ff7a5e2

Browse files
kamilszewczyk0kamilszewczyk0
authored
Merge pull request #32 from szymon-rd/arrow-rotation-fix
Fixed expand buttons and listeners
2 parents 326a86a + 52947b4 commit ff7a5e2

File tree

3 files changed

+157
-27
lines changed

3 files changed

+157
-27
lines changed

‎scaladoc/resources/dotty_res/scripts/ux.js

Lines changed: 44 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -78,35 +78,53 @@ function attachAllListeners() {
7878
expanderChild.onclick = function (e) {
7979
if (!$(e.target).is("a") && e.fromSnippet !== true) {
8080
this.parentElement.classList.toggle("expand");
81+
this.children[0].classList.toggle("expanded");
8182
this.querySelector(".show-content").classList.toggle("expand");
8283
}
8384
};
8485
}
8586
}
8687
}
8788

88-
var documentableLists = document.getElementsByClassName("documentableList");
89-
if (documentableLists) {
90-
for (i = 0; i < documentableLists.length; i++) {
91-
documentableLists[i].children[0].onclick = function (e) {
92-
this.classList.toggle("expand");
93-
this.parentElement.classList.toggle("expand");
94-
};
95-
}
96-
}
89+
const documentableLists = document.getElementsByClassName("documentableList");
90+
[...documentableLists].forEach((list) => {
91+
list.children[0].addEventListener("click", () => {
92+
list.classList.toggle("expand");
93+
list.children[0].children[0].classList.toggle("expand");
94+
});
95+
});
9796

9897
var memberLists = document.getElementsByClassName("tab");
9998
if (memberLists) {
10099
for (i = 0; i < memberLists.length; i++) {
101100
if ($(memberLists[i].children[0].children[0]).is("button")) {
102-
memberLists[i].children[0].children[0].onclick = function (e) {
101+
memberLists[i].children[0].onclick = function (e) {
102+
this.classList.toggle("expand");
103+
this.children[0].classList.toggle("expand");
103104
this.parentElement.classList.toggle("expand");
104105
this.parentElement.parentElement.classList.toggle("expand");
105106
};
106107
}
107108
}
108109
}
109110

111+
const documentableBriefs = document.querySelectorAll(".documentableBrief");
112+
[...documentableBriefs].forEach((brief) => {
113+
console.log(
114+
brief.parentElement.parentElement.parentElement.previousElementSibling
115+
.children[0],
116+
);
117+
118+
brief.addEventListener("click", () => {
119+
brief.parentElement.parentElement.parentElement.parentElement.classList.add(
120+
"expand",
121+
);
122+
brief.parentElement.parentElement.parentElement.previousElementSibling.children[0].classList.add(
123+
"expanded",
124+
);
125+
});
126+
});
127+
110128
document.querySelectorAll("a").forEach((el) => {
111129
const href = el.href;
112130
if (href === "") {
@@ -129,22 +147,16 @@ function attachAllListeners() {
129147
e.stopPropagation();
130148
$.get(href, function (data) {
131149
if (window.history.state === null) {
132-
window.history.replaceState(savePageState(document), '')
150+
window.history.replaceState(savePageState(document), "");
133151
}
134-
const parser = new DOMParser()
135-
const parsedDocument = parser.parseFromString(data, "text/html")
136-
const state = savePageState(parsedDocument)
137-
window.history.pushState(state, '', href)
138-
loadPageState(document, state)
139-
window.dispatchEvent(new Event(DYNAMIC_PAGE_LOAD))
140-
})
141-
})
142-
})
143-
144-
$(".ar").on('click', function (e) {
145-
$(this).parent().parent().toggleClass("expanded")
146-
$(this).toggleClass("expanded")
147-
e.stopPropagation()
152+
const parser = new DOMParser();
153+
const parsedDocument = parser.parseFromString(data, "text/html");
154+
const state = savePageState(parsedDocument);
155+
window.history.pushState(state, "", href);
156+
loadPageState(document, state);
157+
window.dispatchEvent(new Event(DYNAMIC_PAGE_LOAD));
158+
});
159+
});
148160
});
149161

150162
$(".ar").on("click", function (e) {
@@ -153,6 +165,13 @@ function attachAllListeners() {
153165
e.stopPropagation();
154166
});
155167

168+
document.querySelectorAll(".documentableList .ar").forEach((arrow) => {
169+
arrow.addEventListener("click", () => {
170+
arrow.parentElement.parentElement.classList.toggle("expand");
171+
arrow.classList.toggle("expand");
172+
});
173+
});
174+
156175
document.querySelectorAll(".nh").forEach((el) =>
157176
el.addEventListener("click", () => {
158177
if (

‎scaladoc/resources/dotty_res/styles/theme/components/button/icon-button.css

Lines changed: 103 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -281,6 +281,8 @@
281281
content: url("../../../../images/icon-buttons/arrow-down/dark/selected.svg");
282282
}
283283

284+
285+
284286
/* mobile menu toggler */
285287

286288
#mobile-menu-toggle.icon-button.menu-shown::after {
@@ -583,7 +585,7 @@
583585

584586
/* show-content button */
585587

586-
/* .icon-button.show-content::after {
588+
.icon-button.show-content::after {
587589
content: url("../../../../images/icon-buttons/plus/light/default.svg");
588590
}
589591

@@ -677,7 +679,7 @@
677679

678680
.theme-dark .icon-button.show-content.expand.selected::after {
679681
content: url("../../../../images/icon-buttons/minus/dark/selected.svg");
680-
} */
682+
}
681683

682684
.icon-button.close:disabled {
683685
opacity: 0.5;
@@ -730,3 +732,102 @@
730732
.theme-dark .icon-button.close.selected::after {
731733
content: url("../../../../images/icon-buttons/close/dark/selected.svg");
732734
}
735+
736+
737+
/* member list expanding arrow */
738+
739+
.documentableElement .ar.icon-button::after {
740+
content: url("../../../../images/icon-buttons/arrow-right/light/default.svg");
741+
}
742+
743+
.documentableElement .ar.icon-button:hover::after {
744+
content: url("../../../../images/icon-buttons/arrow-right/light/hover.svg");
745+
}
746+
747+
.documentableElement .ar.icon-button:active::after {
748+
content: url("../../../../images/icon-buttons/arrow-right/light/active.svg");
749+
}
750+
751+
.documentableElement .ar.icon-button:disabled::after {
752+
content: url("../../../../images/icon-buttons/arrow-right/light/disabled.svg");
753+
}
754+
755+
.documentableElement .ar.icon-button:focus::after {
756+
content: url("../../../../images/icon-buttons/arrow-right/light/focus.svg");
757+
}
758+
759+
.documentableElement .ar.icon-button.selected::after {
760+
content: url("../../../../images/icon-buttons/arrow-right/light/selected.svg");
761+
}
762+
763+
.theme-dark .documentableElement .ar.icon-button::after {
764+
content: url("../../../../images/icon-buttons/arrow-right/dark/default.svg");
765+
}
766+
767+
.theme-dark .documentableElement.ar.icon-button:hover::after {
768+
content: url("../../../../images/icon-buttons/arrow-right/dark/hover.svg");
769+
}
770+
771+
.theme-dark .documentableElement.ar.icon-button:active::after {
772+
content: url("../../../../images/icon-buttons/arrow-right/dark/active.svg");
773+
}
774+
775+
.theme-dark .documentableElement.ar.icon-button:disabled::after {
776+
content: url("../../../../images/icon-buttons/arrow-right/dark/disabled.svg");
777+
}
778+
779+
.theme-dark .documentableElement.ar.icon-button:focus::after {
780+
content: url("../../../../images/icon-buttons/arrow-right/dark/focus.svg");
781+
}
782+
783+
.theme-dark .documentableElement.ar.icon-button.selected::after {
784+
content: url("../../../../images/icon-buttons/arrow-right/dark/selected.svg");
785+
}
786+
787+
.documentableElement .ar.icon-button.expanded::after {
788+
content: url("../../../../images/icon-buttons/arrow-down/light/default.svg");
789+
}
790+
791+
.documentableElement .ar.icon-button.expanded:hover::after {
792+
content: url("../../../../images/icon-buttons/arrow-down/light/hover.svg");
793+
}
794+
795+
.documentableElement .ar.icon-button.expanded:active::after {
796+
content: url("../../../../images/icon-buttons/arrow-down/light/active.svg");
797+
}
798+
799+
.documentableElement .ar.icon-button.expanded:disabled::after {
800+
content: url("../../../../images/icon-buttons/arrow-down/light/disabled.svg");
801+
}
802+
803+
.documentableElement .ar.icon-button.expanded:focus::after {
804+
content: url("../../../../images/icon-buttons/arrow-down/light/focus.svg");
805+
}
806+
807+
.documentableElement .ar.icon-button.expanded.selected::after {
808+
content: url("../../../../images/icon-buttons/arrow-down/light/selected.svg");
809+
}
810+
811+
.theme-dark .documentableElement .ar.icon-button.expanded::after {
812+
content: url("../../../../images/icon-buttons/arrow-down/dark/default.svg");
813+
}
814+
815+
.theme-dark .documentableElement .ar.icon-button.expanded:hover::after {
816+
content: url("../../../../images/icon-buttons/arrow-down/dark/hover.svg");
817+
}
818+
819+
.theme-dark .documentableElement .ar.icon-button.expanded:active::after {
820+
content: url("../../../../images/icon-buttons/arrow-down/dark/active.svg");
821+
}
822+
823+
.theme-dark .documentableElement .ar.icon-button.expanded:disabled::after {
824+
content: url("../../../../images/icon-buttons/arrow-down/dark/disabled.svg");
825+
}
826+
827+
.theme-dark .documentableElement .ar.icon-button.expanded:focus::after {
828+
content: url("../../../../images/icon-buttons/arrow-down/dark/focus.svg");
829+
}
830+
831+
.theme-dark .documentableElement .ar.icon-button.expanded.selected::after {
832+
content: url("../../../../images/icon-buttons/arrow-down/dark/selected.svg");
833+
}

‎scaladoc/resources/dotty_res/styles/theme/layout/header.css

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,3 +99,13 @@
9999
display: none;
100100
}
101101
}
102+
103+
.member-group-header,
104+
.documentableList-expander {
105+
display: flex;
106+
cursor: pointer;
107+
flex-direction: row-reverse;
108+
justify-content: space-between;
109+
align-items: center;
110+
}
111+

0 commit comments

Comments
 (0)