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

Coriolis standard

Author: cczernia

Slug: coriolis_standard

System: Coriolis: The Third Horizon

DST Source Code

HTML Template

<div class="coriolis-sheet">
    <div class="container">
      <div class="myzrow">
        <div class="col-4">
          <table class="attributes">
            <tr>
                <th colspan="2">ATTRIBUTES</th>
            </tr>
            <tr>
                <td>Strength</td>
                <td><span class="dsf dsf_strength"></span></td>
            </tr>
             <tr>
                <td>Agility</td>
                <td><span class="dsf dsf_agility"></span></td>
            </tr>
             <tr>
                <td>Wits</td>
                <td><span class="dsf dsf_wits"></span></td>
            </tr>
             <tr>
                <td>Empathy</td>
                <td><span class="dsf dsf_empathy"></span></td>
            </tr>
          </table>


      

          <table>
            <tr><td><strong>Mind Points (Wits + Empathy):</strong></td><td class="condit"><span class="dsf dsf_mindpoints"></span></td></tr>
            <tr><td><strong>Hit Points (Strength + Agility):</strong></td><td class="condit"><span class="dsf dsf_hitpoints"></span></td></tr>
            <tr><td colspan="2" class="critinj"><strong>Critical Injuries:</strong></td></tr>
            <tr><td colspan="2" class="condit"><span class="dsf dsf_injuries1"></span></td></tr>
            <tr><td colspan="2" class="condit"><span class="dsf dsf_injuries2"></span></td></tr>
            <tr><td colspan="2" class="condit"><span class="dsf dsf_injuries3"></span></td></tr>
            <tr><td><strong>Radiation</strong></td><td><span class="dsf dsf_radiation"></span></td></tr>
            <tr><td><strong>Experience Points</strong></td><td><span class="dsf dsf_xp"></span></td></tr>

            
        </table>

        </div>
        <div class="col-8">
         <div class="myzrow">
            <div class="col-12">
                <table class="name">
                    <tr>
                        <td><strong>Name:</strong><span class="dsf dsf_name"></span></td>
                        <td><strong>Background:</strong><span class="dsf dsf_background"></span></td>
                    </tr>
                     <tr>
                        <td><strong>Concept:</strong><span class="dsf dsf_concept"></span></td>
                        <td><strong>Icon:</strong><span class="dsf dsf_icon"></span></td>
                    </tr>
                    <tr>
                        <td><strong>Group Concept:</strong><span class="dsf dsf_grconcept"></span></td>
                        <td><strong>Reputation:</strong><span class="dsf dsf_rep"></span></td>
                    </tr>
                    <tr>
                        <td colspan="2"><strong>Personal Problem:</strong><span class="dsf dsf_problem"></span></td>
                    </tr>
                </table>
                <table class="appearance">
                    <tr>
                        <th>APPEARANCE</th>
                    </tr>
                    <tr>
                        <td><strong>Face</strong><span class="dsf dsf_face"></span></td>
                    </tr>
                    <tr>
                        <td><strong>Clothing</strong><span class="dsf dsf_clothing"></span></td>
                    </tr>
                </table>

               <table class="relationships">
                    <tr>
                        <th>RELATIONSHIPS</th>
                    </tr>
                    <tr>
                        <td><strong>PC1:</strong> <span class="dsf dsf_pc1"></span> </td>
                    </tr>
                     <tr>
                        <td><strong>PC2:</strong> <span class="dsf dsf_pc2"></span> </td>
                    </tr>
                     <tr>
                        <td><strong>PC3:</strong> <span class="dsf dsf_pc3"></span> </td>
                    </tr>
                     <tr>
                        <td><strong>PC4:</strong> <span class="dsf dsf_pc4"></span> </td>
                    </tr>
                </table>
            </div>
           
           

               
            </div>
        </div>
      </div>
      </div>



 <div class="container">
      <div class="myzrow">
        <div class="col-8">
          


        <table class="skills">
            <tr>
                <th colspan="2">SKILLS</th>
            </tr>
            <tr>
                <td>Dexterity (Agility) <span class="dsf dsf_dexterity"></span></td>
                <td>Command (Empathy) <span class="dsf dsf_command"></td>
            </tr>
             <tr>
                <td>Force (Strength) <span class="dsf dsf_force"></span></td>
                <td>Culture (Empathy) <span class="dsf dsf_culture"></span></td>
            </tr>
             <tr>
                <td>Infultration (Strength) <span class="dsf dsf_fight"></span></td>
                <td>Djinn (Wits) <span class="dsf dsf_djinn"></span></td>
            </tr>
             <tr>
                <td>Manipulation (Empathy) <span class="dsf dsf_manipulation"></span></td>
                <td>Medicurgy (Wits) <span class="dsf dsf_medicurgy"></span></td>
            </tr>
             <tr>
                <td>Melee Combat (Strength) <span class="dsf dsf_melee"></span></td>
                <td>Mystic Powers (Empathy) <span class="dsf dsf_powers"></span></td>
            </tr>
             <tr>
                <td>Observation (Wits) <span class="dsf dsf_observation"></span></td>
                <td>Pilot (Agility) <span class="dsf dsf_pilot"></span></td>
            </tr>
             <tr>
                <td>Ranged Combat (Agility) <span class="dsf dsf_ranged"></span></td>
                <td>Science (Wits) <span class="dsf dsf_science"></span></td>
            </tr>
             <tr>
                <td>Survival (Wits) <span class="dsf dsf_survival"></span></td>
                <td>Technology (Wits) <span class="dsf dsf_technology"></span></td>
            </tr>
          </table>
          <table>
                <tr>
                    <th>WEAPONS</th>
                    <th>Bonus</th>
                    <th>Damage</th>
                    <th>Range</th>
                    <th>Special</th> 
               </tr>
                <tr>
                    <td><span class="dsf dsf_weapon1"></span></td>
                    <td><span class="dsf dsf_bonus1"></span></td>
                    <td><span class="dsf dsf_damage1"></span></td>
                    <td><span class="dsf dsf_range1"></span</td>
                    <td><span class="dsf dsf_special1"></span></td>
               </tr>
               <tr>
                    <td><span class="dsf dsf_weapon2"></span></td>
                    <td><span class="dsf dsf_bonus2"></span></td>
                    <td><span class="dsf dsf_damage2"></span</td>
                    <td><span class="dsf dsf_range2"></span></td>
                    <td><span class="dsf dsf_special2"></span></td>
               </tr>
               <tr>
                    <td><span class="dsf dsf_weapon3"></span></td>
                    <td><span class="dsf dsf_bonus3"></span></td>
                    <td><span class="dsf dsf_damage3"></span</td>
                    <td><span class="dsf dsf_range3"></span></td>
                    <td><span class="dsf dsf_special3"></span></td>
               </tr>

              </table>

        </div>
        <div class="col-4">

        <table class="talents">
                    <tr>
                        <th>TALENTS</th>
                    </tr>
                    <tr>
                        <td><span class="dsf dsf_talent1"></span> </td>
                    </tr>
                    <tr>
                        <td><span class="dsf dsf_talent2"></span> </td>
                    </tr>
                     <tr>
                        <td><span class="dsf dsf_talent3"></span> </td>
                    </tr>
                    
                </table>

           
                <table class="gear">
                    <tr>
                        <th>GEAR</th>
                    </tr>
                    <tr>
                        <td><span class="num">1</span> <span class="dsf dsf_gear1"></span> </td>
                    </tr>
                    <tr>
                        <td><span class="num">2</span> <span class="dsf dsf_gear2"></span></td>
                    </tr>
                    <tr>
                        <td><span class="num">3</span></span> <span class="dsf dsf_gear3"></span></td>
                    </tr>
                    <tr>
                        <td><span class="num">4</span> <span class="dsf dsf_gear4"></span></td>
                    </tr>
                    <tr>
                        <td><span class="num">5</span> <span class="dsf dsf_gear5"></span></td>
                    </tr>
                    <tr>
                        <td><span class="num">6</span> <span class="dsf dsf_gear6"></span></td>
                    </tr>
                    <tr>
                        <td><span class="num">7</span> <span class="dsf dsf_gear7"></span></td>
                    </tr>
                    
                </table>
          
           

              

                 <table class="name">
                    <tr><td><strong>Armor:</strong> <span class="dsf dsf_armor"></span></td></tr>
                </table>

            </div>

      </div>
      </div>

<div class="bio"><span class="dsf dsf_avatar_image"></span><span class="dsf dsf_bio"><span></div>
<div class="extrainfo"> Player:<span class="dsf dsf_player"></span>, Campaign: <span class="dsf dsf_campaign"></span>,  Sheet created by:<span class="dsf dsf_dst_author"></span> </div>

</div>

CSS

.coriolis-sheet table {border: 2px solid black; width: 100%; margin-bottom: 15px;}
  .coriolis-sheet .attributes td:last-child {width:20%}
  .coriolis-sheet td,  .coriolis-sheet th {padding: 7px; height: 30px; }
  .coriolis-sheet td {border-bottom: 1px dotted #AAA}
  .coriolis-sheet th {border-bottom: 1px solid black}
  .coriolis-sheet .skills td {width:50%}
  .coriolis-sheet .skills .dsf {float: right;}
  .coriolis-sheet .critinj {border-bottom: none; font-size: 10px; height: 15px; padding-top:0;}
  .coriolis-sheet .condit {font-size: 10px}
  .coriolis-sheet .bio {overflow: overlay; margin-top: 20px;}
  .coriolis-sheet .num, .coriolis-sheet .relationships strong {font-size:10px; margin-bottom: 5px; height: 20px; vertical-align: top;}

.dsf_avatar_image {display:block; float:right; max-width:25%;}
.extrainfo {font-size:10px}

.editable .dynamic_sheet_html_template .dsf {background-color:#FFFF66;}

 .coriolis-sheet .container {
    width: 100%;
    max-width: 1140px;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

 .coriolis-sheet .myzrow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

 .coriolis-sheet .col-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

 .coriolis-sheet .col-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

 .coriolis-sheet .col-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}


.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

 .coriolis-sheet {
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fff;
}

 .coriolis-sheet *,  .coriolis-sheet ::after,  .coriolis-sheet ::before {
    box-sizing: border-box;
}

@media only screen  and  (max-width: 600px) {
     .coriolis-sheet .col-8, .coriolis-sheet .col-4  {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

Javascript

Back

Coriolis standard

Create Your Campaign

Just One More Step

Just A Little More Info

Use a Social Account