Remove jquery-ui accordions

This commit is contained in:
2025-06-02 19:32:03 +02:00
parent ad91c8ed4f
commit c10b488080
8 changed files with 269 additions and 247 deletions

View File

@ -17,6 +17,7 @@ $large-devices: 992px;
margin-bottom: 0;
margin-top: 0;
}
&.star-checked {
color: $pedagogy-orange;
margin-bottom: 0;
@ -32,6 +33,7 @@ $large-devices: 992px;
margin-left: 5px;
margin-right: 5px;
}
&.star-checked {
margin-left: 5px;
margin-right: 5px;
@ -42,6 +44,7 @@ $large-devices: 992px;
&.grade-without-star {
display: block;
}
&.grade-with-star {
display: none;
}
@ -51,10 +54,12 @@ $large-devices: 992px;
font-size: 1.1em;
overflow-wrap: break-word;
.closed td.title {
color: lighten($black-color, 10%);
font-style: italic;
}
td {
text-align: center;
border: none;
@ -131,10 +136,12 @@ $large-devices: 992px;
input[type="checkbox"] {
display: none;
}
.radio-guide {
margin-top: 10px;
color: white;
}
.radio-guide label {
display: inline-block;
background-color: $pedagogy-blue;
@ -143,12 +150,15 @@ $large-devices: 992px;
font-size: 16px;
border-radius: 4px;
}
.radio-guide input[type="radio"]:checked + label {
.radio-guide input[type="radio"]:checked+label {
background-color: $pedagogy-orange;
}
.radio-guide input[type="checkbox"]:checked + label {
.radio-guide input[type="checkbox"]:checked+label {
background-color: $pedagogy-orange;
}
.radio-guide label:hover {
background-color: $pedagogy-hover-blue;
}
@ -219,12 +229,7 @@ $large-devices: 992px;
"stars"
"comment";
}
}
.ui-accordion-content {
background-color: $white-color;
border-color: $pedagogy-orange;
border-right: none;
}
.form-stars {
@ -235,16 +240,6 @@ $large-devices: 992px;
grid-area: comment;
}
.ui-accordion-header {
background-color: $pedagogy-orange;
color: $pedagogy-white-text;
clip-path: polygon(0 0%, 0 100%, 30% 100%, 33% 0);
@media screen and (max-width: $large-devices) {
clip-path: none;
}
}
.ui-accordion-header-icon {
color: $pedagogy-white-text;
margin-right: 10px;
@ -282,7 +277,7 @@ $large-devices: 992px;
background-color: $pedagogy-blue;
padding-right: 10px;
> p {
>p {
text-align: right;
font-weight: bold;
}
@ -356,7 +351,7 @@ $large-devices: 992px;
.grade-type {
grid-area: grade-type;
> p {
>p {
color: $pedagogy-white-text;
font-weight: bold;
text-align: right;
@ -512,3 +507,20 @@ $large-devices: 992px;
}
}
}
details.accordion summary {
background: $pedagogy-orange !important;
color: $pedagogy-white-text !important;
clip-path: polygon(0 0%, 0 100%, 30% 100%, 33% 0);
@media screen and (max-width: $large-devices) {
clip-path: none;
}
}
details.accordion>.accordion-content {
background-color: $white-color;
border-color: $pedagogy-orange;
border-right: none;
}

View File

@ -90,9 +90,9 @@
<p>{% trans %}You already posted a comment on this UV. If you want to comment again, please modify or delete your previous comment.{% endtrans %}</p>
</div>
{% elif user.has_perm("pedagogy.add_uvcomment") %}
<div id="leave_comment">
<h2>{% trans %}Leave comment{% endtrans %}</h2>
<div>
<details class="accordion" id="leave_comment">
<summary>{% trans %}Leave comment{% endtrans %}</summary>
<div class="accordion-content">
<form action="{{ url('pedagogy:uv_detail', uv_id=object.id) }}" method="post" enctype="multipart/form-data">
{% csrf_token %}
<div class="leave-comment-grid-container">
@ -142,7 +142,7 @@
<p><input type="submit" value="{% trans %}Comment{% endtrans %}" /></p>
</form>
</div>
</div>
</details>
{% endif %}
<br>
@ -221,21 +221,5 @@
<script type="text/javascript">
$("#return_noscript").hide();
$("#return_js").show();
const icons = {
header: "fa fa-toggle-right",
activeHeader: "fa fa-toggle-down"
};
$(function(){
$("#leave_comment").accordion({
icons: icons,
heightStyle: "content",
active: false,
collapsible: true
});
});
// Remove jquery-ui icons to make fontawesome work
$(document).ready(function(){
$(".ui-accordion-header-icon").first().removeClass("ui-icon");
});
</script>
{% endblock %}