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

← Porovnání se starší verzí Porovnání s novější verzí →
Verze z 15. 11. 2022, 09:07

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

body {
	background: var(--background-color-dp-6);
}

.float-right {
	float:right;
	margin-left:20px;
}

.shadow {
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}

/* wikitable */

table.wikitable tr th, table.wikitable tr td {
	padding:7px 20px 7px 0;
}

/* Odstranění ikony u externích odkazů */
.mw-parser-output a.external {
	background-image:none;
}

.infobox {
    width: 100%;
    max-width: 400px;
    margin-top: 0.8rem;
    margin-bottom: 0.4em;
    border-spacing: 0;
    border-radius: var(--border-radius--large);
    background: var(--background-color-dp-02);
    font-size: 0.875rem;
    text-align: left;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
    /* V případě, že tooltip překročí boundary */
    overflow: visible;
}

.infobox tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 20px;
}

.infobox tr {
    margin-top: 10px;
    padding: 0 8px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.infobox th,
.infobox td {
    padding: 0 10px;
}

.infobox .infobox-col1 {
    width: 100%;
}

.infobox .infobox-col2 {
    width: 50%;
}

.infobox .infobox-col3 {
    width: calc(100% / 3);
}

.infobox .infobox-col4 {
    width: 25%;
}

.infobox .infobox-title {
    margin-top: 20px;
    margin-bottom: 5px;
    width: 100%;
    color: var(--color-base--emphasized);
    font-size: 1.4rem;
    line-height: 1.4;
}

.infobox .infobox-subTitle {
    margin-top: 0px;
    margin-bottom: 20px;
    width: 100%;
    color: var(--color-base--subtle);
    font-size: 1.1rem;
    line-height: 0.7;
}

.infobox .infobox-header {
    margin-top: 15px;
    padding-top: 15px;
    width: 100%;
    color: var(--color-base--emphasized);
    border-top: 1px solid;
    border-color: var(--border-color-base);
    font-size: 1rem;
}

/* Infobox titulkový obrázek */
.infobox .infobox-image {
    margin-top: 0;
    padding: 0;
    border-radius: 12px 12px 0 0;
    overflow: hidden;
}

.infobox-image td {
    padding: 0;
}

.infobox-image--dark .image {
	background: #2b2f36;
}

.infobox-image .image img {
	max-width: 100%;
    display: block;
    background: var(--background-color-quiet--hover);
}

/* Infobox hodnoty */
.infobox-data th {
    color: var(--color-base--subtle);
    font-weight: normal;
    font-size: 0.8125rem;
    letter-spacing: .75px;
}

.infobox-data td {
    font-weight: 500;
}

.infobox-data ul,
.infobox-data ol {
    margin-top: 0;
}

@media only screen and (max-width: 720px) {
    .infobox {
        margin-left: auto;
        margin-right: auto;
    }
    
    .float-right {
    	float:none;
    }

    .infobox tr:first-of-type .mw-collapsible-toggle {
        display: block;
    }
}

/* šablona Specifikace */

.spec-main {
	width:100%;
	display:flex;
}

.spec-main tbody {
}

.spec-main .spec-col {
    width: 45%;
    max-width:450px;
    display:inline-grid;
    margin:0 10px;
}

.spec-main .spec-inner {
	line-height:1.6;
	font-size:14px;
	margin:0;
	padding: 15px;
	min-width:400px;
	border-radius: var(--border-radius--large);
    background: var(--background-color-dp-02);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}

.spec-main .spec-inner td {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding:0;
}

.specOznac {
	color:#d5603a; /*d77c36*/
	display:contents;
}

.spec-inner .spec-header {
    width: 100%;
    color: var(--color-base--emphasized);
    font-size: 1rem;
}

@media only screen and (max-width: 900px) {
	
	.spec-main {
		width:100%;
		display:table-caption;
	}
	.spec-main .spec-col {
	    width: 100%;
	    margin:10px 0;
	}
}




/* Užitečné odkazy, šablona Odkazy ZASTARALÉ */

table.odkazy {
	width: 100%;
    margin-top: 0.8rem;
    border-spacing: 0;
    border-radius: var(--border-radius--large);
    /*background: var(--background-color-dp-02);*/
    text-align: left;
    /*box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);*/
}

.odkazy tr {
    margin-top: 10px;
    padding: 0 8px;
    box-sizing: border-box;
}

.odkazy td {
    padding:0;
}

/* používá šablona Infoboxů */
ul.odkazy-urlSeznam {
	list-style:none;
	display:flex;
	flex-wrap:wrap;
	margin:0;
	padding:0;
}

ul.odkazy-urlSeznam a.external {
	padding:5px 10px;
	border-radius:4px;
}

ul.odkazy-urlSeznam a.external:hover {
	padding:5px 10px;
	border-radius:4px;
	background-color:var(--background-color-quiet--hover);
}

/* Specifikace pro lodě a vozidla */
.vehicle-spec {
	background: var(--background-color-dp-04);
	margin: 5px 0 5px 0;
	padding: 5px;
	border-radius: var(--border-radius--small);
	width:-webkit-fill-available;
}

.vehicle-spec td {
	display:flex;
	align-items:center;
}

.vehicle-spec-size {
	border:1px solid #616161;
	padding:0px;
	width:18px;
	height:18px;
	border-radius:4px;
	font-size:12px;
	font-weight:300;
	text-align:center;
	color: #d5603a;
	vertical-align:middle;
	line-height:1.6;
	margin-right: 5px;
}

.vehicle-spec  img {
	margin-right: 5px;
}

.vehicle-spec-name {
	margin-right:5px;
}

.vehicle-spec-quantity {
	color:#d5603a;
	min-width:25px;
}

.vehicle-spec-type {
	font-size:0.65rem;
	color:#6b6b6b;
	margin-left:10px;
}

/* Tabulka porovnání lodí ze série */

.serie-spec-td {
	padding:0;
	vertical-align:top;
	border-right:1px solid var(--border-color-base);
}

.serie-spec-td-posledni {
	padding:0;
	vertical-align:top;
}

table.serie {
	/*line-height:1.2;*/
	font-size:14px;
	margin:0;
	padding: 0;
}

table.serie tbody {
	vertical-align:top;
}

table.serie td {
	/* display: flex; */
	/*align-items: center;*/
	/*justify-content: space-between;*/
	padding:0 3px;
	width:345px;
}

.serie-zbrane-header {
	font-size:1.02em;
	padding:5px 0 5px 0;
	font-weight:200;
}

/* Specifikace pro lodě a vozidla na stránce série*/

table.komponenty-serie {
	background: none;
	margin:0;
	padding: 0;
	width:-webkit-fill-available;
}*

table.komponenty-serie tr td {
	border-bottom: 0;
	padding:0;
	display:block;
}

.komponenty-serie td {
	display:flex;
	align-items:center;
}

.komponenty-serie-size {
	border:1px solid #616161;
	padding:0;
	width:18px;
	height:18px;
	border-radius:4px;
	font-size:12px;
	font-weight:300;
	text-align:center;
	color: #d77c36;
	vertical-align:middle;
	line-height:1.6;
	margin-right: 5px;
}

.komponenty-serie  img {
	margin-right: 5px;
}

.komponenty-serie-name {
	margin-right:5px;
}

.komponenty-serie-quantity {
	color:#d77c36;
	min-width:25px;
}

.komponenty-serie-type {
	font-size:0.65rem;
	color:#6b6b6b;
	margin-left:10px;
}

/* šablona Specifikace série*/

.parametrOrange {
	color:#ff8645; /*#d77c36*/
	font-size:10px;
	display:contents;
	/*text-transform: uppercase;*/
}

.orange {
	color:#ff8645; /*#d77c36*/
}

.spec-serie-inner {
	line-height:1.6;
	width:-webkit-fill-available;
}

/*.spec-inner {
	line-height:1.6;
	font-size:14px;
	margin:0;
	padding: 15px;
	min-width:400px;
	border-radius: var(--border-radius--large);
    background: var(--background-color-dp-02);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}*/

.spec-serie-inner td {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding:0;
}

.spec-serie-inner .spec-serie-header {
    width: 100%;
    color: var(--color-base--emphasized);
    font-size: 1.02em;
    font-weight:200;
}

/*
.specifikace {
    width: 100%;
    margin-top: 0.8rem;
    border-spacing: 0;
    border-radius: var(--border-radius--large);
    background: var(--background-color-dp-02);
    font-size: 0.875rem;
    text-align: left;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
    overflow: visible;
}

.specifikace tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 20px;
}

.specifikace tr {
    margin-top: 10px;
    padding: 0 8px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.specifikace th,
.specifikace td {
    padding: 0 10px;
}

.specifikace-data th {
    color: var(--color-base--subtle);
    font-weight: normal;
    font-size: 0.8125rem;
    letter-spacing: .75px;
}

.specifikace-data td {
    font-weight: bold;
}

.specifikace .specifikace-header {
    margin-top: 15px;
    padding-top: 15px;
    width: 100%;
    color: var(--color-base--emphasized);
    border-top: 1px solid;
    border-color: var(--border-color-base);
    font-size: 1rem;
}

.specifikace .specifikace-col1 {
    width: 50%;
}
*/



/* Šablona Pohledy na loď */


.pohledyNaLod tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 20px;
}

.pohledyNaLod tr {
    margin-top: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.pohledyNaLod .image img {
	max-width: 100%;
    display: block;
    background: var(--background-color-quiet--hover);
}

.pohledyNaLod .pohledyNaLod-col2 {
    max-width: 50%;
}

.pohledyNaLod .pohledyNaLod-col4 {
    max-width: 25%;
}

@media only screen and (max-width: 720px) {
    .pohledyNaLod .pohledyNaLod-col2 {
        max-width: 100%;
    }
    
    .pohledyNaLod .pohledyNaLod-col4 {
        max-width: 50%;
    }
}

/* Šablona ObrSeznam2 */

.ObrSeznam2 tbody {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 20px;
}

.ObrSeznam2 tr {
    margin-top: 0;
    padding: 10px 20px 10px 0;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border-bottom: 1px solid var(--border-color-base);
}


.ObrSeznam2 .image img {
	max-width: 100%;
    display: block;
    background: var(--background-color-quiet--hover);
}

.ObrSeznam2 .obrSeznam2-image {
    max-width: 30%;
}

.ObrSeznam2 .obrSeznam250-image {
    max-width: 50%;
}

.ObrSeznam2 .obrSeznam2-text {
    max-width: 70%;
}

.ObrSeznam2 .obrSeznam250-text {
    max-width: 50%;
}

@media only screen and (max-width: 720px) {
    .ObrSeznam2 .obrSeznam2-image {
        max-width: 100%;
    }
    
    .ObrSeznam2 .obrSeznam2-text {
        max-width: 100%;
    }
}
/* Šablona: Obrázek max */

div.obrMax img {
	max-width:100%;
	height:auto;
	-moz-box-shadow:0 1px 3px #000;
	-webkit-box-shadow:0 1px 3px #000;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}

/* Šablona: Obrázky flex wrap */

.imgListDiv {
	background:#303133;
	border-radius:4px;
	box-shadow:0 3px 6px rgb(0 0 0 / 20%), 0 3px 6px rgb(0 0 0 / 20%);
	margin:2px;
}

.imgListDiv a.image {
	max-width:100%;
}

.imgListNazev {
	display:block;
	padding:6px 0 6px 8px;
	font-size:0.8em;
	font-weight:300;
}

/* Blockquote */

blockquote {
    font-family: var(--font-family-base);
    font-size: 1rem;
    font-style: italic;
}

/* YouTube šablony */

.youtube2main {
	display:flex;
}

.youtube2marginR {
	margin-right: 10px;
}

.youtube2marginL {
	margin-left: 10px;
}

@media only screen and (max-width: 720px) {
	
	.youtube2main {
		display:inline;
	}
	
	.youtube2marginR {
		margin-right: 0;
	}
	
	.youtube2marginL {
		margin-left: 0;
	}

}

/* univerzální classy */

.sirka50-100 {
	width: 50%;
}

@media only screen and (max-width: 720px) {
	
	.sirka50-100 {
	width: 100%;
	}
}

/* Tabulka s otočenou hlavičkou */

.verticalHeader {
	transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	line-height:1;
	position:relative;
	whtie-space:nowrap;
	writing-mode:vertical-rl;
	-webkit-writing-mode:vertical-rl;
	vertical-align:bottom;
}

.tabTHvertical {
	vertical-align:bottom;
}

.tabTHhoriz {
	text-align:right;
}