.bilibili-evolved-about { height: 100%; width: 400px; background: white; color: #000; position: fixed; top: 0; left: 0; z-index: 100000; transform: translateX(-100%); transition: all .3s cubic-bezier(0, 0.86, 0.58, 1); display: flex; flex-direction: column; box-shadow: 4px 0px 16px 0px #0000; } body.dark .bilibili-evolved-about { background: #222; color: #eee; } .bilibili-evolved-about.opened { transform: translateX(0); box-shadow: 4px 0px 16px 0px #0005; } .about-header { padding: 32px; display: flex; align-items: center; justify-content: flex-start; } .about-header i { margin-right: 8px; display: flex; } .about-title { font-size: 16pt; } .about-content { padding: 16px 36px 0 36px; margin-bottom: 36px; display: flex; flex-direction: column; overflow: auto; } .about-content .name { font-size: 24pt; display: flex; align-items: center; } .about-content .name img { margin-right: 18px; } .about-content .version { font-size: 12pt; opacity: 0.6; margin-top: 6px; margin-bottom: 6px; align-self: center; } .about-content .love { font-size: 10pt; margin-bottom: 24px; align-self: center; } .about-content .love a { color: inherit !important; } .about-content section { font-size: 10pt; margin-top: 16px; } .about-content section .title { display: flex; justify-content: center; text-transform: uppercase; font-weight: bold; font-size: 13pt; letter-spacing: 3px; margin: 8px 0 16px 0; } .about-content section a, .about-content section .supporter { color: var(--theme-color) !important; margin-right: 8px; display: inline-flex; } .about-content section .supporter { user-select: none; } .about-content section .supporter:not(:last-child)::after, .about-content section a:not(:last-child)::after { content: ","; } @keyframes spinner { to {transform: translate(-50%, -50%) rotate(360deg);} } .about-content section.participants .fetching { margin-right: 8px; position: relative; width: 16px; height: 16px; display: inline-flex; } .about-content section.participants .fetching::before { content: ""; box-sizing: border-box; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(0deg); width: 16px; height: 16px; border-radius: 50%; border: 2px solid #8884; border-top-color: var(--theme-color); animation: spinner .6s linear infinite; }