Difference between revisions of "MediaWiki:Common.css"

From SQLZOO
Jump to: navigation, search
Line 116: Line 116:
 
   margin-bottom: 9em;
 
   margin-bottom: 9em;
 
}
 
}
 +
h2+.qu,h2+.ht{
 +
  border-top:none;
 +
}
 +
 
div.setup,div.tidy,div.params{
 
div.setup,div.tidy,div.params{
 
   display:none;
 
   display:none;

Revision as of 20:27, 21 February 2017

/* Make reference and tools drop downs - leaving room for the sovrn ads */
#p-tb div,#p-Reference div {
  overflow:hidden;
  max-height:0px;
  transition:max-height 0.15s
}
#p-tb:hover h3,#p-Reference:hover h3{
  text-decoration:underline;
}
#p-tb:hover div,#p-Reference:hover div {
  max-height:500px;
  transition:max-height 0.25s;
  transition-delay:0.1s;
}
 .r{
  text-align:right;
}
.imper{
  font-weight:bold;
}
table.distractor,table.distractor caption{
  background:#f9f9f9;
  float:left;
  margin: 1ex;
}
table.distractor{
  border: solid thin #d0d0d0;
}
table.object{
  clear:left;
  margin: 1ex;
}
#mw-panel .portal.first .body ul li {
  text-align: right;
}
div#mw-panel div.portal.first{
  margin-left:0px;
}
div.body div.portal.first ul li a {
  padding-right: 40px;
  display: inline-block;
  color: #3b434e;
}
div#mw-panel div.portal.first div.body ul li a {
  padding-right:25px;
  color: #3b434e;
}
.progressbarbg1 {
  position: absolute;
  right: 0px;
  width: 4.5ex;
  height: 1ex;
  background: black;
  border-radius: 0.7ex;
  border: 0.2ex solid #92A599;
  margin: -1em 0 0 0;
}
.progressbar1 {
  width: 3.93ex;
  height: 0.6ex;
  position: relative;
  top: 0.2ex;
  left: .2ex;
  background: #92A599;
  border-radius: 0.6ex;
  border-width: 0px;
  border-color: #000000;
}

#cog-cont ul{
  position:absolute;
  background-color:white;
  border:solid thin black;
  padding:1em;
  right:1em;
  top:32px;
  list-style:none;
}
#cog-cont ul li{
}
#p-personal{
  right:50px;
}
.tease{
  color:#1d365d;
  font-style:italic;
  cursor:pointer;
  padding: 0.2ex;
}
h1{
 font-family:sans-serif;
}
table.db_ref {
  border-collapse:collapse;
}
.db_ref th{
  text-align:left;
}
.db_ref th,.db_ref td{
  border:solid thin black;
  padding-left:0.6ex;
  padding-right:0.6ex;
}
.db_ref .r{
  text-align:right;
}
div.def,div.ans{
  display:none;
}
span.id {
  font-size: 300%;
  padding-right: 1ex;
}
.qu,.ht {
  border-top: thin solid #ee8301;
  margin-bottom: 9em;
}
h2+.qu,h2+.ht{
  border-top:none;
}

div.setup,div.tidy,div.params{
  display:none;
}
div.res {
  margin-top:1ex;
  background: #dae5d9;
  color: #3b434e;
  border: none;
  padding: 1em;
  border-radius: 0.5ex;
  box-shadow: 1px 1px 3px #3b434e;
  border-style: inset;
  border-width: 1px;
  height: 20em;
  overflow: auto;
}
div.res.waiting{
  background-image:url(/design/ajax-loader.gif);
  background-repeat:no-repeat;
  background-position: center center;
}
textarea.sql {
  width: 100%;
  box-shadow: 1px 1px 3px #3b434e;
  border-style: inset;
  border-width: 1px;
  border-radius: 1ex;
  padding: 0.5ex;
  margin-bottom: 0.5ex;
}
button{
  background-image: linear-gradient(to bottom,#337ab7 0,#265a88 100%);
  background-color:#306aa0;
  color:white;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3;
  border-radius: 6px;
  border-color: #245580;
  border-width:1px;
  cursor:pointer;
}
.reset {
  display: inline;
  border: solid 1px;
  margin-left: 6em;
  padding: .5ex;
  border-radius: .5ex;
  cursor:pointer;
}
.qcorrect{
  background-image: url(/design/done9.png);
}
.qincorrect {
  background-image:url(/design/undone9.png);
}
.qcorrect, .qincorrect {
  width: 3em;
  height: 3em;
  position: absolute;
  margin: 0em 0 0 5em;
  background-size: 3em;
  background-repeat: no-repeat;
  background-position: center;
}
#p-logo>a{
  background-position:center top;
}
table{
  border-collapse:collapse;
}
table.sqlans{
  display:none;
}
td,th {
  border: solid gray 1px;
  padding: .2em .7em;
  vertical-align: top;
}
.showtxt{
  color:blue;
  cursor:pointer;
}
#napier-ad {
  width: 728px;
  height: 90px;
  display: inline-block;
  margin-left: 11em;
  background-image: url(http://sqlzoo.net/design/iidi_leaderboard.gif);
}
/*
 * Allow question and result to be side by side when the screen is big enough
*/
@media (max-width:1000px){
#napier-ad {
  display: none;
}
}

@media (min-width:1000px){
  .zood>div,.zood>div{
    width:46%;
    display:inline-block;
    vertical-align:top;
    margin-top:1ex;
  }
  .zood>div:first-child{
  }
  .zood>div.res,ht>div.res.ht{
    margin-left:1%;
  }
}
@media (max-width: 768px) {
  div#mw-panel{
    display: none;
  }
  #left-navigation {
    left: 0;
  }
  #mw-head-base,
  div#content,
  div#footer {
    margin-left: 0;
  }
  .db_ref{
  }
}

.quiz .q {
  margin-top:4em;
  padding-top: 0.8em;
  padding-bottom: 0.8em;
  border-radius:1em;
}

.quiz .q .d{
  border:blue solid thin;
  margin-top:1em;
  cursor:pointer;
} 
.quiz .q div.d{
  padding:.5em .5em .5em 1em;
}
.quiz .q .d:hover{
  border:black solid thin;
  box-shadow: 0px 0px 5px 1ex rgba(50, 50, 50, 0.75);
}
.quiz .q .d.picked{
  box-shadow: 0ex 0ex 4px 1ex #CFD1BA;
}
.quiz .q .d.picked::before{
  content: '\25CB';
  padding:0.3em;
  background:white;
  border:solid black thin;
  position:absolute;
  text-align:center;
  vertical-align: middle;
  left:-0.9em;
  margin-top:-0.9em;
  width:1em;
  height:1em;
}
.quiz .q .d.picked.mark-correct::before{
  content: '\2713';
  background-color:green;
}
.quiz .q .d.picked.mark-wrong::before{
  content: '\2717';
  background-color:red;
}

.quiz .feedback{
  margin: 1em 0;
  padding:1em;
  border:solid thin black;
  font-size:large;
  box-shadow: .2ex .2ex #CFD1BA;
}
 
td.sign{
vertical-align: middle;
display:none;
}