{% extends "main.html" %} {% block tabs %} {{ super() }} <style> :root { --goreleaser-primary-color: #252525; } .md-main { flex-grow: 1; background-color: hsl(0, 0%, 15%); } .md-header { position: initial } .md-footer { background-color: #363636; color: var(--md-footer-fg-color); } .md-main__inner { margin: 0 } .md-content { display: none } .tx-container { padding-top: 1rem; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1123 258'><path d='M1124,2c0,0 0,256 0,256l-1125,0l0,-48c0,0 16,5 55,5c116,0 197,-92 325,-92c121,0 114,46 254,46c140,0 214,-167 572,-166Z' style='fill: hsl(0, 0%, 15%)'/></svg>") no-repeat bottom, linear-gradient(to bottom, var(--md-primary-fg-color), var(--goreleaser-primary-color) 99%, #fff 99%) } .md-typeset h2 { font-weight: bold; color: #ffffff; text-transform: none; margin: 0.5em 0 0.64em; } .tx-hero { margin: 0 .8rem; color: var(--md-primary-bg-color) } .tx-hero h1 { margin-bottom: 0.1rem; color: currentColor; font-weight: 700 } .tx-hero__content { padding-bottom: 6rem } .tx-hero .md-button { margin-top: .5rem; margin-right: .5rem; color: var(--md-primary-bg-color) } .tx-hero .md-button--primary { background-color: var(--md-primary-bg-color); color: var(--goreleaser-primary-color); border-color: var(--md-primary-bg-color) } .tx-hero .md-button:focus, .tx-hero .md-button:hover { background-color: var(--md-accent-fg-color); color: var(--md-default-bg-color); border-color: var(--md-accent-fg-color) } @media screen and (max-width:70em) { .tx-hero h1 { font-size: 1.4rem } .tx-hero__image { text-align: center; } .tx-hero__image img { max-width: 10rem; } } @media screen and (min-width:70em) { .md-sidebar--secondary { display: none } .tx-hero { display: flex; align-items: stretch } .tx-hero__content { max-width: 30rem; margin-top: 2rem; padding-bottom: 20vw } .tx-hero__image { order: 1; margin-left: auto; margin-top: 2rem; } .tx-hero__image img { max-width: 15rem; } } @media screen and (min-width:76.25em) { .md-sidebar--primary { display: none } .tx-hero__image { margin-left: auto; } .tx-hero__image img { max-width: 20rem; } } </style> <section class="tx-container"> <div class="md-grid md-typeset"> <div class="tx-hero"> <div class="tx-hero__image"> <img src="assets/logomark.png" alt="" draggable="false"> </div> <div class="tx-hero__content"> <h1>Plex Meta Manager</h1> <h2>Unleash the potential of your media libraries!</h2> <p>With Plex Meta Manager, you can:</p> <ul> <li>Create hand-crafted collections to showcase your library in unique ways</li> <li>Apply modular overlays to your posters</li> <li>Connect to third-party sites such as TMDb, IMDb and Trakt</li> <li>Apply our pre-defined PMM Default Collections and Overlays</li> <li>Integrate with Radarr and Sonarr to expand your media libraries</li> <li>Share your creations with others in our Discord and Configs Repo</li> <li>... and much more!</li> </ul> <a href="home" title="{{ page.next_page.title | striptags }}" class="md-button md-button--primary"> Get started </a> <a href="https://github.com/sponsors/meisnate12" title="Donate to PMM" class="md-button"> Donate to PMM </a> </div> </div> </div> </section> {% endblock %} {% block content %}{% endblock %}