@oslokommune/punkt-css/dist/css/components/preview.min.css

CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo

.pkt-preview{position:relative}.pkt-preview .pkt-tabs{--pkt-tabs-bg: var(--pkt-color-surface-default-gray)}.pkt-preview__mode{position:absolute;top:1rem;right:1rem}.pkt-preview__component{display:flex;justify-content:space-around;align-items:center;min-height:10rem;padding:3rem 1rem;margin:1rem 0 0;border:.25rem solid var(--pkt-color-surface-default-gray);background-color:var(--pkt-color-background-default);transition:background-color .2s linear}.pkt-preview__component--fullwidth>div{width:100%}.pkt-preview__opts{padding:1rem;background-color:var(--pkt-color-surface-default-gray)}.pkt-preview__opts>.pkt-cell{position:relative}.pkt-preview__opts>.pkt-cell>.pkt-tag{display:block;position:absolute;top:0;right:0;padding:0 .25rem 0}.pkt-preview__code{position:relative;margin-bottom:1rem;font-size:.8rem}.pkt-preview__code>pre{margin-top:0 !important;background-color:var(--pkt-color-surface-default-gray) !important}.pkt-preview__copy{position:absolute;top:.5rem;right:.5rem;display:flex;gap:.5rem;align-items:center}.pkt-preview__specs{background-color:var(--pkt-color-surface-default-gray)}.pkt-preview__specs pre{margin-top:0 !important}.pkt-preview__specs h2{padding:1rem}.astro-code.github-light{background-color:var(--pkt-color-surface-default-gray) !important}.preview-content{display:contents}