Skillnad mellan versioner av "MediaWiki:Mobile.css"

Från SignWiki
Hoppa till navigering Hoppa till sök
Märken: Mobil webbredigering Mobilredigering
(Sync with finsl mobile.css)
Märken: Mobil webbredigering Mobilredigering
 
Rad 5: Rad 5:
 
}
 
}
  
#frontTable div{
+
#frontTable {
 
+
   display: table;
  margin: 1px 10px;
+
   table-layout: fixed;
  -moz-border-radius: 25px;
+
}
  -webkit-border-radius: 25px;
 
   -o-border-radius: 25px;
 
   -ms-border-radius: 25px;
 
  -khtml-border-radius: 25px;
 
  border-radius: 25px;
 
  
 +
#frontTable div {
 +
  position: relative;
 +
  padding-bottom: 2em;
 +
  margin: 0.1em 0.6em;
 +
  border-radius: 1.5em;
 +
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
 
}
 
}
  
#frontTable div{
+
#frontTable p {
   background: -moz-linear-gradient(top,  rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
+
   position: absolute;
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.2)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
+
   bottom: 0;
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
+
   width: 100%;
  background: -o-linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
 
  background: -ms-linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* IE10+ */
 
   background: linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* W3C */
 
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
 
 
 
 
}
 
}
  
#frontTable p
+
#frontTable img {
{
 
position: absolute; bottom: 0; width: 100%;
 
}
 
#frontTable div{position:relative; padding-bottom: 2em;}
 
#frontTable a img{
 
 
   opacity: .9;
 
   opacity: .9;
 
}
 
}
 +
 
#frontTable a {
 
#frontTable a {
 
   color: black;
 
   color: black;
 
}
 
}
 +
 
.thumbnail {
 
.thumbnail {
    background: url("/images/img_bg.png") no-repeat scroll 0 0 transparent;
+
  background: url("/images/img_bg.png") no-repeat scroll 0 0 transparent;
    height: 220px;
+
  height: 220px;
    padding: 1px;
+
  padding: 1px;
    width: 226px;
+
  width: 226px;
    z-index: 1;
+
  z-index: 1;
    float:left;
+
  float: left;
 
}
 
}
  
 
#limited_pic {
 
#limited_pic {
    border: 0 none;
+
  border: 0 none;
    height: 180px;
+
  height: 180px;
    margin-left: 15px;
+
  margin-left: 15px;
    margin-top: 10px;
+
  margin-top: 10px;
    overflow: hidden;
+
  overflow: hidden;
    position: relative;
+
  position: relative;
    width: 200px;
+
  width: 200px;
    z-index: 2;
+
  z-index: 2;
 
}
 
}
  
 
img {
 
img {
    border: 0 solid #333333;
+
  border: 0 solid #333333;
 
}
 
}
  
 
#caption {
 
#caption {
    background-image: url("/images/blackbar.png");
+
  background-image: url("/images/blackbar.png");
    color: #FFFFFF;
+
  color: #FFFFFF;
    font-family: Verdana,Arial,sans-serif;
+
  font-family: Verdana, Arial, sans-serif;
    font-size: 80%;
+
  font-size: 80%;
    height: 25px;
+
  height: 25px;
    line-height: 1em;
+
  line-height: 1em;
    margin-left: 15px;
+
  margin-left: 15px;
    margin-top: -30px;
+
  margin-top: -30px;
    overflow: hidden;
+
  overflow: hidden;
    padding-top: 7px;
+
  padding-top: 7px;
    position: relative;
+
  position: relative;
    text-align: center;
+
  text-align: center;
    width: 200px;
+
  width: 200px;
    z-index: 3;
+
  z-index: 3;
 
}
 
}
  
#caption a:link, #caption a:visited, #caption a:hover {
+
#caption a:link,
    color: #FFFFFF;
+
#caption a:visited,
    font-weight: 700;
+
#caption a:hover {
    text-decoration: none;
+
  color: #FFFFFF;
 +
  font-weight: 700;
 +
  text-decoration: none;
 
}
 
}
  
.infoboxtakn{
+
.infoboxtakn {
width:250px;
+
  width: 250px;
background-color:white;
+
  background-color: white;
float:left;
+
  float: left;
clear:left;
+
  clear: left;
margin:-1em 0 1em 1em;
+
  margin: -1em 0 1em 1em;
border:1px solid;
+
  border: 1px solid;
-moz-border-radius:12px;
+
  border-radius: 12px;
padding:12px 12px 12px 12px;
+
  padding: 12px 12px 12px 12px;
 
}
 
}
  
.boxheader
+
.boxheader {
{
+
  text-align: center;
text-align:center;font-size:16px;font-weight:bold;line-height:1.5em;
+
  font-size: 16px;
 +
  font-weight: bold;
 +
  line-height: 1.5em;
 
}
 
}

Nuvarande version från 16 oktober 2023 kl. 18.35

/* All CSS here will be loaded for users of the mobile site */

.hiddenStructure {
  display: none;
}

#frontTable {
  display: table;
  table-layout: fixed;
}

#frontTable div {
  position: relative;
  padding-bottom: 2em;
  margin: 0.1em 0.6em;
  border-radius: 1.5em;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
}

#frontTable p {
  position: absolute;
  bottom: 0;
  width: 100%;
}

#frontTable img {
  opacity: .9;
}

#frontTable a {
  color: black;
}

.thumbnail {
  background: url("/images/img_bg.png") no-repeat scroll 0 0 transparent;
  height: 220px;
  padding: 1px;
  width: 226px;
  z-index: 1;
  float: left;
}

#limited_pic {
  border: 0 none;
  height: 180px;
  margin-left: 15px;
  margin-top: 10px;
  overflow: hidden;
  position: relative;
  width: 200px;
  z-index: 2;
}

img {
  border: 0 solid #333333;
}

#caption {
  background-image: url("/images/blackbar.png");
  color: #FFFFFF;
  font-family: Verdana, Arial, sans-serif;
  font-size: 80%;
  height: 25px;
  line-height: 1em;
  margin-left: 15px;
  margin-top: -30px;
  overflow: hidden;
  padding-top: 7px;
  position: relative;
  text-align: center;
  width: 200px;
  z-index: 3;
}

#caption a:link,
#caption a:visited,
#caption a:hover {
  color: #FFFFFF;
  font-weight: 700;
  text-decoration: none;
}

.infoboxtakn {
  width: 250px;
  background-color: white;
  float: left;
  clear: left;
  margin: -1em 0 1em 1em;
  border: 1px solid;
  border-radius: 12px;
  padding: 12px 12px 12px 12px;
}

.boxheader {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5em;
}