Skip to content
Snippets Groups Projects
style.css 2.1 KiB
Newer Older
Andris Borbás's avatar
Andris Borbás committed
@font-face {
	font-family: "Roboto"; /* Ezen a néven fogunk tudni rá hivatkozni */
	src: url("../font/Roboto-Regular.ttf") format("truetype"); /* Hol található és típusa */
	/* Figyeljünk a címzésre!!! */
}
body {
	font-family: "Roboto"; /* A fentebb 'létrehozott' betűtípust használjuk fel */
}

main {
	background-color: white; /* legyen fehér a háttér */
	/* Ezt csak másoljuk le */
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.dayName {
	background-color: rgb(234, 234, 234); /* szürke háttérszín */
	font-size: large; /* betű méret */
	color: rgb(110, 110, 110); /* szövegszín */
}
.dayTime {
	font-size: medium;
	color: rgb(110, 110, 110);
	text-align: center; /* Középre igazítjuk a szöveget */
}
.event {
	background-color: rgb(23, 166, 151);
	border-radius: 5px; /* lekerekítjük a négy sarkát */
	color: white;
	/* Fogadjuk el, hogy ez van */
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.eventTitle {
	font-size: medium;
	font-weight: 400; /* Mennyire legyen félkövér */
	word-wrap: break-word; /* Ha kell, akkor törd szét a szót, hogy ne lógjon túl */
}
.eventSubdivide .eventTitle,
.length--1 .eventTitle {
	overflow: hidden; /* Elrejtjük a görgetősávat */
	white-space: nowrap; /* Szóköznél nem kezdünk új sort ha nincs elég hely */
}
.eventTime {
	font-size: small; /* Az idő legyen kisebb */
	font-weight: 300; /* Ne legyen annyira vastag */
}
.length--1 {
	/* Mennyi cellát foglaljon el */
	grid-row-end: span 1; /* 1, azaz 1 cellát foglaljon el */
}
.length--2 {
	grid-row-end: span 2; /* 2, azaz 2 cellát foglaljon el */
}
.length--4 {
	grid-row-end: span 4; /* 4, azaz 4 cellát foglaljon el */
}

/* Unortodox csíkozás */
main {
	background: repeating-linear-gradient(
		0deg,
		white,
		white 59px,
		rgb(234, 234, 234) 1px,
		rgb(234, 234, 234) 60px
	);
}
.day {
	border-left: 1px solid rgb(234, 234, 234);
}

/* New stuff */

main {
	position: relative;
}

body::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	background-image: url("../img/rough_bg.jpg");
}