Difference between revisions of "MediaWiki:Common.css"

m
m

/* Korrektur der Darstellung von Tokens-Input-Feldern */ .inputSpan > .pfTokens > ul, .inputSpan > .pfTokens {

   margin: 0 0 0 0!important;

}

/* Template: Organizational Profile */ table.organisationsprofil-table{ display: block;

   padding-top: 20px;
   padding-bottom: 20px;
   padding-left: 20px;
   text-align: left;
   font-size: 13px;
   width: 100%;
   background: white;
   box-shadow: 2px 2px 5px #DEDEDE, -2px -2px 5px #DEDEDE;

} tr.organisationsprofil-row{

   width: 50px;
   height: 10px;

} tr.organisationsprofil-row > th{ padding-right: 10px; } tr.organisationsprofil-row > td{ padding-right: 10px; } tr.organisationsprofil-row > td + td b{ padding-left: 20px; } tr.organisationsprofil-row > td > div.hw-protokolle-inputbox, tr.organisationsprofil-row > td > div.hw-protokolle-results{ margin-left: 25px; }

/* CSS skin overwrites */

  1. content #bodyContent h2

{border-bottom: 1px solid #cfd8dc; margin-top: 2em; margin-bottom: 1.2em; display: inline-block; width: 80%; }

  1. content #bodyContent .wikitable h2

{margin-top: 0.8em; min-height:2.2em; font-size:1.2em; }

  1. content #bodyContent .wikitable ul > li

{ margin-top:0.6em; }

  1. toc

{ clear: both; padding: 0.5em 1em 2em 1em; }

  1. content #bodyContent #toc .toctitle h2

{ margin-top: 0.6em; } /* Flexbox */

.flex-grid flexbox {

                 displaybackground-color: flex#ccc;

            

} .col fb-row {

                 flexdisplay: 1flex;
 backgroundflex-direction: #f8f9farow;
 paddingflex-wrap: 20pxwrap;
 borderwidth:2px solid #fff100%;

            

}

.flexfb-grid-4 column {

                 display: flex;

            
} .
                 flex-
            
grid-4 .col {
                direction: column;
 flex-basis: 100%;
 flex: 1;

            

}

@media screen and (maxmin-width: 400px800px) {

                 .flex-gridcolumn {
   displayflex: block;1
 }
 .flex-grid-4 .col {
 width:98%;
 }

            

}

/* Korrektur der Darstellung von Tokens-Input-Feldern */
        
        .inputSpan > .pfTokens > ul, .inputSpan > .pfTokens {
        
            margin: 0 0 0 0!important;
        
        }
        
        
        
        /* Template: Organizational Profile */
        
        table.organisationsprofil-table{
        
        	display: block;
        
            padding-top: 20px;
        
            padding-bottom: 20px;
        
            padding-left: 20px;
        
            text-align: left;
        
            font-size: 13px;
        
            width: 100%;
        
            background: white;
        
            box-shadow: 2px 2px 5px #DEDEDE, -2px -2px 5px #DEDEDE;
        
        }
        
        tr.organisationsprofil-row{
        
            width: 50px;
        
            height: 10px;
        
        }
        
        tr.organisationsprofil-row > th{
        
        	padding-right: 10px;
        
        }
        
        tr.organisationsprofil-row > td{
        
        	padding-right: 10px;
        
        }
        
        tr.organisationsprofil-row > td + td b{
        
        	padding-left: 20px;
        
        }
        
        tr.organisationsprofil-row > td > div.hw-protokolle-inputbox,
        
        tr.organisationsprofil-row > td > div.hw-protokolle-results{
        
        	margin-left: 25px;
        
        }
        
        
        
        /* CSS skin overwrites  */
        
        #content #bodyContent h2 
        
        {border-bottom: 1px solid #cfd8dc;
        
        margin-top: 2em;
        
        margin-bottom: 1.2em;   
        
        display: inline-block;
        
        width: 80%;
        
        }
        
        #content #bodyContent .wikitable h2
        
        {margin-top: 0.8em;
        
        min-height:2.2em;
        
        font-size:1.2em;
        
        }
        
        
        
        #content #bodyContent .wikitable ul > li
        
        {
        
        margin-top:0.6em;	
        
        }
        
        #toc
        
        {
        
        clear: both;
        
        padding: 0.5em 1em 2em 1em;
        
        }
        
        
        
        #content #bodyContent #toc .toctitle h2
        
        {
        
        margin-top: 0.6em;
        
        }
        
        /* Flexbox */
        
        
        .flex-grid {
            
              display: flex;
            
            }
            
            .col {
            
              flex: 1;
            
              background: #f8f9fa;
            
              padding: 20px;
            
              border:2px solid #fff;
            
            }
            
            
            
            .flex-grid-4 {
            
              display: flex;
            
            }
            
            .flex-grid-4 .col {
            
            
            
            }
            
            
            
            @media (max-width: 400px) {
            
              .flex-grid {
            
                display: block;
            
              }
            
              .flex-grid-4 .col {
            
              width:98%;
            
              }
            
            }
            
            .flexbox {
            
              background-color: #ccc;
            
            }
            
            .fb-row {
            
              display: flex;
            
              flex-direction: row;
            
              flex-wrap: wrap;
            
              width: 100%;
            
            }
            
            
            
            .fb-column {
            
              display: flex;
            
              flex-direction: column;
            
              flex-basis: 100%;
            
              flex: 1;
            
            }
            
            
            
            @media screen and (min-width: 800px) {
            
              .column {
            
                flex: 1
            
              }
            
            }
Line 63: Line 63:
 
}
 
}
 
/* Flexbox */
 
/* Flexbox */
.flex-grid {
+
 
 +
.flexbox {
 +
  background-color: #ccc;
 +
}
 +
.fb-row {
 
   display: flex;
 
   display: flex;
}
+
   flex-direction: row;
.col {
+
   flex-wrap: wrap;
   flex: 1;
+
   width: 100%;
   background: #f8f9fa;
 
  padding: 20px;
 
   border:2px solid #fff;
 
 
}
 
}
  
.flex-grid-4 {
+
.fb-column {
 
   display: flex;
 
   display: flex;
}
+
  flex-direction: column;
.flex-grid-4 .col {
+
  flex-basis: 100%;
 
+
  flex: 1;
 
}
 
}
  
@media (max-width: 400px) {
+
@media screen and (min-width: 800px) {
   .flex-grid {
+
   .column {
     display: block;
+
     flex: 1
  }
 
  .flex-grid-4 .col {
 
  width:98%;
 
 
   }
 
   }
 
}
 
}