http://steuerlein-reimbibel.de/index.php?action=history&feed=atom&title=Vorlage%3APiechart%2Fstyles.css 2026-04-12T18:08:32Z Versionsgeschichte dieser Seite in Johann Steuerleins Reimbibel MediaWiki 1.43.0 http://steuerlein-reimbibel.de/index.php?title=Vorlage:Piechart/styles.css&diff=1083&oldid=prev 2024-01-18T16:11:40Z

<p>Die Seite wurde neu angelegt: „<span class="autocomment">* Smooth piechart. <a href="/index.php?title=Module:Piechart&amp;action=edit&amp;redlink=1" class="new" title="Module:Piechart (Seite nicht vorhanden)" data-bs-title="Module:Piechart">Module:Piechart</a>: </span> <span class="autocomment">base structure: </span> .smooth-pie { display: none; position: relative; width: 100px; height: 100px; border-radius: 50%; background-color: yellowgreen; } <span class="autocomment">slices (default = pie25/pieX): </span> .smooth-pie div { position: absolute; transform-origin: left bottom; background-color: #655; top: 0; left: 50%; width: 50%; height: 50%; border-radius: 0 500% 0 0; } .smooth-pie .pie50 { transform-origin: lef…“</p> <p><b>Neue Seite</b></p><div>/**<br /> Smooth piechart.<br /> <br /> [[Module:Piechart]]<br /> */<br /> /* base structure */<br /> .smooth-pie {<br /> display: none;<br /> position: relative;<br /> width: 100px;<br /> height: 100px;<br /> border-radius: 50%;<br /> background-color: yellowgreen;<br /> }<br /> /* slices (default = pie25/pieX) */<br /> .smooth-pie div {<br /> position: absolute;<br /> transform-origin: left bottom;<br /> background-color: #655;<br /> <br /> top: 0; left: 50%;<br /> width: 50%; height: 50%;<br /> border-radius: 0 500% 0 0;<br /> }<br /> .smooth-pie .pie50 {<br /> transform-origin: left center;<br /> height: 100%;<br /> border-radius: 0 100% 100% 0 / 50%;<br /> }<br /> .smooth-pie .pie12-5 {clip-path: polygon(0% 0%, 100% 0%, 0 100%);}<br /> .smooth-pie .pie5 {clip-path: polygon(0% 0%, 32.49197% 0%, 0 100%);}<br /> .smooth-pie .pie7 {clip-path: polygon(0% 0%, 47.056428% 0%, 0 100%);}<br /> .smooth-pie .pie1 {clip-path: polygon(0% 0%, 6.2914667% 0%, 0 100%);}<br /> /* unlock for supported browsers */<br /> @supports(clip-path: circle(50%)) {<br /> .smooth-pie {<br /> display:block;<br /> } <br /> }<br /> /* container and legend */<br /> .smooth-pie-container {<br /> display: flex;<br /> align-items: flex-start;<br /> gap: 1em;<br /> flex-wrap: wrap;<br /> }<br /> .smooth-pie-legend {<br /> list-style-type: none !important;<br /> margin: 0 !important;<br /> padding: 0 !important;<br /> }<br /> .smooth-pie-legend li {<br /> display: flex;<br /> align-items: center;<br /> gap: .5em;<br /> }<br /> .smooth-pie-legend li span {<br /> display: block;<br /> box-sizing: border-box;<br /> }<br /> .smooth-pie-legend li .l-color {<br /> border: 1px solid black;<br /> width: .8em;<br /> height: .8em;<br /> }</div>

Walknud