|
|
| Line 3: |
Line 3: |
|
| |
|
| /* collapsible sidebar */ | | /* collapsible sidebar */ |
| /* General style for collapsible elements */
| |
| .collapsible {
| |
| border: 1px solid #a2a9b1; /* Light grey border, change as needed */
| |
| margin-bottom: 10px;
| |
| border-radius: 4px; /* Optional: for rounded corners */
| |
| }
| |
|
| |
| /* Style for the content that gets hidden/shown */
| |
| .collapsible .collapsible-content {
| |
| padding: 5px;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| /* Style for collapsed state (hidden content) */
| |
| .collapsible.collapsed .collapsible-content {
| |
| display: none;
| |
| }
| |
|
| |
| /* Style for the toggle button */
| |
| .collapsetoggle {
| |
| cursor: pointer;
| |
| color: #0645ad; /* Wikipedia link color, change as needed */
| |
| float: right; /* Position the toggle to the right */
| |
| padding: 2px 5px; /* Spacing around the toggle text */
| |
| user-select: none; /* Prevent text selection */
| |
| }
| |
|
| |
| /* Optional: change toggle button color on hover */
| |
| .collapsetoggle:hover {
| |
| text-decoration: underline; /* Suggest interactivity on hover */
| |
| }
| |
|
| |
| /* Clear float for the toggle */
| |
| .collapsible:after {
| |
| content: "";
| |
| display: table;
| |
| clear: both;
| |
| }
| |
|
| |
| /* Optional: style for the collapsible header which isn't a table header */
| |
| .collapsible > :first-child:not(thead):not(tr) {
| |
| background-color: #f8f9fa; /* Light grey background, change as needed */
| |
| padding: 5px;
| |
| font-weight: bold;
| |
| border-bottom: 1px solid #a2a9b1; /* Light grey border, change as needed */
| |
| }
| |
|
| |
| /* Optional: style for the collapsible table header */
| |
| .collapsible table tr th {
| |
| background-color: #f8f9fa; /* Light grey background, change as needed */
| |
| }
| |
|
| |
| /* Optional: hide border top when collapsed */
| |
| .collapsible.collapsed > :first-child:not(thead):not(tr) {
| |
| border-bottom: none;
| |
| }
| |
|
| |
| /* Adjustments for inline toggle button */
| |
| .collapsetoggle-inline {
| |
| float: none;
| |
| display: inline;
| |
| margin-left: 10px;
| |
| }
| |