• Welcome to the Kancolle Wiki!
  • If you have any questions regarding site content, account registration, etc., please visit the KanColle Wiki Discord

Changes

Jump to navigation Jump to search

MediaWiki:Common.css (view source)

Revision as of 06:37, 12 January 2016

4,697 bytes added ,  8 years ago
massive CSS redo
Line 10: Line 10:  
/* CSS sheet for fp.html*/
 
/* CSS sheet for fp.html*/
    +
/* Separate from Common.CSS in order to make changes swift and easy? Debatable */
 
/*Primary Container*/
 
/*Primary Container*/
 
#widgetcontainer{
 
#widgetcontainer{
 
line-height:1.2 !important; /*MediaWiki resizes line height, destroying placements.*/
 
line-height:1.2 !important; /*MediaWiki resizes line height, destroying placements.*/
−
max-width:1446px;
+
max-width:1600px;
 
margin-left:auto;
 
margin-left:auto;
 
margin-right:auto; /*Mediawiki max space for 1080p is some 1600px*/
 
margin-right:auto; /*Mediawiki max space for 1080p is some 1600px*/
−
min-width:970px;
+
min-width:710px;
 
padding-left:18px;
 
padding-left:18px;
 +
/*height:918px;*/
 +
margin-bottom:2%;
 
}
 
}
 +
 
/*Column Settings*/
 
/*Column Settings*/
 
.rightcol{
 
.rightcol{
 
width:auto;
 
width:auto;
−
min-width:220px;
+
margin-right:4%;
−
max-width:750px;
+
margin-left:4%;
−
margin-right:0.5%;
+
float:left;
−
overflow:hidden;
+
height:auto;
 +
font-family: Arial, Helvetica, sans-serif;
 
}
 
}
 
.leftcol{
 
.leftcol{
 
width:710px;
 
width:710px;
−
margin:auto;
   
float:left;
 
float:left;
−
margin-right: 4%;
+
 +
margin-left:4%;
 
margin-bottom:1%;
 
margin-bottom:1%;
 
position:relative;
 
position:relative;
 
}
 
}
−
 
+
/* Misc Icons */
 +
#iconcluster {
 +
float:right;
 +
width:710px;
 +
height:70px;
 +
margin-top:14.4px;
 +
text-align: justify;
 +
    -ms-text-justify: distribute-all-lines;
 +
    text-justify: distribute-all-lines;
 +
margin-bottom:1%;
 +
}
 +
.portalicon {
 +
height:70px;
 +
width:160px;
 +
    vertical-align: top;
 +
    display: inline-block;
 +
    *display: inline;
 +
    zoom: 1;
 +
text-align:center;
 +
font-family: Arial, Helvetica, sans-serif;
 +
color:black;
 +
background-color:white;
 +
border-radius:10px;
 +
margin-bottom:1%;
 +
 +
-webkit-transition: all 0.2s ease-in-out;
 +
    -moz-transition: all 0.2s ease-in-out;
 +
    -o-transition: all 0.2s ease-in-out;
 +
    transition: all 0.2s ease-in-out;
 +
}
 +
.portalicon:hover {
 +
color:white;
 +
/*font-weight:bold;*/
 +
text-shadow:1px 1px 15px black;
 +
background-color:#3090c7;
 +
}
 +
.stretch {
 +
    width: 100%;
 +
    display: inline-block;
 +
    font-size: 0;
 +
    line-height: 0
 +
}
 +
#clustertitle {
 +
width:100%;
 +
background-color:#3090c7;
 +
border-radius:8px;
 +
text-align:center;
 +
padding-top:2px;
 +
padding-bottom:2px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-weight:bold;
 +
color:white;
 +
margin-bottom:14.4px;
 +
}
 +
/*More Misc Buttons, not a subcategory of quick links*/
 +
#infodiv {
 +
margin-top:2%;
 +
width:710px;
 +
height:200px;
 +
background:transparent url(skins/common/images/infobarbg.png) no-repeat;
 +
}
 +
#infoicons {
 +
padding-top:10px;
 +
padding-left:40px;
 +
padding-right:40px;
 +
position:relative;
 +
top:30px;
 +
height:124px;
 +
width:auto;
 +
}
 +
.questicon {
 +
float:left;
 +
width:100px;
 +
height:100px;
 +
border-radius:10px;
 +
margin-right:32px;
 +
background-color:#005e95;
 +
}
 +
.questicon:hover {
 +
background-color:#2886bd;
 +
}
 +
.infoicon {
 +
float:left;
 +
width:100px;
 +
height:100px;
 +
border-radius:10px;
 +
margin-right:32px;
 +
position: relative;
 +
    display: inline-block;
 +
background-color:#005e95;
 +
}
 +
.listdrop {
 +
display: none;
 +
    position: absolute;
 +
bottom:100px;
 +
    background-color: #555;
 +
    width: 100px;
 +
    box-shadow: 0px -8px 16px 0px rgba(0,0,0,0.2);
 +
    z-index: 1;
 +
font-family: Arial, Helvetica, sans-serif;
 +
text-align:center;
 +
font-size:14px;
 +
 +
border-top-left-radius:10px;
 +
border-top-right-radius:10px;
 +
overflow:hidden;
 +
}
 +
.listdrop .selbox {
 +
width:100px;
 +
color:white;
 +
background-color:#2886bd;
 +
padding-top:10px;
 +
padding-bottom:10px;
 +
 +
-webkit-transition: all 0.2s ease-in-out;
 +
    -moz-transition: all 0.2s ease-in-out;
 +
    -o-transition: all 0.2s ease-in-out;
 +
    transition: all 0.2s ease-in-out;
 +
}
 +
.listdrop .selbox:hover {
 +
color:black;
 +
background-color:#f9f9f9;
 +
}
 +
.infoicon:hover {
 +
background-color:#2886bd;
 +
 +
border-top-left-radius:0px;
 +
border-top-right-radius:0px;
 +
 +
}
 +
.infoicon:hover .listdrop {
 +
background-color:#2886bd;
 +
display:block;
 +
}
 +
.infotxt {
 +
padding-top:3px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
color:white;
 +
text-align:center;
 +
align:middle;
 +
width:auto;
 +
font-size:14px;
 +
}
 
/*Icon Triumvirate Styling*/
 
/*Icon Triumvirate Styling*/
 
#iconcontainer{
 
#iconcontainer{
Line 43: Line 190:  
overflow:hidden;
 
overflow:hidden;
 
border:0px solid #0099ff;
 
border:0px solid #0099ff;
−
border-radius:16px;
+
border-radius:8px;
−
border-bottom-right-radius:6px;
  −
border-top-left-radius:6px;
   
overflow:hidden;
 
overflow:hidden;
 
}
 
}
Line 164: Line 309:  
height:93px;
 
height:93px;
 
float:left;
 
float:left;
−
border-bottom-left-radius:16px;
+
border-bottom-left-radius:8px;
 
border-bottom-right-radius:8px;
 
border-bottom-right-radius:8px;
 
 
Line 179: Line 324:  
opacity: 1.0;
 
opacity: 1.0;
 
     filter: alpha(opacity=100); /* For IE8 and earlier */
 
     filter: alpha(opacity=100); /* For IE8 and earlier */
−
border-bottom-left-radius:16px;
+
border-bottom-left-radius:8px;
 
border-bottom-right-radius:8px;
 
border-bottom-right-radius:8px;
 
}
 
}
Line 185: Line 330:  
text-align:center;
 
text-align:center;
 
border:0px solid #a7d7f9;
 
border:0px solid #a7d7f9;
−
border-bottom-left-radius:16px;
+
border-bottom-left-radius:8px;
 
border-bottom-right-radius:8px;
 
border-bottom-right-radius:8px;
 
background:url(skins/common/images/noevban.png) no-repeat center center;
 
background:url(skins/common/images/noevban.png) no-repeat center center;
Line 202: Line 347:  
#eventinfo{
 
#eventinfo{
 
text-align:center;
 
text-align:center;
−
border-top-left-radius:4px;
+
border-top-left-radius:8px;
−
border-top-right-radius:16px;
+
border-top-right-radius:8px;
 
border:0px solid #b6b6b4;
 
border:0px solid #b6b6b4;
 
/*border-bottom:0px;*/
 
/*border-bottom:0px;*/
Line 345: Line 490:  
text-shadow:0px 0px 10px #FFB813;
 
text-shadow:0px 0px 10px #FFB813;
 
}
 
}
−
 
+
/* Twitter and Seasonals */
−
/*OBSOLETE*/
+
.twidget{
−
#twidget{
+
border:0px solid white;
−
border:2px solid white;
   
border-radius:4px;
 
border-radius:4px;
 
background-color:white;
 
background-color:white;
−
height:552px;
+
height:368px;
−
width:522px;
+
width:48%;
 
float:left;
 
float:left;
 +
}
 +
.seasonalbox {
 +
width:100%;
 +
height:200px;
 +
background: url(skins/common/images/seasonalbg.jpg) no-repeat;
 +
margin-right:0px;
 +
border-radius:8px;
 +
border-top-left-radius:0px;
 +
border-top-right-radius:0px;
 +
}
 +
.seasoncont {
 +
padding: 4px 4px 4px 4px;
 +
width:auto;
 +
height:auto;
 +
align:middle;
 +
text-align:center;
 
}
 
}
 
/*FactoryBox Div*/
 
/*FactoryBox Div*/
 
.factorybox{
 
.factorybox{
−
border-radius:16px;
+
border-radius:8px;
−
border-bottom-right-radius:6px;
  −
border-top-left-radius:6px;
   
width:710px;
 
width:710px;
 
height:170px;
 
height:170px;
Line 527: Line 685:  
 
 
border-radius:6px;
 
border-radius:6px;
−
background-color:#647077;
   
-webkit-transition: all 0.2s ease-in-out;
 
-webkit-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
Line 543: Line 700:  
height:20px;
 
height:20px;
 
border-radius:6px;
 
border-radius:6px;
−
background-color:#647077;
   
-webkit-transition: all 0.2s ease-in-out;
 
-webkit-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
Line 558: Line 714:  
 
 
border-radius:6px;
 
border-radius:6px;
−
background-color:#647077;
   
-webkit-transition: all 0.2s ease-in-out;
 
-webkit-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
Line 574: Line 729:  
 
 
border-radius:6px;
 
border-radius:6px;
−
background-color:#647077;
   
-webkit-transition: all 0.2s ease-in-out;
 
-webkit-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
Line 585: Line 739:  
color:white;
 
color:white;
 
border-radius:6px;
 
border-radius:6px;
−
background-color:#647077;
   
-webkit-transition: all 0.2s ease-in-out;
 
-webkit-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
 
     -moz-transition: all 0.2s ease-in-out;
Line 645: Line 798:  
/*Wiki Description*/
 
/*Wiki Description*/
 
#wikidesc{
 
#wikidesc{
−
border-radius:4px;
+
border-radius:8px;
−
border-top-left-radius:18px;
+
border-top-left-radius:16px;
−
border-bottom-right-radius:18px;
   
width:auto;
 
width:auto;
 
max-width:710px;
 
max-width:710px;
Line 653: Line 805:  
background-color:#3090c7;
 
background-color:#3090c7;
 
min-height:103px;
 
min-height:103px;
 +
margin-bottom:14.4px;
 
}
 
}
 
.craneicon{
 
.craneicon{
Line 676: Line 829:  
/*JP lang*/
 
/*JP lang*/
 
#nihontext{
 
#nihontext{
−
font-family: Yu Gothic, 遊ゴシック, Meiryo, メイリオ, Serif;
+
font-family: Yu Gothic, 遊ゴシック, Meiryo, メイリオ, Serif !important;
 
}
 
}
 
/*World div Addon*/
 
/*World div Addon*/
Line 691: Line 844:  
padding-bottom:5px;
 
padding-bottom:5px;
 
text-align:center;
 
text-align:center;
−
margin-top:15px;
   
width:auto;
 
width:auto;
 
height:auto;
 
height:auto;
 
background-color:#3090c7;
 
background-color:#3090c7;
−
border-top-right-radius:4px;
+
border-top-right-radius:8px;
−
border-top-left-radius:14px;
+
border-top-left-radius:8px;
 
font-family: Arial, Helvetica, sans-serif;
 
font-family: Arial, Helvetica, sans-serif;
 
color:white;
 
color:white;
 
font-weight:bold;
 
font-weight:bold;
−
margin-bottom:2%;
   
width:100%;
 
width:100%;
 
}
 
}
 
.updatebox{
 
.updatebox{
−
border-radius:4px;
+
border-radius:8px;
−
border-bottom-right-radius:14px;
+
border-bottom-right-radius:8px;
−
border-top-left-radius:14px;
+
border-top-left-radius:8px;
−
background:transparent url(skins/common/images/updatebg.png) no-repeat;
+
background: url(skins/common/images/updatebg.jpg) no-repeat;
 
text-align:center;
 
text-align:center;
 
width:100%;
 
width:100%;
−
height:auto;
+
height:154px;
 
font-family: Arial, Helvetica, sans-serif;
 
font-family: Arial, Helvetica, sans-serif;
 
opacity:1;
 
opacity:1;
 +
margin-bottom:14.203px;
 +
}
 +
.updatecontainer {
 +
float:left;
 +
}
 +
#uptextbox {
 +
margin-top:13px;
 
}
 
}
 
.uptext{
 
.uptext{
Line 730: Line 888:  
.uptext:hover{
 
.uptext:hover{
 
color:#80bfff;
 
color:#80bfff;
 +
}
 +
 +
/*@media headers specified for front page layout modulation*/
 +
 +
/* Add 242px to whatever @media header is defined for use with MW */
 +
@media screen and (min-width:0px) {
 +
html {
 +
min-width:983px;
 +
}
 +
.rightcol, .leftcol {
 +
 +
width:710px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
}
 +
#widgetcontainer {
 +
max-width:710px;
 +
padding:0px 0px 0px 0px;
 +
height:1800px;
 +
}
 +
.updatecontainer {
 +
width:48%;
 +
margin-right:4%;
 +
}
 +
.seasoncont {
 +
padding-top:30px;
 +
}
 +
}
 +
@media screen and (min-width:1248px) {
 +
.rightcol {
 +
width:260px;
 +
margin-left:4%;
 +
}
 +
#widgetcontainer {
 +
max-width:1219px;
 +
height:1158px;
 +
}
 +
.updatecontainer {
 +
width:100%;
 +
}
 +
#iconcluster {
 +
float:left;
 +
position:relative;
 +
top:-171px;
 +
}
 +
.seasoncont {
 +
padding-top:30px;
 +
}
 +
#uptextbox {
 +
margin-top:33px;
 +
}
 +
.updatebox {
 +
height: 200px;
 +
}
 +
.seasonalbox {
 +
height: 200px;
 +
}
 +
}
 +
@media screen and (min-width:1340px) {
 +
.rightcol {
 +
width:350px;
 +
}
 +
#widgetcontainer {
 +
max-width:1308px;
 +
height:1158px;
 +
}
 +
.seasonalbox {
 +
height: 200px;
 +
}
 +
#iconcluster {
 +
position:relative;
 +
top:-112px;
 +
width:710px;
 +
float:left;
 +
}
 +
.seasoncont {
 +
padding-top:30px;
 +
}
 +
#uptextbox {
 +
margin-top:33px;
 +
}
 +
.updatebox {
 +
height: 200px;
 +
}
 +
}
 +
@media screen and (min-width:1648px) {
 +
.rightcol {
 +
width:650px;
 +
}
 +
#widgetcontainer {
 +
max-width:1619px;
 +
height:950px;
 +
}
 +
.updatecontainer {
 +
width:48%; /*right margin 4%*/
 +
margin-right:4%;
 +
}
 +
.seasonalbox {
 +
height: 200px;
 +
}
 +
.updatebox {
 +
height: 200px;
 +
}
 +
#uptextbox {
 +
margin-top:33px;
 +
}
 +
.seasoncont {
 +
padding-top:30px;
 +
}
 +
#iconcluster {
 +
width:650px;
 +
float:right;
 +
top:0px;
 +
}
 
}
 
}
  
Retrieved from "https://en.kancollewiki.net/Special:MobileDiff/64666"

Navigation menu