Zd10 Wiki
Template:Trigate Major Sophont Summary: Difference between revisions

Template:Trigate Major Sophont Summary: Difference between revisions

Template page
No edit summary
No edit summary
Tag: Reverted
Line 1: Line 1:
<includeonly>
/* Tooltips
    <templatestyles src="Trigate_Major_Sophont_Summary/styles.css" />
**************************************************************/
    <div class="infobox">
.tooltipcursor {
    <div class="summary_header">Summary</div>
cursor: help;
        <table class="table" id="trigate_major_sophont_summary">
}
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align: middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Status</span></td>
                <td style="color: {{{factioncolor}}}; align: center;"> <img src="{{{image}}}" style="width: 128px; height: 128px;" class="tooltipcursor tooltip" title="{{{status}}}" /> </td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Xenonym</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{xenonym}}}</td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Autonym</span></td>
                <td style="vertical-align:middle; font-weight: bold; font-style: oblique;">{{{autonym}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Home Plane</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{homeplane}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Race Type</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{type}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Lifespan</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{lifespan}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Height Data</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{height}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Weight Data</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{weight}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr style="text-align:left;vertical-align:middle">
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">{{{skintype}}} Colors</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{skincolors}}}</td>
            </tr>
            <tr>
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">{{{hairtype}}} Colors</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{haircolors}}}</td>
            </tr>
            <tr>
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Eye Colors</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{eyecolors}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr>
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Physical Distinctions</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{distinctions}}}</td>
            </tr>
            <tr>
                <td class="table_noborder" colspan="2" style="padding: 0.5rem 0px 0.5rem 0px;"></td>
            </tr>
            <tr>
                <td style="vertical-align:middle; font-weight: bold;"><span style="vertical-align:middle;padding-right:2.5rem;">Properties</span></td>
                <td style="vertical-align:middle; font-style: oblique;">{{{properties}}}</td>
            </tr>
        </table>
    </div>
</includeonly>


<noinclude>
.tooltip {
     <pre>
text-decoration-line: underline;
         {{Trigate Major Race Summary
text-decoration-style: dotted;
         |image            = enter the link to an image here as [[Image:imagename|thumb]]
text-decoration-skip-ink: auto;
         |xenonym          = enter the actual name of the race (e.g. Karayib Elf, etc.) [Xenonym = Foreign Name]
font-weight: bold;
         |autonym          = enter the names that the race refers to themselves as [Autonym = Self Name]
}
         |factioncolor     = enter the color for the faction (e.g. #598CBF)
 
         |bgcolor          = enter hex code to use for table's colored backgrounds (e.g. #77bbff)
/* Infobox
         |status          = enter the race's standing with the council or other status
**************************************************************/
         |homeplane        = enter the race's home plane
div.mw-parser-output > div.infobox {
         |type            = enter the race's types (mammalian, reptilian, etc, with subtype, elf, etc)
min-width: 316px;
         |lifespan         = enter the race's typical lifespan, and periods (e.g. child, mature, elder, etc.)
max-width: 28vw;
         |height          = enter the race's average height, followed by min/max
box-sizing: border-box;
         |weight           = enter the race's average weight, followed by min/max
margin: 0 0.2rem 0.4rem 1.4rem;
         |skintype         = type of skin (skin, bark, scales, shell, etc.)
background-color: var( --color-surface-1 );
         |skincolors      = colors of skin type
border-radius: var( --border-radius--medium );
         |hairtype         = type of hair (hair, feathers, leaves, etc.)
box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.03 ), 0 1px 2px rgba( 0, 0, 0, 0.06 );
         |haircolors      = colors of hair type
font-size: 0.875rem;
         |eyecolors        = eye colors
transition: box-shadow 0.2s ease;
         |distinctions     = enter appearance distinctions here
clear: right;
         |properties      = link to the SemanticWiki properties page
float: right;
         }}
overflow: hidden;
     </pre>
 
</noinclude>
    &:first-child {
        margin-top: 0;
    }
     &:last-child {
         margin-bottom: 0;
    }
    &:hover {
    box-shadow: 0 10px 20px rgba( 0, 0, 0, 0.0475 ), 0 6px 6px rgba( 0, 0, 0, 0.0575 );
    }
   
    table.trigate_major_sophont_summary {
         background: none;
         margin: 1.25rem auto auto auto;
 
        tr.even, tr.alt, tr:nth-of-type(even) {
            background: none;
        }
 
         td:first-child {
            border-right: 0.1em solid #ccc;
        }
 
        td.table_noborder {
            border-right: none;
         }
 
    }
 
    /* Summary Header
     **************************************************************/
    & > div.summary_header {
        background-attachment: scroll, scroll;
        background-clip: border-box, border-box;
        background-color: rgba(0, 0, 0, 0);
         background-image: linear-gradient( to right, rgba(255, 255, 255, 0), rgb(255, 255, 255) ), url(https://www.zd10.net/images/mediawiki/summary_header.jpg);
         background-origin: padding-box, padding-box;
         background-position-x: 0%, 30%;
         background-position-y: 0%, 60%;
        background-size: auto, auto;
        box-sizing: border-box;
        color: var(--color-base--emphasized);
        cursor: auto;
        direction: ltr;
        display: flex;
        font-size: 40px;
        font-style: normal;
        font-weight: 600;
        height: 70px;
        line-height: 40px;
        margin-block-end: 16px;
        margin-block-start: 0px;
        margin-bottom: 16px;
        margin-inline-end: 0px;
        margin-inline-start: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        padding-bottom: 15px;
        padding-left: 75px;
        padding-right: 25px;
        padding-top: 15px;
        position: relative;
        text-align: left;
        text-rendering: optimizelegibility;
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
        text-size-adjust: 100%;
    }
}
 
@media screen and (max-width: 960px) {
    div.mw-parser-output > div.infobox {
        float: none;
        clear: right;       
         margin: 0 auto 0.4rem auto;
         max-width: 100%;
    }
}
 
/* Blockquotes
**************************************************************/
@media screen and (max-width: 960px) {
    div.mw-parser-output > blockquote {
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
    }
}
 
div.mw-parser-output > blockquote {
min-width: 8vw;
margin: 0 0 1.25rem;
padding: 0.5625rem 1.25rem 0 1.1875rem;
border-left: 1px solid #DDDDDD;
background-color: var(--color-surface-1);
border-radius: var(--border-radius--medium);
box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.03 ), 0 1px 2px rgba( 0, 0, 0, 0.06 );
transition: box-shadow 0.2s ease;
 
    cite {
        display: block;
        font-size: 0.8125rem;
       
        &:before {
            content: "\2014 \0020";
        }
 
         p {
            line-height: 1.6;
        }
    }
 
    &.zak_blockquote {
        display: flex;
        flex-flow: column wrap;
        padding: 15px 20px 15px 45px;
        margin: 0 0 20px;
        position: relative;
        color: var(--color-base);
        /* font-family: Merriweather, serif; */
         line-height: 1.2;
        text-align: justify;
        border-left: 15px solid #697060;
 
        &:before {
        content: "\201C"; /*Unicode for Left Double Quote*/
            font-family: Italic Times, serif;
            font-size: 60px;
            font-weight: bold;
            color: var(--color-base);
            position: absolute;
            left: 10px;
            top: 5px;
        }
 
        &:after {
        /*Reset to make sure*/
        content: "";
         }
 
         &:hover {
            box-shadow: 0 10px 20px rgba( 0, 0, 0, 0.0475 ), 0 6px 6px rgba( 0, 0, 0, 0.0575 );
        }
 
        em {
        font-style: oblique;
        }
 
        cite {
            display: block;
            margin-top: 5px;
            font-size: 1.1em;
 
            &:before {
            content: "\2014 \2009";
            }
        }
   
        * {
    font-size: 0.8em;
        }
    }
 
    /* Faction Specific Overrides for Blockquotes
    **************************************************************/
 
    &.zak_blockquote_council {
        /*Borders - (Optional)*/
         border-left: 15px solid #77bbff;
    }
 
    &.zak_blockquote_friendly_third_party {
        /*Borders - (Optional)*/
        border-left: 15px solid #a2bc13;
    }
 
    &.zak_blockquote_neutral_third_party {
        /*Borders - (Optional)*/
        border-left: 15px solid #bdb76b;
    }
 
    &.zak_blockquote_aggressive_third_party {
        /*Borders - (Optional)*/
        border-left: 15px solid #eead0e;
    }
 
    &.zak_blockquote_recreancy {
        /*Borders - (Optional)*/
        border-left: 15px solid #db2645;
    }
 
    /* Concept Specific Overrides for Blockquotes
    **************************************************************/
 
    &.zak_blockquote_concept_mc {
        /*Borders - (Optional)*/
        border-left: 15px solid #8f4700;
    }
 
    &.zak_blockquote_concept_rc {
        /*Borders - (Optional)*/
        border-left: 15px solid #5cacee;
    }
 
    &.zak_blockquote_concept_tog {
        /*Borders - (Optional)*/
        border-left: 15px solid #64627f;
    }
 
    &.zak_blockquote_concept_mu {
        /*Borders - (Optional)*/
        border-left: 15px solid #adadad;
    }
 
    &.zak_blockquote_concept_potd {
        /*Borders - (Optional)*/
        border-left: 15px solid #ffcc00;
    }
 
    &.zak_blockquote_concept_motm {
         /*Borders - (Optional)*/
         border-left: 15px solid #ff0066;
    }
 
    &.zak_blockquote_concept_sn {
        /*Borders - (Optional)*/
        border-left: 15px solid #3385dd;
    }
 
    &.zak_blockquote_concept_mm {
        /*Borders - (Optional)*/
         border-left: 15px solid #006b6b;
    }
 
    &.zak_blockquote_concept_tot {
         /*Borders - (Optional)*/
         border-left: 15px solid #ff3300;
     }
 
    &.zak_blockquote_concept_eaa {
         /*Borders - (Optional)*/
         border-left: 15px solid #00b200;
    }
 
    &.zak_blockquote_concept_dbd {
        /*Borders - (Optional)*/
        border-left: 15px solid #6600cc;
    }
 
     &.zak_blockquote_concept_ooo {
        /*Borders - (Optional)*/
        border-left: 15px solid #000000;
    }
 
    &.zak_blockquote_concept_h {
        /*Borders - (Optional)*/
        border-left: 15px solid #d3d3d3;
    }
}

Revision as of 22:27, 6 August 2022

/* Tooltips

                                                                                                                            • /

.tooltipcursor { cursor: help; }

.tooltip { text-decoration-line: underline; text-decoration-style: dotted; text-decoration-skip-ink: auto; font-weight: bold; }

/* Infobox

                                                                                                                            • /

div.mw-parser-output > div.infobox { min-width: 316px; max-width: 28vw; box-sizing: border-box; margin: 0 0.2rem 0.4rem 1.4rem; background-color: var( --color-surface-1 ); border-radius: var( --border-radius--medium ); box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.03 ), 0 1px 2px rgba( 0, 0, 0, 0.06 ); font-size: 0.875rem; transition: box-shadow 0.2s ease; clear: right; float: right; overflow: hidden; 

   &:first-child {
       margin-top: 0; 
   }
   &:last-child {
       margin-bottom: 0; 
   }
   &:hover {

box-shadow: 0 10px 20px rgba( 0, 0, 0, 0.0475 ), 0 6px 6px rgba( 0, 0, 0, 0.0575 ); 

   }
   
   table.trigate_major_sophont_summary {
       background: none;
       margin: 1.25rem auto auto auto;

       tr.even, tr.alt, tr:nth-of-type(even) {
           background: none;
       }

       td:first-child {
           border-right: 0.1em solid #ccc;
       }

       td.table_noborder {
           border-right: none;
       }

   }

   /* Summary Header
   **************************************************************/
   & > div.summary_header {
       background-attachment: scroll, scroll;
       background-clip: border-box, border-box;
       background-color: rgba(0, 0, 0, 0);
       background-image: linear-gradient( to right, rgba(255, 255, 255, 0), rgb(255, 255, 255) ), url(summary_header.jpg);
       background-origin: padding-box, padding-box;
       background-position-x: 0%, 30%;
       background-position-y: 0%, 60%;
       background-size: auto, auto;
       box-sizing: border-box;
       color: var(--color-base--emphasized);
       cursor: auto;
       direction: ltr;
       display: flex;
       font-size: 40px;
       font-style: normal;
       font-weight: 600;
       height: 70px;
       line-height: 40px;
       margin-block-end: 16px;
       margin-block-start: 0px;
       margin-bottom: 16px;
       margin-inline-end: 0px;
       margin-inline-start: 0px;
       margin-left: 0px;
       margin-right: 0px;
       margin-top: 0px;
       padding-bottom: 15px;
       padding-left: 75px;
       padding-right: 25px;
       padding-top: 15px;
       position: relative;
       text-align: left;
       text-rendering: optimizelegibility;
       text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
       text-size-adjust: 100%;
   }

}

@media screen and (max-width: 960px) { 

   div.mw-parser-output > div.infobox {
       float: none;
       clear: right;        
       margin: 0 auto 0.4rem auto;
       max-width: 100%;
   }

}

/* Blockquotes

                                                                                                                            • /

@media screen and (max-width: 960px) { 

   div.mw-parser-output > blockquote {
       margin-left: auto;
       margin-right: auto;
       max-width: 100%;
   }

}

div.mw-parser-output > blockquote { min-width: 8vw; margin: 0 0 1.25rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #DDDDDD; background-color: var(--color-surface-1); border-radius: var(--border-radius--medium); box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.03 ), 0 1px 2px rgba( 0, 0, 0, 0.06 ); transition: box-shadow 0.2s ease; 

   cite {
       display: block;
       font-size: 0.8125rem; 
       
       &:before {
           content: "\2014 \0020"; 
       }

       p {
           line-height: 1.6; 
       }
   }

   &.zak_blockquote {
       display: flex;
       flex-flow: column wrap;
       padding: 15px 20px 15px 45px;
       margin: 0 0 20px;
       position: relative;
       color: var(--color-base);
       /* font-family: Merriweather, serif; */
       line-height: 1.2;
       text-align: justify;
       border-left: 15px solid #697060;

       &:before {

content: "\201C"; /*Unicode for Left Double Quote*/ 

           font-family: Italic Times, serif;
           font-size: 60px;
           font-weight: bold;
           color: var(--color-base);
           position: absolute;
           left: 10px;
           top: 5px;
       }

       &:after {

/*Reset to make sure*/ content: ""; 

       }

       &:hover {
           box-shadow: 0 10px 20px rgba( 0, 0, 0, 0.0475 ), 0 6px 6px rgba( 0, 0, 0, 0.0575 );
       }

       em {

font-style: oblique; 

       }

       cite {
           display: block;
           margin-top: 5px;
           font-size: 1.1em;

           &:before {

content: "\2014 \2009"; 

           }
       }
   
       * {

font-size: 0.8em; 

       }
   }

   /* Faction Specific Overrides for Blockquotes
   **************************************************************/

   &.zak_blockquote_council {
       /*Borders - (Optional)*/
       border-left: 15px solid #77bbff;
   }

   &.zak_blockquote_friendly_third_party {
       /*Borders - (Optional)*/
       border-left: 15px solid #a2bc13;
   }

   &.zak_blockquote_neutral_third_party {
       /*Borders - (Optional)*/
       border-left: 15px solid #bdb76b;
   }

   &.zak_blockquote_aggressive_third_party {
       /*Borders - (Optional)*/
       border-left: 15px solid #eead0e;
   }

   &.zak_blockquote_recreancy {
       /*Borders - (Optional)*/
       border-left: 15px solid #db2645;
   }

   /* Concept Specific Overrides for Blockquotes
   **************************************************************/

   &.zak_blockquote_concept_mc {
       /*Borders - (Optional)*/
       border-left: 15px solid #8f4700;
   }

   &.zak_blockquote_concept_rc {
       /*Borders - (Optional)*/
       border-left: 15px solid #5cacee;
   }

   &.zak_blockquote_concept_tog {
       /*Borders - (Optional)*/
       border-left: 15px solid #64627f;
   }

   &.zak_blockquote_concept_mu {
       /*Borders - (Optional)*/
       border-left: 15px solid #adadad;
   }

   &.zak_blockquote_concept_potd {
       /*Borders - (Optional)*/
       border-left: 15px solid #ffcc00;
   }

   &.zak_blockquote_concept_motm {
       /*Borders - (Optional)*/
       border-left: 15px solid #ff0066;
   }

   &.zak_blockquote_concept_sn {
       /*Borders - (Optional)*/
       border-left: 15px solid #3385dd;
   }

   &.zak_blockquote_concept_mm {
       /*Borders - (Optional)*/
       border-left: 15px solid #006b6b;
   }

   &.zak_blockquote_concept_tot {
       /*Borders - (Optional)*/
       border-left: 15px solid #ff3300;
   }

   &.zak_blockquote_concept_eaa {
       /*Borders - (Optional)*/
       border-left: 15px solid #00b200;
   }

   &.zak_blockquote_concept_dbd {
       /*Borders - (Optional)*/
       border-left: 15px solid #6600cc;
   }

   &.zak_blockquote_concept_ooo {
       /*Borders - (Optional)*/
       border-left: 15px solid #000000;
   }

   &.zak_blockquote_concept_h {
       /*Borders - (Optional)*/
       border-left: 15px solid #d3d3d3;
   }

}

Retrieved from "https://wiki.zd10.net/index.php?title=Template:Trigate_Major_Sophont_Summary&oldid=1578"
We collect cookies to analyze our website traffic and performance; we never collect any personal data.
Privacy policy