Difference between revisions of "MediaWiki:Common.css"

From OPENRESEARCH th copy Wiki
Jump to navigation Jump to search
 
(27 intermediate revisions by one other user not shown)
Line 1: Line 1:
 
/* CSS placed here will be applied to all skins */
 
/* CSS placed here will be applied to all skins */
 +
 +
 +
/* InfoBox */
 +
 +
table.formtable.InfoBox {
 +
    position:relative;
 +
    margin: 0 0 0.5em 1em;
 +
    border-collapse: collapse;
 +
    border: 1px solid #aaa;
 +
    background: #fff;
 +
    float: right;
 +
    clear: right;
 +
    width: 20em
 +
}
 +
 +
table.formtable.InfoBox th:first-child {
 +
  background: #E6F9FF;
 +
  color: black;
 +
  width: 20em;
 +
  min-width: 20em;
 +
  max-width: 20em;
 +
  word-break: break-all;
 +
}
 +
 +
.tableHeadline{
 +
font-size: 18px;
 +
vertical-align: middle;
 +
text-align: left !important;
 +
background: #ADD8E6  !important;
 +
}
 +
 +
.FormInputField{
 +
width: 100% !important
 +
}
 +
  
 
/* Originated from: http://edutechwiki.unige.ch/en/MediaWiki:Common.css */
 
/* Originated from: http://edutechwiki.unige.ch/en/MediaWiki:Common.css */
 
table.formtable.BlueForm th{
 
table.formtable.BlueForm th{
     text-align: left;
+
     text-align: center;
 
     vertical-align: middle;
 
     vertical-align: middle;
 
     background: rgb(220,230,240);
 
     background: rgb(220,230,240);
Line 11: Line 46:
 
     font-size: 14px;
 
     font-size: 14px;
 
     color: #333;
 
     color: #333;
max-width: 220px;
+
    max-width: 220px;
min-width:170px;
+
    min-width:170px;
 
}
 
}
 +
 
table.formtable.BlueForm td{
 
table.formtable.BlueForm td{
 
     padding-left:30px;
 
     padding-left:30px;
 +
}
 +
 +
table.formtable.RedForm th{
 +
    text-align: center;
 +
    vertical-align: middle;
 +
    background: rgb(230,150,121);
 +
    padding: 10px;
 +
    box-shadow: 1px 1px 1px 0px white inset,1px 1px 1px rgba(3,3,3,0.1);
 +
    border: 1px solid rgb(210,220,230);
 +
    font-size: 14px;
 +
    color: #000000;
 +
    max-width: 220px;
 +
    min-width:170px;
 +
}
 +
 +
table.formtable.RedForm td{
 +
    padding-left:30px;
 +
}
 +
 +
table.formtable.GreenForm th{
 +
    text-align: center;
 +
    vertical-align: middle;
 +
    background: rgb(208,217,92);
 +
    padding: 10px;
 +
    box-shadow: 1px 1px 1px 0px white inset,1px 1px 1px rgba(3,3,3,0.1);
 +
    border: 1px solid rgb(210,220,230);
 +
    font-size: 14px;
 +
    color: #000000;
 +
    max-width: 220px;
 +
    min-width:170px;
 +
}
 +
 +
table.formtable.GreenForm td{
 +
    padding-left:30px;
 +
}
 +
.formFieldInput {
 +
  width: 100%;
 +
  padding: 12px 20px;
 +
  margin: 8px 0;
 +
  box-sizing: border-box;
 +
}
 +
 +
/* CSS placed here will be applied to all skins */
 +
/* CSS placed here will be applied to all skins */
 +
/* Collapse Toggle container */
 +
#collapse-pre-one .mw-collapsible-toggle{
 +
display: table;
 +
background-color: lightblue;
 +
  color: black;
 +
border-collapse: collapse;
 +
width: 100%;
 +
}
 +
 +
#collapse-pre-one .mw-collapsible-toggle-row{
 +
display: table-row;
 +
}
 +
 +
/* Collapse Header should be on the left */
 +
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-header{
 +
display: table-cell;
 +
vertical-align: middle;
 +
padding: 5px;
 +
}
 +
 +
/* Collapse indicator image should be inline. align wherever you would like */
 +
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator{
 +
display: table-cell;
 +
vertical-align: middle;
 +
padding: 5px;
 +
text-align: right;
 +
}
 +
 +
/* Collapse indicator image size should be something sane*/
 +
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
 +
height: 20px !important;
 +
width: 20px !important;
 +
}
 +
 +
/* Collapse indicator image should rotate when toggled*/
 +
#collapse-pre-one:not(.mw-collapsed) .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
 +
/* Safari */
 +
-webkit-transform: rotate(90deg);
 +
 +
/* Firefox */
 +
-moz-transform: rotate(90deg);
 +
 +
/* IE */
 +
-ms-transform: rotate(90deg);
 +
 +
/* Opera */
 +
-o-transform: rotate(90deg);
 +
 +
/* Internet Explorer */
 +
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
 
}
 
}

Latest revision as of 13:23, 11 May 2021

/* CSS placed here will be applied to all skins */


/* InfoBox */

table.formtable.InfoBox {
    position:relative;
    margin: 0 0 0.5em 1em; 
    border-collapse: collapse;
    border: 1px solid #aaa;
    background: #fff;
    float: right;
    clear: right;
    width: 20em
}

table.formtable.InfoBox th:first-child {
  background: #E6F9FF;
  color: black;
  width: 20em;
  min-width: 20em;
  max-width: 20em;
  word-break: break-all;
}

.tableHeadline{
font-size: 18px;
vertical-align: middle;
text-align: left !important;
background: #ADD8E6  !important;
}

.FormInputField{
width: 100% !important
}


/* Originated from: http://edutechwiki.unige.ch/en/MediaWiki:Common.css */
table.formtable.BlueForm th{
    text-align: center;
    vertical-align: middle;
    background: rgb(220,230,240);
    padding: 10px;
    box-shadow: 1px 1px 1px 0px white inset,1px 1px 1px rgba(3,3,3,0.1);
    border: 1px solid rgb(210,220,230);
    font-size: 14px;
    color: #333;
    max-width: 220px;
    min-width:170px;
}

table.formtable.BlueForm td{
    padding-left:30px;
}

table.formtable.RedForm th{
    text-align: center;
    vertical-align: middle;
    background: rgb(230,150,121);
    padding: 10px;
    box-shadow: 1px 1px 1px 0px white inset,1px 1px 1px rgba(3,3,3,0.1);
    border: 1px solid rgb(210,220,230);
    font-size: 14px;
    color: #000000;
    max-width: 220px;
    min-width:170px;
}

table.formtable.RedForm td{
    padding-left:30px;
}

table.formtable.GreenForm th{
    text-align: center;
    vertical-align: middle;
    background: rgb(208,217,92);
    padding: 10px;
    box-shadow: 1px 1px 1px 0px white inset,1px 1px 1px rgba(3,3,3,0.1);
    border: 1px solid rgb(210,220,230);
    font-size: 14px;
    color: #000000;
    max-width: 220px;
    min-width:170px;
}

table.formtable.GreenForm td{
    padding-left:30px;
}
.formFieldInput {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}

/* CSS placed here will be applied to all skins */
/* CSS placed here will be applied to all skins */
/* Collapse Toggle container */
#collapse-pre-one .mw-collapsible-toggle{
 display: table;
 background-color: lightblue;
  color: black;
 border-collapse: collapse;
 width: 100%;
}

#collapse-pre-one .mw-collapsible-toggle-row{
 display: table-row;
}

/* Collapse Header should be on the left */
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-header{
 display: table-cell;
 vertical-align: middle;
 padding: 5px;
}

/* Collapse indicator image should be inline. align wherever you would like */
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator{
 display: table-cell;
 vertical-align: middle;
 padding: 5px;
 text-align: right;
}

/* Collapse indicator image size should be something sane*/
#collapse-pre-one .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
height: 20px !important; 
width: 20px !important;
}

/* Collapse indicator image should rotate when toggled*/
#collapse-pre-one:not(.mw-collapsed) .mw-collapsible-toggle .mw-collapsible-toggle-indicator img{
 /* Safari */
 -webkit-transform: rotate(90deg);

 /* Firefox */
 -moz-transform: rotate(90deg);

 /* IE */
 -ms-transform: rotate(90deg);

 /* Opera */
 -o-transform: rotate(90deg);

 /* Internet Explorer */
 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}