diff --git a/DnD_Original_DnD/DnD_ODnD.css b/DnD_Original_DnD/DnD_ODnD.css new file mode 100644 index 0000000000..888520c407 --- /dev/null +++ b/DnD_Original_DnD/DnD_ODnD.css @@ -0,0 +1,203 @@ +/* Original Dungeons & Dragons Character Sheet CSS */ +/* Version 1.1 */ + + +/**************** +*** FONTS *** +****************/ + +@import url('https://fonts.googleapis.com/css?family=Special+Elite|Sue+Ellen+Francisco&display=swap'); + +/* end Fonts */ + + +/************** +** Wrapper ** +**************/ + +.charsheet { + padding: 0; +} + +.sheet-odd { + max-width: 800px; + min-width: 700px; + margin: 0; + padding: 10px 20px 20px; + background: #FAFCFC; +} + + +/***************** +** Typography ** +*****************/ + +h2, span, label, .sheet-label, .sheet-text { + margin: 0px; + font-family: 'Special Elite'; + font-size: 16px; + line-height: 32px; + font-weight: bold; + color: #7A9EAA; +} + +h2, .sheet-label, .sheet-center { + text-align: center; +} + +.sheet-label, .sheet-underline { + text-decoration: underline; +} + +/****************** +*** LAYAOUT *** +******************/ + +/* FLEXBOX */ + +.sheet-flex-row { + display: flex; + align-items: baseline; +} + +.sheet-label { + justify-content: center; +} + +.sheet-flex-row.sheet-misc { + align-items: flex-start; +} + +/* GRID for Top section */ + +.sheet-grid-top { + display: grid; + grid-template-columns: repeat(16, 1fr); + grid-template-rows: auto; + grid-gap: 16px; + padding-bottom: 8px; +} +.sheet-grid-top-span1 { + grid-column: span 1; +} +.sheet-grid-top-span4 { + grid-column: span 4; +} +.sheet-grid-top-span6 { + grid-column: span 6; +} +.sheet-grid-top-span8 { + grid-column: span 8; +} +.sheet-grid-top-span16 { + grid-column: span 16; +} + +/* GRID for Bottom section */ + +.sheet-grid-bottom { + display: grid; + grid-template-columns: repeat(3, 1fr); + grid-template-rows: 200px auto 51px; + grid-gap: 8px; + padding-bottom: 8px; +} + +.sheet-grid-bottom-item { + padding: 0 8px 8px 0; +} + +.sheet-grid-bottom-item1 { + grid-row: span 3; + border-right: 2px dashed #7A9EAA; +} +.sheet-grid-bottom-item2 { + border-right: 2px dashed #7A9EAA; +} +.sheet-grid-bottom-item5 { + grid-row: span 2; + border-top: 2px dashed #7A9EAA; + border-right: 2px dashed #7A9EAA; +} +.sheet-grid-bottom-item6, .sheet-grid-bottom-item9 { + border-top: 2px dashed #7A9EAA; +} + +/* END Layout */ + + +/************************ +*** FORM ELEMENTS *** +************************/ + +.sheet-odd label { + margin: 0; + padding: 0 8px 0 0; + width: auto; +} + +.sheet-odd input { + border: none; + margin: 0; + padding: 0 8px; + border-bottom: 2px solid #7A9EAA; + background: transparent; + font-family: 'Sue Ellen Francisco'; + font-size: 20px; + color: #333; + overflow: visible; +} + +.sheet-odd textarea { + border: none; + margin: 0; + padding: 0 8px; + background: transparent; + font-family: 'Sue Ellen Francisco'; + font-size: 20px; + color: #333; + overflow: visible; + width: 100%; + flex-grow: 1; +} + +::placeholder { + font-family: 'Special Elite'; + font-size: 16px; + text-align: center; + line-height: 50px; + text-align: center; +} + +input.sheet-fill, .sheet-fill { + width: 100%; + flex-grow: 1; +} + +input.sheet-attr { + text-align: center; +} + +textarea.sheet-textarea-fill { + box-sizing:border-box; + width: 100%; + height: 85% +} + +/* END Form Elements */ + +/* Misc. */ + +.sheet-lanuages-saves-misc { + border-top: 2px dashed #7A9EAA; + border-bottom: 2px dashed #7A9EAA; + padding: 16px 0; +} + +.sheet-saves { + padding: 16px 0; +} + +.sheet-coin label { + width: 55%; +} diff --git a/DnD_Original_DnD/DnD_ODnD.html b/DnD_Original_DnD/DnD_ODnD.html new file mode 100644 index 0000000000..6577c98b86 --- /dev/null +++ b/DnD_Original_DnD/DnD_ODnD.html @@ -0,0 +1,123 @@ + + + +