Skip to content

IgnorePT/ex2-react-card

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Exercicio 2 - Card

Cria um cartão que possua a seguinte estrutura utilizando os metodos (createElement, createRoot) em javascript que possua a seguinte estrutura:

<div class="card">
	<div class="fs-top"></div>
	<div class="avatar-holder">
		<img
			src="path para imagem"
			alt="alt de imagem"
		/>
	</div>
	<div class="name">
		<a href="link para perfil" target="_blank">
			Inserir nome
		</a>
		<h6 title="Seguidores">
			<i class="fas fa-users"></i> <span class="followers">90</span>
		</h6>
	</div>
	<div class="fs-info">
		<div class="fs components">
			<h6 title="Numero de componentes criados pelo user">Componentes</h6>
			<p>29</p>
		</div>
		<div class="fs projects">
			<h6 title="Numero de projetos criados pelo utilizador">Projetos</h6>
			<p>10</p>
		</div>
		<div class="fs posts">
			<h6 title="Numero de posts">Posts</h6>
			<p>5</p>
		</div>
	</div>
	<div class="fs-skill">
		<h6>Skills <i class="fa fa-code" aria-hidden="true"></i></h6>
		<div class="skill html">
			<h6><i class="fab fa-html5"></i> HTML5</h6>
			<div class="bar bar-html">
				<p>95%</p>
			</div>
		</div>
		<div class="skill css">
			<h6><i class="fab fa-css3-alt"></i> CSS3</h6>
			<div class="bar bar-css">
				<p>90%</p>
			</div>
		</div>
		<div class="skill javascript">
			<h6><i class="fab fa-js"></i> JavaScript</h6>
			<div class="bar bar-js">
				<p>75%</p>
			</div>
		</div>
	</div>
</div>

Dados Opcionais:

Nome: Edward H Thomas Imagem: https://www.fakepersongenerator.com/Face/male/male1085727541717.jpg Perfil: https://www.fakepersongenerator.com/

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published