Merge pull request #36 from ICEI-PUC-Minas-PPLCC-TI/projetos

Adicionando página de projetos

src/projetos/assets/css/criarprojeto.css

@@ -0,0 +1,229 @@
+@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap");
+
+:root {
+  --principal-blue: #1372bf;
+	--white: #f9f9f9;
+	--light-grey: #cccccc;
+	--grey: #858585;
+	--black: #2C2C2C;
+	--light-blue: #88FFFF;
+	--light-yellow: #FFFC5C;
+	--light-red: #FF5544;
+	--light-green: #55AA55;
+}
+
+* {
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+}
+
+body {
+	background-color: var(--white);
+	font-family: "Poppins", sans-serif;
+}
+
+h1 {
+	margin-top: 20px;
+	text-align: center;
+}
+
+h2 {
+	display: block;
+	margin: 1em auto 0.5em;
+	font-size: 2em;
+	text-align: start;
+}
+
+h3 {
+	width: 100%;
+	margin: 1em 0 .5em;
+	font-size: 1.4em;
+	color: var(--white);
+}
+
+a {
+	text-decoration: none;
+}
+
+ul {
+	list-style: none;
+}
+
+/* HEADER */
+header {
+	position: sticky;
+	top: 0;
+	width: 100%;
+	padding: 1em 0;
+	z-index: 1;
+	background-color: var(--black);
+}
+
+.logo {
+	display: inline-block;
+	margin-left: 20px;
+	color: var(--principal-blue);
+	font-size: 1.5em;
+  font-family: 'Bungee', sans-serif;
+}
+
+nav {
+	position: fixed;
+	width: 100%;
+	height: 100%;
+	max-height: 0;
+	overflow: hidden;
+	background-color: var(--black);
+	transition: max-height .5s ease-out;
+}
+
+.menu a {
+	display: block;
+	padding: 10px 25px;
+	color: var(--white);
+}
+
+nav ul {
+	margin: 0 20px;
+}
+
+nav ul li{
+	margin: 0 3px;
+}
+
+nav ul li:hover,
+nav ul li:last-child {
+	background: var(--principal-blue);
+	transition: .5s linear;
+}
+
+.hamb {
+	margin: 0 2em;
+	padding: 20px 20px;
+	float: right;
+	cursor: pointer;
+}
+
+.hamb-line {
+	display: block;
+	position: relative;
+	width: 24px;
+	height: 3px;
+	background: var(--white);
+}
+
+.hamb-line::before,
+.hamb-line::after {
+	display: block;
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	content: '';
+	background: var(--white);
+	transition: all .2s ease-out;
+}
+
+.hamb-line::before {
+	top: 7px;
+}
+
+.hamb-line::after {
+	top: -7px;
+}
+
+.side-menu {
+	display: none;
+}
+
+.side-menu:checked ~ nav {
+	max-height: 100%;
+}
+
+.side-menu:checked ~ .hamb .hamb-line {
+	background: transparent;
+}
+
+.side-menu:checked ~ .hamb .hamb-line::before {
+	top:0;
+	transform: rotate(-45deg);
+}
+
+.side-menu:checked ~ .hamb .hamb-line::after {
+	top:0;
+	transform: rotate(45deg);
+}
+
+@media (min-width: 768px) {
+	nav {
+		position: relative;
+		width: fit-content;
+		max-height: none;
+		top: 0;
+		float: right;
+		background-color: transparent;
+	}
+
+	.menu li {
+		float: left;
+	}
+
+	.hamb {
+		display: none;
+	}
+}
+
+/* MAIN CONTENT */
+main {
+	width: 800px;
+	max-width: 100%;
+	margin: auto;
+	padding: 0 1em;
+}
+
+/* FOOTER */
+footer {
+	display: grid;
+	grid-template-columns: 4fr 3fr;
+	margin-top: 3em;
+	padding: 1em 4em 3em;
+	background-color: var(--black);
+	color: var(--light-grey);
+}
+
+footer section {
+	display: flex;
+	width: 100%;
+	min-height: 15em;
+	padding: 0 2em;
+	flex-direction: column;
+}
+
+footer section p {
+	margin-top: .5em;
+	text-align: justify;
+}
+
+footer section li {
+  list-style: none;
+}
+
+footer section li a {
+  font-weight: bold;
+  text-decoration: underline;
+  color: inherit;
+}
+
+@media screen and (max-width: 1024px) {
+	footer {
+		padding: 1em;
+	}
+}
+
+@media screen and (max-width: 768px) {
+	footer {
+		grid-template-columns: 1fr;
+		padding: 0;
+	}
+}