User:Plok 1993/myskin.css: Difference between revisions

From MediaWiki
Jump to navigationJump to search
Plok 1993 (talk | contribs)
No edit summary
Plok 1993 (talk | contribs)
behold, plok's myskin v2
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&family=Keania+One&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&family=Keania+One&display=swap');
    @import url('https://file.garden/Zver7X6UyWRXW2w6/webfontkit-20241228-000155/stylesheet.css');  


body{
body{
    font-family: "Atkinson Hyperlegible";
     max-width:1280px;
     max-width:1280px;
     background-color:#34363C;
     background-color:#566963;
    color:#DCDCDC;
     margin:auto;
     margin:auto;
    font-family: arial, sans-serif;
}
}


    /*The Big Ones*/
   
#globalWrapper{
#globalWrapper{
     background-color:#5C6068;
     background-color:#d1e8dd;
}
     box-shadow: 0px 0px 21px 5px #000000;
 
.firstHeading {
     font-family:"Keania One";
        border-bottom:.234375vw solid #8d8d8d;
}
#contentSub{    border-top:.234375vw solid #8d8d8d;    }
 
#siteSub{
    color:#00000000;
    background-image:url(https://files.catbox.moe/gpwztl.png);
    height:50px;
    background-repeat: repeat-x;
  background-position: 0 center;
  background-size: contain;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-animation: 16s linear infinite;
  animation: 16s linear infinite slideToLeftPC;
}
 
#title-factionicons > div {
  background-color: #00000000;
  filter: drop-shadow(9px 9px 0px #000000);
}
}
   
#contentSub{    border-top:.234375vw solid #05001F;    }


    #bodyContent{
        padding:0px;
    }
#column-content{
#column-content{
     float: right;
     float: right;
     width:75%;
     width:75%;
    height:inherit;
}
}


#column-one{
#column-one{
     float: left;
     float: left;
     width:24%;
     width:20%;
    background-color:#96b1a9;
    box-shadow: 2px 0px 19px 1px rgba(0,0,0,0.75);
    position: absolute;
    flex-direction: column;
    }
   
        /*Title stuff—the title (duh), factions, the suite, the subtitle that always says 'From Transformers Wiki'*/
.firstHeading {
    font-family: 'bitdust_tworegular';
    color:#FFF;
    margin:0px;
    padding:5vh 0vh 2vh 1vw;
    background:url('https://c4.wallpaperflare.com/wallpaper/646/587/585/connection-background-shape-sheet-wallpaper-preview.jpg');
    }
 
    .firstHeading > span{
        filter: drop-shadow(3px 3px 0px #000000);
    }
   
    #title-factionicons > div {
      background-color: #00000000;
      filter: drop-shadow(3px 3px 0px #000000);
    }
   
    .tt1_suite{
        background-color:#fff;
        box-shadow: inset 2px 2px 5px 1px rgba(0, 56, 16, .39);
        line-height:1.25;
        border-radius:0px;
    }
/*i wish i could make it mobile-friendly but there isn't any <meta>
@media screen and (max-width:800px) {
    #column-one, #column-content{
        float: none;
        clear: both;
    }
}
}
    */
    /*Table of Contents*/
    #toc{
        box-shadow:inset 0px 1px 3px 0px #91b8b3;
background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
background-color:#768d87;
border:1px solid #566963;
display:inline-block;
cursor:pointer;
color:#000;
font-size:15px;
       
padding:5px;
    padding-top:0px;
text-decoration:none;
text-shadow:0px -1px 0px #2b665e;
    }
   
    .toctoggle{
        font-family: 'bitdust_tworegular';
        text-align:left;
    }
   
    .tocnumber, .toctext, #togglelink{
       
    }
   
    .tocnumber{
        color:#566963;
        font-family: 'bitdust_tworegular';
    }
   
    .toctext, #togglelink{
        color:#000;
    }
    #toc a{
        text-decoration:none;
    }


@-webkit-keyframes slideToLeftPC {
    #toc ul{
    0% {
        list-style-type: none;
         background-position: 0vw center
        background-color:#fff;
        padding:1vh;
        top:5px;
        color:#000;
         line-height: 1.5;
     }
     }
 
   
     6.24999% {
        #toctitle h2{
         background-position: 0vw center
        color:black;
            margin-top:0px;
            font-size:20px;
            text-align:center;
            font-family: 'bitdust_tworegular';
    }
   
        /*Text*/
      
    p{
        line-height: 1.6;
    }
   
    dd{
        margin-bottom:3vh;
    }
   
    /*Links*/
    a{
        text-decoration:none;
        font-style:italic;
    }
    a:link{
        font-weight:bold;
        color:#3a4844;
    }
   
    a:hover{
         text-decoration:underline
     }
     }
 
   
     6.25% {
     a:active{
         background-position: -1.4379882813vw center
         color:#fff;
     }
     }
 
   
     12.49999% {
     a:visited{
         background-position: -1.4379882813vw center
         font-weight:normal;
        font-style:normal;
        color:#566963;
     }
     }
 
   
     12.5% {
     .quote{
         background-position: -2.8759765625vw center
         font-family: 'bitdust_tworegular';
     }
     }
 
   
     18.74999% {
     .tt1_storylink{
         background-position: -2.8759765625vw center
         background-color:#91b8b3;
        border:none;
     }
     }
 
   
     18.75% {
     .tt1_storylink > a{
         background-position: -4.3139648438vw center
         color:#000;
     }
     }
   
    /*Thumbs*/


     24.99999% {
     .thumb{
         background-position: -4.3139648438vw center
         background: #fff;
        padding: 2vh;
        border-radius:2vh;
        border:2px solid #566963;
        border-bottom:2px;
        margin:1vh
     }
     }
 
   
     25% {
     .tright{
         background-position: -5.751953125vw center
         margin-right:1vw;
     }
     }
 
   
     31.24999% {
     .thumbcaption{
         background-position: -5.751953125vw center
         margin:1vh 0vh 0vh 0vh;
     }
     }
 
   
     31.25% {
    /*Portlets - generated because I dpon't feel like creating one myself*/
         background-position: -7.1899414063vw center
     .pBody{
        font-family: 'Arial';
         background-color:#fff;
        box-shadow: inset 2px 2px 5px 1px rgba(0, 56, 16, .39);
        padding:1px;
       
     }
     }
 
     .portlet{
     37.49999% {
        font-family: 'bitdust_tworegular';
         background-position: -7.1899414063vw center
        box-shadow:inset 0px 1px 3px 0px #91b8b3;
        background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
         background-color:#768d87;
        border:1px solid #566963;
        display:inline-block;
        cursor:pointer;
        color:#20322c;
        font-size:15px;
        text-shadow:0px -1px 0px #2b665e;
        margin:1vw;
        width:18vw;
     }
     }
 
     .portlet > h5{
     37.5% {
         margin:0px;
         background-position: -8.6279296875vw center
        margin-bottom:0.5vh;
        font-size:15px;
        padding:0.5vh 1vh;
     }
     }
 
     .portlet li{
     43.74999% {
      list-style: none;
        background-position: -8.6279296875vw center
      border-bottom: 1px solid #566963;
      display: block;
      margin: 0;
      padding: 2px 5px;
     }
     }
 
     .portlet a{
     43.75% {
          font-family: 'bitdust_tworegular';
        background-position: -10.0659179688vw center
      font-weight:100;
      text-decoration:none;
    color:#000;
     }
     }
 
     .portlet ul{
     49.99999% {
      margin: 0;
        background-position: -10.0659179688vw center
      padding:0;
     }
     }
 
     .portlet a:visited{
     50% {
      color:#6d9286;
        background-position: -11.50390625vw center
     }
     }
 
   
     56.24999% {
     #searchBody{
         background-position: -11.50390625vw center
         padding:1vh
     }
     }
 
   
     56.25% {
    /*Footer*/
         background-position: -12.9418945313vw center
   
     #footer{
         background-color:#566963;
        padding:1vh;
       
     }
     }
 
     #footer li{
     62.49999% {
         list-style-type:none;
         background-position: -12.9418945313vw center
        display: inline;
     }
     }
 
     #footer a{
     62.5% {
         color:white;
         background-position: -14.3798828125vw center
        text-decoration:none;
     }
     }
 
     #f-list{
     68.74999% {
            text-align:center;
         background-position: -14.3798828125vw center
         font-family: 'bitdust_tworegular';
     }
     }
 
     #f-copyrightico, #f-poweredbyico{
     68.75% {
         float:left;
         background-position: -15.8178710938vw center
     }
     }
 
   
     74.99999% {
    /*Misc*/
         background-position: -15.8178710938vw center
   
     ul#filetoc{
         background:none;
        border:none;
     }
     }
 
   
     75% {
     h2{
         background-position: -17.255859375vw center
         border-bottom:2px solid #566963;
     }
     }
 
   
     81.24999% {
     #sitesub, h2, h3{
         background-position: -17.255859375vw center
         font-family: 'bitdust_tworegular';
     }
     }
 
   
     81.25% {
     .tt1_featuredCharacters{
         background-position: -18.6938476563vw center
         width:40vw
     }
     }
 
   
     87.49999% {
     #mw-normal-catlinks{
         background-position: -18.6938476563vw center
         background-color:#96b1a9;
    box-shadow: 2px 0px 19px 1px rgba(0,0,0,0.75);
        margin:0;
        margin-top:10px;
        padding:2vh;
        width:1280px;
        position: relative;
        right:340px;
        overflow:hidden;
     }
     }
 
   
     87.5% {
     .editsection{
         background-position: -20.1318359375vw center
         font-size:15px
     }
     }
 
   
    93.74999% {
        #preftoc li{
         background-position: -20.1318359375vw center
         list-style-type:none;
        display: inline;
     }
     }
 
     ul#preftoc{
     93.75% {
         padding:0px;
         background-position: -21.5698242188vw center
     }
     }
 
   
     99.99999% {
     #preftoc a, ul#filetoc a {
         background-position: -21.5698242188vw center
        margin:0.5vh;
        box-shadow:inset 0px 1px 3px 0px #91b8b3;
        background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
         background-color:#768d87;
        border-radius:5px;
        border:1px solid #566963;
        display:inline-block;
        cursor:pointer;
        color:#ffffff;
        font-family:Arial;
        font-size:15px;
        font-weight:bold;
        padding:5px 23px;
        text-decoration:none;
        text-shadow:0px -1px 0px #2b665e;
     }
     }
 
   
     100% {
     input[type=submit]{
        background-position: -23.0078125vw center
            box-shadow:inset 0px 1px 3px 0px #91b8b3;
            background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
            background-color:#768d87;
            border-radius:5px;
            border:1px solid #566963;
            cursor:pointer;
            color:#ffffff;
            font-family:Arial;
            font-size:15px;
            font-weight:bold;
            text-decoration:none;
            text-shadow:0px -1px 0px #2b665e;
     }
     }
}

Latest revision as of 03:31, 30 December 2024

    @import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&family=Keania+One&display=swap');
    @import url('https://file.garden/Zver7X6UyWRXW2w6/webfontkit-20241228-000155/stylesheet.css'); 

body{
    max-width:1280px;
    background-color:#566963;
    margin:auto;
    font-family: arial, sans-serif;
}

    /*The Big Ones*/
    
#globalWrapper{
    background-color:#d1e8dd;
    box-shadow: 0px 0px 21px 5px #000000;
}
    
#contentSub{    border-top:.234375vw solid #05001F;    }

    #bodyContent{
        padding:0px;
    }
#column-content{
    float: right;
    width:75%;
    height:inherit;
}

#column-one{
    float: left;
    width:20%;
    background-color:#96b1a9;
    box-shadow: 2px 0px 19px 1px rgba(0,0,0,0.75);
    position: absolute;
    flex-direction: column;
    }
    
        /*Title stuff—the title (duh), factions, the suite, the subtitle that always says 'From Transformers Wiki'*/
.firstHeading {
    font-family: 'bitdust_tworegular';
    color:#FFF;
    margin:0px;
    padding:5vh 0vh 2vh 1vw;
    background:url('https://c4.wallpaperflare.com/wallpaper/646/587/585/connection-background-shape-sheet-wallpaper-preview.jpg');
    }

    .firstHeading > span{
        filter: drop-shadow(3px 3px 0px #000000);
    }
    
    #title-factionicons > div {
      background-color: #00000000;
      filter: drop-shadow(3px 3px 0px #000000);
    }
    
    .tt1_suite{
        background-color:#fff;
        box-shadow: inset 2px 2px 5px 1px rgba(0, 56, 16, .39);
        line-height:1.25;
        border-radius:0px;
    }
/*i wish i could make it mobile-friendly but there isn't any <meta>
@media screen and (max-width:800px) {
    #column-one, #column-content{
        float: none;
        clear: both;
    }
}
    */
    /*Table of Contents*/
    #toc{
        	box-shadow:inset 0px 1px 3px 0px #91b8b3;
	background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
	background-color:#768d87;
	border:1px solid #566963;
	display:inline-block;
	cursor:pointer;
	color:#000;
	font-size:15px;
        
	padding:5px;
    padding-top:0px;
	text-decoration:none;
	text-shadow:0px -1px 0px #2b665e;
    }
    
    .toctoggle{
        font-family: 'bitdust_tworegular';
        text-align:left;
    }
    
    .tocnumber, .toctext, #togglelink{
        
    }
    
    .tocnumber{
        color:#566963;
        font-family: 'bitdust_tworegular';
    }
    
    .toctext, #togglelink{
        color:#000;
    }
    #toc a{
        text-decoration:none;
    }

    #toc ul{
        list-style-type: none;
        background-color:#fff;
        padding:1vh;
        top:5px;
        color:#000;
        line-height: 1.5;
    }
    
        #toctitle h2{
        color:black;
            margin-top:0px;
            font-size:20px;
            text-align:center;
            font-family: 'bitdust_tworegular';
    }
    
        /*Text*/
    
    p{
        line-height: 1.6;
    }
    
    dd{
        margin-bottom:3vh;
    }
    
    /*Links*/
    a{
        text-decoration:none;
        font-style:italic;
    }
    a:link{
        font-weight:bold;
        color:#3a4844;
    }
    
    a:hover{
        text-decoration:underline
    }
    
    a:active{
        color:#fff;
    }
    
    a:visited{
        font-weight:normal;
        font-style:normal;
        color:#566963;
    }
    
    .quote{
        font-family: 'bitdust_tworegular';
    }
    
    .tt1_storylink{
        background-color:#91b8b3;
        border:none;
    }
    
    .tt1_storylink > a{
        color:#000;
    }
    
    /*Thumbs*/

    .thumb{
        background: #fff;
        padding: 2vh;
        border-radius:2vh;
        border:2px solid #566963;
        border-bottom:2px;
        margin:1vh
    }
    
    .tright{
        margin-right:1vw;
    }
    
    .thumbcaption{
        margin:1vh 0vh 0vh 0vh;
    }
    
    /*Portlets - generated because I dpon't feel like creating one myself*/
    .pBody{
        font-family: 'Arial';
        background-color:#fff;
        box-shadow: inset 2px 2px 5px 1px rgba(0, 56, 16, .39);
        padding:1px;
        
    }
    .portlet{
        font-family: 'bitdust_tworegular';
        box-shadow:inset 0px 1px 3px 0px #91b8b3;
        background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
        background-color:#768d87;
        border:1px solid #566963;
        display:inline-block;
        cursor:pointer;
        color:#20322c;
        font-size:15px;
        text-shadow:0px -1px 0px #2b665e;
        margin:1vw;
        width:18vw;
    }
    .portlet > h5{
        margin:0px;
        margin-bottom:0.5vh;
        font-size:15px;
        padding:0.5vh 1vh;
    }
    .portlet li{
      list-style: none;
      border-bottom: 1px solid #566963;
      display: block;
      margin: 0;
      padding: 2px 5px;
    }
    .portlet a{
          font-family: 'bitdust_tworegular';
      font-weight:100;
      text-decoration:none;
    color:#000;
    }
    .portlet ul{
      margin: 0;
      padding:0;
    }
    .portlet a:visited{
      color:#6d9286;
    }
    
    #searchBody{
        padding:1vh
    }
    
    /*Footer*/
    
    #footer{
        background-color:#566963;
        padding:1vh;
        
    }
    #footer li{
        list-style-type:none;
        display: inline;
    }
    #footer a{
        color:white;
        text-decoration:none;
    }
    #f-list{
            text-align:center;
        font-family: 'bitdust_tworegular';
    }
    #f-copyrightico, #f-poweredbyico{
        float:left;
    }
    
    /*Misc*/
    
    ul#filetoc{
        background:none;
        border:none;
    }
    
    h2{
        border-bottom:2px solid #566963;
    }
    
    #sitesub, h2, h3{
        font-family: 'bitdust_tworegular';
    }
    
    .tt1_featuredCharacters{
        width:40vw
    }
    
    #mw-normal-catlinks{
        background-color:#96b1a9;
    box-shadow: 2px 0px 19px 1px rgba(0,0,0,0.75);
        margin:0;
        margin-top:10px;
        padding:2vh;
        width:1280px;
        position: relative;
        right:340px;
        overflow:hidden;
    }
    
    .editsection{
        font-size:15px
    }
    
        #preftoc li{
        list-style-type:none;
        display: inline;
    }
    ul#preftoc{
        padding:0px;
    }
    
    #preftoc a, ul#filetoc a {
        margin:0.5vh;
        box-shadow:inset 0px 1px 3px 0px #91b8b3;
        background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
        background-color:#768d87;
        border-radius:5px;
        border:1px solid #566963;
        display:inline-block;
        cursor:pointer;
        color:#ffffff;
        font-family:Arial;
        font-size:15px;
        font-weight:bold;
        padding:5px 23px;
        text-decoration:none;
        text-shadow:0px -1px 0px #2b665e;
    }
    
    input[type=submit]{
            box-shadow:inset 0px 1px 3px 0px #91b8b3;
            background:linear-gradient(to bottom, #768d87 5%, #6c7c7c 100%);
            background-color:#768d87;
            border-radius:5px;
            border:1px solid #566963;
            cursor:pointer;
            color:#ffffff;
            font-family:Arial;
            font-size:15px;
            font-weight:bold;
            text-decoration:none;
            text-shadow:0px -1px 0px #2b665e;
    }