MediaWiki:Common.css: Porovnání verzí

 
(Nejsou zobrazeny 3 mezilehlé verze od stejného uživatele.)
Řádek 140: Řádek 140:
 
   display: inline-block;
 
   display: inline-block;
 
   cursor: pointer;
 
   cursor: pointer;
 +
  z-index: 1000; /* Zajišťuje, že tooltip bude vždy nahoře */
 
}
 
}
  
 
.tooltip .tooltiptext {
 
.tooltip .tooltiptext {
 
   visibility: hidden;
 
   visibility: hidden;
   width: 200px;
+
   background-image: url(https://cz-wiki.metin2.gameforge.com/images/5/5d/Okno.png); /* Pozadí obrázku */
   background-color: black;
+
   background-size: contain; /* Zajistí, že celý obrázek se přizpůsobí obsahu */
 +
  background-repeat: no-repeat;
 
   color: white;
 
   color: white;
 
   text-align: center;
 
   text-align: center;
   padding: 5px;
+
   padding: 20px;
   border-radius: 5px;
+
    
   border: 2px solid white;
+
  /* Flexbox pro zarovnání textu do středu */
 
+
  display: flex;
/* Pozice pop-upu */
+
  justify-content: center; /* Horizontální zarovnání */
 +
   align-items: center; /* Vertikální zarovnání */
 +
 
 +
  /* Pozice pop-upu */
 
   position: absolute;
 
   position: absolute;
   z-index: 1;
+
   z-index: 1001; /* Text má vyšší z-index než obrázek pozadí */
   bottom: 125%; /* Pop-up bude umístěn nad prvkem */
+
   bottom: 100%; /* Tooltip je nyní blíže k otazníku */
 
   left: 50%;
 
   left: 50%;
   margin-left: -100px; /* Posun k vycentrování */
+
  transform: translateX(-50%); /* Centrování tooltipu */
 +
  white-space: nowrap; /* Zabraňuje zalamování textu */
 +
   margin-bottom: 5px; /* Přidání mezery mezi otazníkem a tooltipem */
 
}
 
}
  
Řádek 163: Řádek 170:
 
   visibility: visible;
 
   visibility: visible;
 
   opacity: 1;
 
   opacity: 1;
 +
  z-index: 1001; /* Zajišťuje, že tooltip se zobrazí před jiným obsahem */
 
}
 
}

Aktuální verze z 26. 9. 2024, 23:24

/* Zde uvedené CSS bude ovlivňovat všechny styly */

/** Volitelné styly wiki **/


/* Active effect */
.item_background {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 0px;
    left: 0px;
    line-height: 0%;
}

.item_item {
    position: absolute;
    top: 0px;
}

.item_active {
    -webkit-animation-name: item_active;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    animation-name: item_active;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    position: absolute;
    top: 0px;
    background-repeat: no-repeat;
}

.item_active a {
    display: block;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes item_active {
    0%   { background-image: url('/images/2/29/Aktivovaný_101.png'); }
    8.33%  { background-image: url('/images/2/25/Aktivovaný_102.png'); }
    16.66%  { background-image: url('/images/2/25/Aktivovaný_103.png'); }
    25%  { background-image: url('/images/4/44/Aktivovaný_104.png'); }
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
}
 
/* Standard syntax */
@keyframes item_active {
    0%   { background-image: url('/images/2/29/Aktivovaný_101.png'); }
    8.33%  { background-image: url('/images/2/25/Aktivovaný_102.png'); }
    16.66%  { background-image: url('/images/2/25/Aktivovaný_103.png'); }
    25%  { background-image: url('/images/4/44/Aktivovaný_104.png'); }
    33.33% { background-image: url('/images/8/84/Aktivovaný_105.png'); }
    41.66% { background-image: url('/images/e/e6/Aktivovaný_106.png'); }
    50% { background-image: url('/images/b/b7/Aktivovaný_107.png'); }
    58.33% { background-image: url('/images/2/26/Aktivovaný_108.png'); }
    66.66% { background-image: url('/images/c/cf/Aktivovaný_109.png'); }
    75% { background-image: url('/images/3/30/Aktivovaný_110.png'); }
    83.33% { background-image: url('/images/6/6e/Aktivovaný_111.png'); }
    91.66% { background-image: url('/images/3/34/Aktivovaný_112.png'); }
    100% { background-image: url('/images/8/80/Aktivovaný_113.png'); }
}

/* Volitelné transparentní pozadí */
.transp-bg {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
    border: 1px solid #000000;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.transp-bg2 {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat;
    background-color: transparent !important;
}

/* Skryje nápis „Hlavní strana“  */
body.page-Hlavní_strana #catlinks,
body.page-Hlavní_strana h1.firstHeading{
display: none;
}

/* Vzhled hlaviček */
.header-bg {
    background: url("https://cz-wiki.metin2.gameforge.com/images/1/12/Header-bg.png") repeat 0em 0em;
    color: rgb(254, 206, 88);
}

.header-bg a {
 color: #fece58;
 text-decoration: none !important;
}

li.gallerybox div.thumb,
div.thumbinner {
    background: url("https://cz-wiki.metin2.gameforge.com/images/9/91/Transparentn%c3%ad_pozad%c3%ad.png") repeat scroll 0% 0% transparent;	
    border: 1px solid #6e300b;
}

html .thumbimage {
    border: 1px solid #6e300b;
}

:focus {
    outline: none; 
}

.hoverbox { display:inline-block; padding:0em; }
.hoverbox .hoveritem { display:none; margin:0em; padding:0em; }
.hoverbox .hoveritem.selected { display:inline-block; }
.hoverbox:hover .hoveritem { display:inline-block; }
.hoverbox:hover .hoveritem.selected { display:none; }

.klavesa {
    background-color: rgb(247, 247, 247);
    background-image: -webkit-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: -moz-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: -o-linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    background-image: linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.1));
    border: 1px solid;
    border-color: rgb(221, 221, 221) rgb(170, 170, 170) rgb(136, 136, 136) rgb(204, 204, 204);
    border-radius: 2px;
    padding: 0 .4em;
    text-shadow: 0 1px rgba(255,255,255,.5);
    white-space: nowrap;
}

/* Tooltip */
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
  z-index: 1000; /* Zajišťuje, že tooltip bude vždy nahoře */
}

.tooltip .tooltiptext {
  visibility: hidden;
  background-image: url(https://cz-wiki.metin2.gameforge.com/images/5/5d/Okno.png); /* Pozadí obrázku */
  background-size: contain; /* Zajistí, že celý obrázek se přizpůsobí obsahu */
  background-repeat: no-repeat;
  color: white;
  text-align: center;
  padding: 20px;
  
  /* Flexbox pro zarovnání textu do středu */
  display: flex;
  justify-content: center; /* Horizontální zarovnání */
  align-items: center; /* Vertikální zarovnání */
  
  /* Pozice pop-upu */
  position: absolute;
  z-index: 1001; /* Text má vyšší z-index než obrázek pozadí */
  bottom: 100%; /* Tooltip je nyní blíže k otazníku */
  left: 50%;
  transform: translateX(-50%); /* Centrování tooltipu */
  white-space: nowrap; /* Zabraňuje zalamování textu */
  margin-bottom: 5px; /* Přidání mezery mezi otazníkem a tooltipem */
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
  z-index: 1001; /* Zajišťuje, že tooltip se zobrazí před jiným obsahem */
}