Merge pull request #35 from ICEI-PUC-Minas-PPLCC-TI/develop

Fórum completamente funcional

src/assets/css/style.css

@@ -256,3 +256,41 @@ footer section li a {
 	}
 }
 
+/* OTHERS */
+
+form .input-field {
+  display: flex;
+  flex-direction: column;
+}
+
+form .input-field label {
+	font-size: 1.1em;
+	margin-top: 1em;
+}
+
+form .input-field input,
+form .input-field textarea {
+	max-width: 100%;
+	min-width: 100%;
+	margin-top: 0.5em;
+	padding: 0.5em;
+	border: 1px solid var(--grey);
+	border-radius: .5vmax;
+	font-size: 1.3em;
+}
+
+form button {
+	width: 100%;
+	padding: 1em;
+	border: none;
+	border-radius: .5vmax;
+	margin-top: 1.5em;
+	background-color: var(--principal-blue);
+	color: var(--white);
+	font-weight: bold;
+}
+
+form button:hover {
+	cursor: pointer;
+	background-color: var(--grey);
+}

src/forum/assets/css/forum.css

@@ -1,13 +1,17 @@
-main article{
+main article {
 	background-color: var(--light-grey);
 	margin: 2em auto;
 	padding: 1.5em 2.5em;
 	width: 90%;
 	border-radius: 1.5vmax;
 }
 
+main article.autor {
+	border: 2px solid var(--principal-blue);
+}
+
 button#add-post {
-  float: right;
+	float: right;
 	padding: 1em;
 	border: none;
 	border-radius: .5vmax;
@@ -21,12 +25,16 @@ button#add-post:hover {
  	cursor: pointer;
 }
 
+#posts {
+	display: inline-block;
+}
 
 #posts a {
 	color: inherit;
 }
 
 #posts article h3 {
+	color: var(--principal-blue);
   display: inline;
   margin: 0 1em 0 0;
   vertical-align: middle;
@@ -48,9 +56,29 @@ button#add-post:hover {
 	float: right;
 }
 
-/* #posts span {
-	float: right;
-	background-color: var(--light-grey);
-	padding: 5px 10px;
-	border-radius: 1vmax;
-} */
+#posts article .engajamento span {
+	margin-right: 1em;
+}
+
+#posts article .engajamento button {
+  padding: 0;
+  border: none;
+  background: none;
+  font-size: 1em;
+}
+
+#posts article .engajamento button:hover {
+  cursor: pointer;
+}
+
+#posts article .engajamento .edit {
+  color: var(--blue);
+}
+
+#posts article .engajamento .delete {
+  color: var(--red);
+}
+
+#posts article .engajamento button i {
+  margin-left: .5em;
+}

src/forum/assets/css/modal.css

@@ -0,0 +1,47 @@
+.modal-overlay {
+	display: none;
+  position: fixed;
+  z-index: 1;
+  padding-top: 100px;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background: rgba(0, 0, 0, 0.7);
+}
+
+.modal-content {
+	position: relative;
+	width: 500px;
+	max-width: 90%;
+	background-color: #fefefe;
+	margin: auto;
+	padding: 1.5em;
+	border: 1px solid #888;
+	border-radius: .5vmax;
+}
+
+.modal-overlay #close-modal {
+	position: absolute;
+	right: -10px;
+	top: -20px;
+	z-index: 1;
+	font-size: 2.5em;
+}
+
+.modal-overlay #close-modal i {
+	border-radius: 50%;
+	color: var(--light-red);
+	background-color: var(--light-grey);
+}
+
+.modal-overlay #close-modal i:hover {
+	background-color: var(--white);
+	cursor: pointer;
+}
+
+.modal-content h3 {
+	margin-top: 1.5em;
+	text-align: center;
+}

src/forum/assets/css/post.css

@@ -37,23 +37,30 @@ section.conteudo {
 }
 
 .secao-comentarios {
-  padding: 1em 3em;
+  padding: 1em;
+}
+
+#comentar {
+  display: flex;
+  align-items: center;
 }
 
 #comentar input{
-  width: 60%;
+  flex: 3;
+  margin-right: .5em;
+  vertical-align: middle;
   padding: .6em;
   border: 1px solid #333;
   border-radius: .5vmax;
-  margin-bottom: 1em;
   font-size: 1em;
 }
 
 #comentar button {
- 	padding: 1em;
+  flex: 1;
+  margin: auto;
+  padding: 1em;
 	border: none;
 	border-radius: .5vmax;
-	margin-top: 1.5em;
 	background-color: var(--principal-blue);
 	color: var(--white);
 	font-weight: bold;
@@ -65,5 +72,4 @@ section.conteudo {
 
 section.comentarios {
   margin: 1em 0;
-
 }