mamweb/mamweb/static/css/modules.css

@charset "utf-8"; /* vynuť utf-8 */

/* Bloky použité na webu */


/**** OZNAČENÍ NE-PUBLIC ČÁSTÍ ****/
.mam-org-only {
	background: var(--orgovska-svetla-fialova);
	padding: 10px;
	margin: 10px -10px;
	border: var(--orgovska-fialova) 2px dashed;
}

.mam-org-only .mam-org-only {
	border: 0px;
}

li.mam-org-only {
	padding: 3px 0px;
	margin: -2px 0px;
}
/**********************************/


/**** ZAŠKRTÁVÁTKO ****/
/* Select2 používaný hlavně multiple selectem. Přidání checkboxů a změna barvy. */
/* Podle https://stackoverflow.com/a/48290544 */
/* U autocomplete.ModelSelect2Multiple vyžaduje 'data-dropdown-css-class': 's2m-se-zaskrtavatky' */
.s2m-se-zaskrtavatky .select2-results__option[aria-selected=true]:before {
	content: '☑ ';
	padding: 0 0 0 8px;
}

.s2m-se-zaskrtavatky .select2-results__option[aria-selected=false]:before {
	content: '◻ ';
	padding: 0 0 0 8px;
}

/* Oranžové zvýraznění v Select2 */
.select2-results__option--highlighted {
	background-color: var(--hlavni-oranzova) !important;
}
/**********************/


/**** OTÁČECÍ KARTY ****/
/* (orgové, archiv) */
.flip-card {
	perspective: 1000px; /* Remove this if you don't want the 3D effect */
	margin-left: auto;
	margin-right: auto;
}

#organizatori.flip-card {
	width: 200px;
	height: 250px;
}

#archiv.flip-card {
	width: 210px;
	height: 298px;
}

#archiv-rocnik.flip-card {
	width: 144px;
	height: 205px;
}

#tema-rozcestnik.flip-card {
	width: 300px;
	height: 300px;
}

/* This container is needed to position the front and back side */
.flip-card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	transition: transform 0.8s;
	transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
	transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
}


div.flip-card-foto, div.flip-card-foto img {
	width: 100%;
	height: 100%;

}

/* Style the back side */
.flip-card-back {
	background-color: var(--svetla-oranzova);
	color: black;
	transform: rotateY(180deg);
	padding: 10px;
	padding-top: 20px;
}

#archiv.flip-card-back {
	background-color: white;
}

/* karty archiv */

div.popis_rocniku {
	text-align: left;
	font-weight: bold;
	margin: 20px;
}


div.popis_rocniku a, div.cislo_odkazy a {
	font-weight: bold;
	color: black;
}

div.popis_rocniku a:hover,
div.cislo_odkazy a:hover {
	color: var(--tmava-oranzova);
}

div.cislo_odkazy ul {
	margin: 0px;
	padding: 0px;
}
/***********************/


/**** TABULKY ****/
/** Výsledkovky **/
.tabulka_oramovane_sloupce {
	border: solid 2px;
}

.tabulka_oramovane_sloupce td, .tabulka_oramovane_sloupce th {
	padding: 0.1em 0.3em;
	border-left: solid 1px;
}

.tabulka_oramovane_sloupce thead tr {
	border-bottom: solid 1px;
}

/* Používá se pro podproblémy ve výsledkovkách -- zesvětlí se daný sloupec */
.zesvetleni {
	color: gray;
}
/*****************/


/** Tabulka odevzdaných a došlých řešení **/
.dosla_reseni tr th, .dosla_reseni tr td {
	padding: 1px 10px 1px 10px;
	border-collapse: collapse;
	min-width: 8em; /*Nastřeleno, aby se řádky s řešeními nezalamovaly. Teoreticky není potřeba pro th, ale whatever.*/
}

.dosla_reseni tr:nth-child(even) {
	background: var(--svetlounka-oranzova);
}

/*Přichycování prvního sloupce a řádku*/
.dosla_reseni {
	display: block;
	max-height: 90vh;
	max-width: 90vw;
	overflow: auto;
	margin-left: 5vw;
}

.dosla_reseni thead tr {
	position: sticky;
	top: 0;
	z-index: 1;
}

.dosla_reseni tr:nth-child(even) td:first-child, .dosla_reseni thead tr, .dosla_reseni thead tr:first-child td:first-child {
	background: var(--svetlounka-oranzova);
}

.dosla_reseni tr:nth-child(odd) td:first-child {
	background: var(--barva-pozadi);
}

.dosla_reseni tr td:first-child {
	position: sticky;
	left: 0;
}
/******************************************/


/** Tabulka mých (řešitelových) řešení **/
.odevzdana_reseni tr th, .odevzdana_reseni tr td {
	border: 1px solid black;
	padding: 1px 10px 1px 10px;
	border-collapse: collapse;
	text-align: center;
}

.odevzdana_reseni.problem tr td {
	text-align: left;
}
/****************************************/


/** Detail řešení **/
.bodovani>input {
	width: 4em;
}

.bodovani>input::placeholder {
	color: lightgray;
	opacity: 1;
}

.bodovani>input::-webkit-input-placeholder { /* Edge */
	color: lightgray;
}

/* td obsahující křížek v detailu řešení se nesmí smrštit na 0 */
/* FIXME až bude firefox příčetný, nahradit td:has(.smazat_hodnoceni) */
.has_smazat_hodnoceni {
	min-width: 20px;
	padding: 3px;
}
/*******************/
/*****************/


/**** FORMULÁŘE ****/
/* přihláška a další formuláře */

table.form td, table.form tr {
	table-layout: fixed;
	word-wrap: break-word;
	padding: 5px;
}

table#reseni.form td,  table#reseni.form tr {
	display: inline-table;
}

input[type="file"] {
	max-width: 250px;
	text-overflow: ellipsis;
}

.field-with-comment{
	position:relative;
}

.field-comment{
	display:none;
	text-shadow: 0 1px 0 #fff;
	background-color: #f0f0f0 ;
	border-color: #dbdbdb;
	position:absolute;
	z-index:100;
	border:1px;
	border-style:solid;
	border-width:1px;
	border-radius: 5px;
	padding:3px;
	top:50px;
	left:10px;
}

.field-with-comment:hover span.field-comment{
	display: block;
}

input {
	margin: 5px;
}

textarea.feedback {
	margin: 5px;
}



ul.form {
	list-style-type: none;
	padding-left: 0px;
}
label.field-label {
	font-weight: normal;
}
label.field-required {
	font-weight: bold;
}
.field-error {
	font-size: 14px;
	color: red;
}
ul.form li{
	margin-bottom: 3px;
}
p.gdpr {
	font-size: 6pt;
	margin-bottom: .66em;
}
div.gdpr {
	font-size: 6pt;
}

/* registrace */
label[for=id_skola] {
	font-weight: bold;
}

/*******************/