UNPKG

nextjs-darkmode

Version:

Unleash the Power of React Server Components! Use dark/light mode on your site with confidence, without losing any advantages of React Server Components

2 lines (1 loc) 831 B
.ndm__switch{all:unset;position:relative;display:inline-block;color:currentColor;border-radius:50%;border:1px dashed currentColor;cursor:pointer;--size: 24px;height:var(--size);width:var(--size);transition:all .3s ease-in-out 0s!important}[data-m=system] .ndm__switch:after{position:absolute;height:100%;width:100%;top:0;left:0;font-weight:600;font-size:calc(var(--size) / 2);display:flex;align-items:center;justify-content:center;content:"A"}[data-rm=""] .ndm__switch{box-shadow:0 0 50px 10px #ff0;background-color:#ff0;border:1px solid orangered}[data-rm=dark] .ndm__switch{box-shadow:calc(var(--size) / 4) calc(var(--size) / -4) calc(var(--size) / 8) inset #fff;border:none;background:transparent;animation:ndm__n linear .5s}@keyframes ndm__n{40%{transform:rotate(-15deg)}80%{transform:rotate(10deg)}0%,to{transform:rotate(0)}}