Files
documentation/node_modules/@docusaurus/theme-common/lib/components/Details/styles.module.css
2024-03-22 03:47:51 +05:30

67 lines
1.7 KiB
CSS

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/*
CSS variables, meant to be overridden by final theme
*/
.details {
--docusaurus-details-summary-arrow-size: 0.38rem;
--docusaurus-details-transition: transform 200ms ease;
--docusaurus-details-decoration-color: grey;
}
.details > summary {
position: relative;
cursor: pointer;
list-style: none;
padding-left: 1rem;
}
/* TODO: deprecation, need to remove this after Safari will support `::marker` */
.details > summary::-webkit-details-marker {
display: none;
}
.details > summary::before {
position: absolute;
top: 0.45rem;
left: 0;
/* CSS-only Arrow */
content: '';
border-width: var(--docusaurus-details-summary-arrow-size);
border-style: solid;
border-color: transparent transparent transparent
var(--docusaurus-details-decoration-color);
/* Arrow rotation anim */
transform: rotate(0deg);
transition: var(--docusaurus-details-transition);
transform-origin: calc(var(--docusaurus-details-summary-arrow-size) / 2) 50%;
}
/* When JS disabled/failed to load: we use the open property for arrow animation: */
.details[open]:not(.isBrowser) > summary::before,
/* When JS works: we use the data-attribute for arrow animation */
.details[data-collapsed='false'].isBrowser > summary::before {
transform: rotate(90deg);
}
.collapsibleContent {
margin-top: 1rem;
border-top: 1px solid var(--docusaurus-details-decoration-color);
padding-top: 1rem;
}
.collapsibleContent p:last-child {
margin-bottom: 0;
}
.details > summary > p:last-child {
margin-bottom: 0;
}