Obsidian Portal - Campaign websites for Dungeons and Dragons and other tabletop RPGs

Scion

Author: ChainsawXIV

Slug: chainsawxiv_scion

Type: GameCharacter

System: Scion: Hero

DST Source Code

HTML Template

<div class="wrapper csx">

	<div class="tabs">
		<a class="tab fluff tab_fluff" title="Characterization"></a>
		<a class="tab crunch tab_crunch active" title="Characteristics"></a>
	</div>
	
	<div class="uicontainer">
	
		<div class="formatBar">
			<button type="button" class="boldButton" title="Bold (Ctrl+B)"></button>
			<button type="button" class="italicButton" title="Italic (Ctrl+I)"></button>
			<button type="button" class="underlineButton" title="Underline (Ctrl+U)"></button>
			<button type="button" class="indentButton" title="Indent (Ctrl+Tab)"></button>
		</div>
	
		<div class="tipBox">
			<div class="corner topLeft"></div>
			<div class="corner topRight"></div>
			<div class="corner bottomLeft"></div>
			<div class="corner bottomRight"></div>
			<div class="contentBox">
				<div class="tipArea edit"></div>
			</div>
		</div>
	
	</div>
	
	<div class="main" style="display:block;">
		<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-left.png" class="corner_top_left" />
		<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-right.png" class="corner_top_right" />
		<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-left.png" class="corner_bottom_left" />
		<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-right.png" class="corner_bottom_right" />
		<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-bottom.png" class="brass_bottom" />
		
		<div class="pagehead">
			<div class="head">
				<span class="name readonly dsf dsf_name">Edit Character Name</span>
			</div>
			<span class="dsf dsf_calling typev" style="text-align:right;">Edit Calling</span> &#8226; 
			<span class="dsf dsf_pantheon typev" style="text-align:right;">Edit Pantheon</span> &#8226; 
			<span class="dsf dsf_nature typev" style="text-align:right;">Edit Nature</span> &#8226; 
			<span class="dsf dsf_role typev" style="text-align:right;">Edit Role</span>
			
		</div>

		<div class="page page_crunch active">
			
			<span class="column halfwidth colspace">
			
				<!-- Attributes -->
				<div class="section halfwidth">
					<div class="head">ATTRIBUTES</div>
					<div class="group">
						<div class="row scionstat">
							<span class="readonly check dsf dsf_strength_epic epicstat"></span>
							Strength<span class="readonly pips pipsRange_10 dsf dsf_strength">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_strength_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_dexterity_epic epicstat"></span>
							Dexterity<span class="readonly pips pipsRange_10 dsf dsf_dexterity">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_dexterity_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_stamina_epic epicstat"></span>
							Stamina<span class="readonly pips pipsRange_10 dsf dsf_stamina">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_stamina_legendary"></span>
						</div>
					</div>
					<div class="group">
						<div class="row scionstat">
							<span class="readonly check dsf dsf_charisma_epic epicstat"></span>
							Charisma<span class="readonly pips pipsRange_10 dsf dsf_charisma">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_charisma_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_manipulation_epic epicstat"></span>
							Manipulation<span class="readonly pips pipsRange_10 dsf dsf_manipulation">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_manipulation_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_appearance_epic epicstat"></span>
							Appearance<span class="readonly pips pipsRange_10 dsf dsf_appearance">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_appearance_legendary"></span>
						</div>
					</div>
					<div class="group">
						<div class="row scionstat">
							<span class="readonly check dsf dsf_perception_epic epicstat"></span>
							Perception<span class="readonly pips pipsRange_10 dsf dsf_perception">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_perception_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_intelligence_epic epicstat"></span>
							Intelligence<span class="readonly pips pipsRange_10 dsf dsf_intelligence">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_intelligence_legendary"></span>
						</div>
						<div class="row scionstat">
							<span class="readonly check dsf dsf_wits_epic epicstat"></span>
							Wits<span class="readonly pips pipsRange_10 dsf dsf_wits">1</span>
							&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_wits_legendary"></span>
						</div>
					</div>
				</div>
				
				<!-- Abilities -->
				<div class="section halfwidth">
					<div class="head">ABILITIES
						<span class="interface trash"></span>
						<span class="interface add addto_abilities" title="Add Ability"></span>
					</div>
					<ul class="group list list_abilities">
						<li class="proto item">
							<div class="handle"><div></div></div>
							<span class="readonly check dslf dslf_favored"></span>
							<span class="edit dslf dslf_name abilitylabel">Ability</span>
							<span class="readonly pips pipsRange_10 dslf dslf_rating"></span>
						</li>
						<span class="oldfields hidden">[]</span>
						<span class="dsf dsf_abilities readonly hidden">
							[
								{"favored":0,"name":"Academics","rating":0},
								{"favored":0,"name":"Animal Ken","rating":0},
								{"favored":0,"name":"Art","rating":0},
								{"favored":0,"name":"Athletics","rating":0},
								{"favored":0,"name":"Awareness","rating":0},
								{"favored":0,"name":"Brawl","rating":0},
								{"favored":0,"name":"Command","rating":0},
								{"favored":0,"name":"Control","rating":0},
								{"favored":0,"name":"Craft","rating":0},
								{"favored":0,"name":"Empathy","rating":0},
								{"favored":0,"name":"Fortitude","rating":0},
								{"favored":0,"name":"Integrity","rating":0},
								{"favored":0,"name":"Investigation","rating":0},
								{"favored":0,"name":"Larceny","rating":0},
								{"favored":0,"name":"Marksmanship","rating":0},
								{"favored":0,"name":"Medicine","rating":0},
								{"favored":0,"name":"Melee","rating":0},
								{"favored":0,"name":"Occult","rating":0},
								{"favored":0,"name":"Politics","rating":0},
								{"favored":0,"name":"Presence","rating":0},
								{"favored":0,"name":"Science","rating":0},
								{"favored":0,"name":"Stealth","rating":0},
								{"favored":0,"name":"Survival","rating":0},
								{"favored":0,"name":"Thrown","rating":0}
							]
						</span>
					</ul>
				</div>

				<!-- Combat -->
				<div class="section halfwidth colspace">
					<div class="head">COMBAT</div>
					<div class="group">
						<div class="row">Soak: <span class="dsf dsf_soak right">0B / 0L / 0A</span></div>
						<div class="row">Armor: <span class="dsf dsf_armor right">0B / 0L / 0A</span></div>
						<div class="row">Dodge DV: <span class="dsf dsf_dodge right">0</span></div>
						<div class="row">Parry DV: <span class="dsf dsf_parry right">0</span></div>
						<div class="row">Joing Battle: <span class="dsf dsf_join_battle right">0</span></div>
					</div>
				</div>
				
			</span>
			
			<span class="column halfwidth">

				<!-- Misc -->
				<div class="section halfwidth" style="min-height:0px;">
					<div class="head">MISCELANIOUS</div>
					<div class="group">
						<div class="row">Willpower<span class="readonly pips pipsRange_10 dsf dsf_willpower"></span></div>
						<div class="row">Legend<span class="readonly pips pipsRange_12 dsf dsf_legend">2</span></div>
						<div class="row">Legend Points: <span class="dsf dsf_legend_points right">0 | 0</span></div>
						<div class="row">Experience: <span class="dsf dsf_experience right">0 (0 Spent)</span></div>
					</div>
				</div>

				<!-- Virtues -->
				<div class="section halfwidth">
					<div class="head">VIRTUES</div>
					<div class="group">
						<div class="row"><span class="dsf dsf_virtue01 pips5label">Virtue Name</span><span class="readonly pips pipsRange_5 dsf dsf_virtue01_rating">1</span></div>
						<div class="row"><span class="dsf dsf_virtue02 pips5label">Virtue Name</span><span class="readonly pips pipsRange_5 dsf dsf_virtue02_rating">1</span></div>
						<div class="row"><span class="dsf dsf_virtue03 pips5label">Virtue Name</span><span class="readonly pips pipsRange_5 dsf dsf_virtue03_rating">1</span></div>
						<div class="row"><span class="dsf dsf_virtue04 pips5label">Virtue Name</span><span class="readonly pips pipsRange_5 dsf dsf_virtue04_rating">1</span></div>
					</div>
				</div>

				<!-- Boons -->
				<div class="section halfwidth">
					<div class="head">BOONS
						<span class="interface trash"></span>
						<span class="interface add addto_boons" title="Add Boon"></span>
					</div>
					<ul class="group list list_boons">
						<li class="proto item">
							<div class="handle"><div></div></div>
							<span class="edit dslf dslf_name fullcolumn">Boon Name</span>
							<span class="tip dslf dslf_tip"></span>
						</li>
						<span class="oldfields hidden">[]</span>
						<span class="dsf dsf_boons readonly hidden"></span>
					</ul>
				</div>

				<!-- Knacks -->
				<div class="section halfwidth">
					<div class="head">KNACKS
						<span class="interface trash"></span>
						<span class="interface add addto_knacks" title="Add Knack"></span>
					</div>
					<ul class="group list list_knacks">
						<li class="proto item">
							<div class="handle"><div></div></div>
							<span class="edit dslf dslf_name fullcolumn">Knack Name</span>
							<span class="tip dslf dslf_tip"></span>
						</li>
						<span class="oldfields hidden">[]</span>
						<span class="dsf dsf_knacks readonly hidden"></span>
					</ul>
				</div>
				
				<!-- Birthrights -->
				<div class="section halfwidth">
					<div class="head">BIRTHRIGHTS
						<span class="interface trash"></span>
						<span class="interface add addto_birthrights" title="Add Birthright"></span>
					</div>
					<ul class="group list list_birthrights">
						<li class="proto item">
							<div class="handle"><div></div></div>
							<span class="edit dslf dslf_name pips5label">Birthright</span>
							<span class="pips pipsRange_5 dslf readonly dslf_rating">1</span>
							<span class="tip dslf dslf_tip"></span>
						</li>
						<span class="oldfields hidden">[]</span>
						<span class="dsf dsf_birthrights readonly hidden"></span>
					</ul>
				</div>							

				<!-- Movement -->
				<div class="section halfwidth colspace">
					<div class="head">MOVEMENT</div>
					<div class="group">
						<div class="row">Move: <span class="dsf dsf_move right">0</span></div>
						<div class="row">Dash: <span class="dsf dsf_dash right">0</span></div>
						<div class="row">Jump: <span class="dsf dsf_jump right">0</span></div>
					</div>
				</div>
				
				<!-- Health -->
				<div class="section halfwidth">
					<div class="head">HEALTH</div>
					<div class="group">
						<div class="row">-0 Levels<span class="readonly pips pipsRange_10 dsf dsf_0health"></span></div>
						<div class="row">-1 Levels<span class="readonly pips pipsRange_10 dsf dsf_1health"></span></div>
						<div class="row">&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_1health_b"></span></div>
						<div class="row">-2 Levels<span class="readonly pips pipsRange_10 dsf dsf_2health"></span></div>
						<div class="row">&nbsp;<span class="readonly pips pipsRange_10 dsf dsf_2health_b"></span></div>
						<div class="row">-4 Levels<span class="readonly pips pipsRange_10 dsf dsf_4health"></span></div>
					</div>
				</div>

			</span>
			
			<!-- Attacks -->
			<div class="section attacks">
				<div class="head">ATTACKS
					<span class="interface trash"></span>
					<span class="interface add addto_attacks" title="Add Attack"></span>
				</div>
				<div class="labelrow">
					<span class="weapon">Attack</span>
					<span class="speed">Speed</span>
					<span class="accuracy">Acc</span>
					<span class="damage">Damage</span>
					<span class="defense">Def</span>
					<span class="rate">Rate</span>
					<span class="range">Range</span>
					<span class="tags">Tags</span>
				</div>
				<ul class="group list list_attacks">
					<li class="proto item">
						<div class="handle"><div></div></div>
						<span class="edit dslf typea dslf_name weapon">Attack Name</span>
						<span class="edit dslf typed dslf_speed speed">5</span>
						<span class="edit dslf typed dslf_accuracy accuracy">+0</span>
						<span class="edit dslf typed dslf_damage damage">0L</span>
						<span class="edit dslf typed dslf_defense defense">+0</span>
						<span class="edit dslf typed dslf_rate rate">1</span>
						<span class="edit dslf typed dslf_range range">Melee</span>
						<span class="edit dslf typed dslf_tags tags">-</span>
					</li>
					<span class="oldfields hidden">[{"name":"attack_weapon","speed":"attack_speed","accuracy":"attack_accuracy","damage":"attack_damage","defense":"attack_defense","rate":"attack_rate","range":"attack_range","tags":"attack_tags"}]</span>
					<span class="dsf dsf_attacks readonly hidden"></span>
				</ul>
			</div>
			
		</div>

		<div class="page page_fluff active">

			<!-- Biography -->
			<div class="section">
				<div class="head">BIOGRAPHY</div>
				<div class="group">
					<div class="portraitholder">
						<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-left.png" class="topleft" />
						<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-right.png" class="topright" />
						<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-left.png" class="bottomleft" />
						<img alt="" src="https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-right.png" class="bottomright" />
						<span class="portrait readonly dsf dsf_avatar_image">.</span>
					</div>
					<span class="dsf dsf_bio fullwidth readonly">Edit Biography below...</span>
				</div>
			</div>

			<!-- Appearance -->
			<div class="section">
				<div class="head">APPEARANCE</div>
				<div class="group">
					<span class="dsf dsf_desc fullwidth">Character appearance...</span>
				</div>
			</div>
			
		</div>
		
		<div class="page_foot">
			<div class="head"></div>
			<span class="readonly dsf dsf_campaign">Campaign Name</span> &#8226; 
			Character By <span class="align_right dsf dsf_player readonly">Player</span> &#8226; 
			Sheet By <span class="align_left dsf dsf_dst_author readonly">Author</span>
		</div>
	</div>
	
</div>

CSS

/* Font Imports */

@import url(https://fonts.googleapis.com/css?family=Cinzel:400,700);
@import url(https://fonts.googleapis.com/css?family=EB+Garamond);

/* Component Includes */

@import url(https://chainsawxiv.github.io/DST/common/css/csx_exalted_common.css);

/* Splat Specific: Checks */

div.ds_chainsawxiv_scion .check .checkBorder{
	background-image:url('https://chainsawxiv.github.io/DST/common/images/check_border.svg');
}

div.ds_chainsawxiv_scion .check .checkOff{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/check_off.png');
}

div.ds_chainsawxiv_scion.editable .check .checkOff:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/check_off_hover.png');
}

div.ds_chainsawxiv_scion .check .checkOn{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/check_on.png');
}

div.ds_chainsawxiv_scion.editable .check .checkOn:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/check_on_hover.png');
}



div.ds_chainsawxiv_scion .check.epicstat .checkBorder{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/epic_check_border.svg');
}

div.ds_chainsawxiv_scion .check.epicstat .checkOff{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_off.png');
	background-size: 15px;
	background-position: 7px 7px;
}

div.ds_chainsawxiv_scion.editable .check.epicstat .checkOff:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_off_hover.png');
	background-size: 15px;
	background-position: 7px 7px;
}

div.ds_chainsawxiv_scion .check.epicstat .checkOn{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_on.png');
	background-size: 15px;
	background-position: 7px 7px;
}

div.ds_chainsawxiv_scion.editable .check.epicstat .checkOn:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_on_hover.png');
	background-size: 15px;
	background-position: 7px 7px;
}

/* Splat Specific: Pips */

div.ds_chainsawxiv_scion .pipBorder{
	background-image:url('https://chainsawxiv.github.io/DST/common/images/pip_border.svg');
}

div.ds_chainsawxiv_scion .pips .pipOff{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_off.png');
}

div.ds_chainsawxiv_scion.editable .pips .pipOff:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_off_hover.png');
}

div.ds_chainsawxiv_scion .pips .pipOn{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_on.png');
}

div.ds_chainsawxiv_scion.editable .pips .pipOn:hover{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/pip_on_hover.png');
}

/* Splat Specific: Tabs */

div.ds_chainsawxiv_scion .tab.crunch{
	background:
		url('https://chainsawxiv.github.io/DST/common/images/crunch.png') no-repeat 50% 50%,
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab01_inactive.png');
	background-size:
		70% 70%,
		100% 100%;
}
div.ds_chainsawxiv_scion .tab.crunch:not(.active):hover{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/crunch_hover.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab01_inactive.png');
}
div.ds_chainsawxiv_scion .tab.crunch.active{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/crunch.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab01_active.png');
}

div.ds_chainsawxiv_scion .tab.magic{
	background:
		url('https://chainsawxiv.github.io/DST/common/images/magic.png') no-repeat 50% 50%,
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab02_inactive.png');
	background-size:
		70% 70%,
		100% 100%;
}
div.ds_chainsawxiv_scion .tab.magic:not(.active):hover{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/magic_hover.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab02_inactive.png');
}
div.ds_chainsawxiv_scion .tab.magic.active{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/magic.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab02_active.png');
}

div.ds_chainsawxiv_scion .tab.equipment{
	background:
		url('https://chainsawxiv.github.io/DST/common/images/equipment.png') no-repeat 50% 50%,
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab03_inactive.png');
	background-size:
		70% 70%,
		100% 100%;
}
div.ds_chainsawxiv_scion .tab.equipment:not(.active):hover{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/equipment_hover.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab03_inactive.png');
}
div.ds_chainsawxiv_scion .tab.equipment.active{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/equipment.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab03_active.png');
}

div.ds_chainsawxiv_scion .tab.fluff{
	background:
		url('https://chainsawxiv.github.io/DST/common/images/fluff.png') no-repeat 50% 50%,
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab04_inactive.png');
	background-size:
		70% 70%,
		100% 100%;
}
div.ds_chainsawxiv_scion .tab.fluff:not(.active):hover{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/fluff_hover.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab04_inactive.png');
}
div.ds_chainsawxiv_scion .tab.fluff.active{
	background-image:
		url('https://chainsawxiv.github.io/DST/common/images/fluff.png'),
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/tab04_active.png');
}

/* Splat Specific: Tips */

div.ds_chainsawxiv_scion .tipBox .corner.topLeft{
	background:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-left.png') top left no-repeat;
	background-size:15px 15px;
}
div.ds_chainsawxiv_scion .tipBox .corner.topRight{
	background:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-top-right.png') top right no-repeat;
	background-size:15px 15px;
}
div.ds_chainsawxiv_scion .tipBox .corner.bottomLeft{
	background:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-left.png') bottom left no-repeat;
	background-size:15px 15px;
}
div.ds_chainsawxiv_scion .tipBox .corner.bottomRight{
	background:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/brass-corner-bottom-right.png') bottom right no-repeat;
	background-size:15px 15px;
}

div.ds_chainsawxiv_scion .tipBox .contentBox{
	background:
		url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/background.jpg') top left no-repeat;
	background-size:
		730px 730px;
	background-color:#e4e5d5;
	border-color:#554220;
}

div.ds_chainsawxiv_scion .tipBox .contentBox .tipArea,
div.ds_chainsawxiv_scion .tipBox .contentBox .tipArea:hover{
	background-color:rgba(255,255,255,0.2);
	border:1px dotted rgba(0,0,0,0.3);
	border-radius:4px;
	font-family:'EB Garamond',Sans Serif;
	color:#000000;
}

/* Splat Specific: Editable */

div.ds_chainsawxiv_scion .dsf:not(.readonly),
div.ds_chainsawxiv_scion .edit:not(.readonly),
div.ds_chainsawxiv_scion .dsf_bio{
	font-family:'EB Garamond',Sans Serif;
}

/* Splat Specific: Sheet */

div.ds_chainsawxiv_scion .main{
	background-image:url('https://chainsawxiv.github.io/DST/sheets/chainsawxiv_scion/images/background.jpg');
	background-position:top left;
	background-repeat:no-repeat;
	background-color:#bab5ae;
	
	border-style:solid;
	border-width:1px;
	border-color:#000000;
	
	font-family:'Cinzel', palatino, serif;
	font-size:14px;
	line-height:17px;
	color:#000000;
}

div.ds_chainsawxiv_scion .head{
	border-bottom:solid 1px #000000;
}

div.ds_chainsawxiv_scion a{
	text-decoration:none;
	color:#000000;
}

div.ds_chainsawxiv_scion .section a{
	text-decoration:underline;
}

div.ds_chainsawxiv_scion .attacks .labelrow span{
	border-bottom:1px solid #000000;
}

div.ds_chainsawxiv_scion .dsf.dsf_type{
	font-family:'Cinzel', palatino, serif;
}

div.ds_chainsawxiv_scion .edit.abilitylabel{
	width:160px;
	font-family:'Cinzel', palatino, serif;
}

div.ds_chainsawxiv_scion .corner_top_left{
	left:-28px;
	top:-28px;
}
div.ds_chainsawxiv_scion .corner_top_right{
	right:-28px;
	top:-28px;
}
div.ds_chainsawxiv_scion .corner_bottom_left{
	left:-28px;
	bottom:-28px;
}
div.ds_chainsawxiv_scion .corner_bottom_right{
	right:-28px;
	bottom:-28px;
}
div.ds_chainsawxiv_scion .brass_bottom{
	bottom:-28px;
}

.csx .portraitholder .topleft{
	top:-19px;
	left:-19px;
}
.csx .portraitholder .topright{
	top:-19px;
	right:-19px;
}
.csx .portraitholder .bottomleft{
	bottom:-19px;
	left:-19px;
}
.csx .portraitholder .bottomright{
	bottom:-19px;
	right:-19px;
}

.csx .pips.pipsRange_12 {
	width: 172px;
}

div.ds_chainsawxiv_scion .epicstat{
	float:right;
	position:relative;
	top:2px;
	height:30px;
	width:30px;
	margin-left:3px;
}

div.ds_chainsawxiv_scion .epicstat .checkMark,
div.ds_chainsawxiv_scion .epicstat .checkBorder{
	height:30px;
	width:30px;
}

div.ds_chainsawxiv_scion .scionstat{
	height:36px;
}

JavaScript

// Global Options
csx_opts = {
	'setupCallback': function(item){chainsawxiv_scion_setup(item);},
	'uiContainer': function(){return document;},
	'defaultFieldValue':'Click to edit',
	'imagePath':'https://chainsawxiv.github.io/DST/common/images/',
	'preloadFiles':[
		'add.png',
		'add_hover.png',
		'balance.png',
		'balance_hover.png',
		'bold_active.png',
		'bold_hover.png',
		'bullet.png',
		'crunch.png',
		'crunch_hover.png',
		'equipment.png',
		'equipment_hover.png',
		'fb_back_bottom.png',
		'fb_back_main.png',
		'fb_back_top.png',
		'fluff.png',
		'fluff_hover.png',
		'grab.png',
		'grab_hover.png',
		'indent.png',
		'indent_active.png',
		'indent_hover.png',
		'italic.png',
		'italic_active.png',
		'italic_hover.png',
		'magic.png',
		'magic_hover.png',
		'tip.png',
		'tip_hover.png',
		'trash.png',
		'trash_active.png',
		'trash_hover.png',
		'underline.png',
		'underline_active.png',
		'underline_hover.png'
	],
};

// Master Startup
function chainsawxiv_scion_dataPostLoad(data){

	csx_opts.defaultContext = document.getElementById(data.containerId);	
	csx_opts.uiContainer = csx_opts.defaultContext.querySelector('.uicontainer');
	csx_opts.isEditable = data.isEditable;

	// Include the shared script file
	var includes = document.createElement('script');
	includes.type = 'text/javascript';
	includes.src = 'https://chainsawxiv.github.io/DST/common/js/csx_exalted_common.js?v=dev002';
	includes.onload = function(){

		// Fix container properties
		csx_firstParentWithClass(csx_opts.defaultContext,'dynamic_sheet_container').style.overflow = 'visible';
		csx_firstParentWithClass(csx_opts.defaultContext,'main-content-container').style.minWidth = '853px';
		
		// Set up the editing interface
		csx_opts.setupCallback();
		
	};
	document.body.appendChild(includes);
	
	// Preload rollover images 
	// Deferred to prevent blocking
	window.setTimeout(function(){
		if (document.images){
			for (var i = 0; i < csx_opts.preloadFiles.length; i++){
				var img = new Image();
				img.src = csx_opts.imagePath + csx_opts.preloadFiles[i];
			}
		}
	},500);
	
}

// Setup After Script Load
function chainsawxiv_scion_setup(context){

	// Provide default context
	if (context == undefined)
		context = csx_opts.defaultContext;
	
	// Do setup for interfaces
	csx_pips(context);
	csx_check(context);
	csx_edit(context);
	csx_tip(context);
	csx_list(context);
	csx_tab(context);

}

// Shutdown Before Save
function chainsawxiv_scion_dataPreSave(){

	// Default the context if not set
	var context = csx_opts.defaultContext;

	// Bake everything down to its field values
	var pips = context.querySelectorAll('.pips');
	for (var i = 0; i < pips.length; i++){
		if (pips[i].parentNode.className.match(/proto/))
			continue;
		pips[i].unrender();
	}
	
	var checks = context.querySelectorAll('.check');
	for (var i = 0; i < checks.length; i++)
		checks[i].unrender();

	var edits = context.querySelectorAll('.dsf:not(.readonly),.edit');
	for (var i = 0; i < edits.length; i++)
		edits[i].unrender();

	var lists = context.querySelectorAll('.list');
	for (var i = 0; i < lists.length; i++)
		lists[i].unrender();		
		
}

Back

Scion

Create Your Campaign

Just One More Step

Just A Little More Info

Use a Social Account