Commit 03bafab8 authored by Erik Moravec's avatar Erik Moravec
Browse files

feat: team list UI finetune

parent c502d333

web/src/app/components/teams/teams.component.css

+17 −4
Original line number Original line Diff line number Diff line 




.teams {

.teams {

  list-style-type: none;

  list-style-type: none;

  width: 15em;

  width: 30rem;

}

}





.teams li {

.teams li {
@@ -10,10 +10,13 @@ 
  left: 0;

  left: 0;

  background-color: #EEE;

  background-color: #EEE;

  height: fit-content;

  height: fit-content;

  width: fit-content;

  border-radius: 4px;

  border-radius: 4px;

  align-items: center;

  align-items: center;

  vertical-align: center;

  vertical-align: middle;

  margin-bottom: 1rem;

  margin-bottom: 1rem;

  white-space: nowrap;

  padding: 0.2rem;

}

}





.teams li:hover {

.teams li:hover {
@@ -39,12 +42,22 @@ 




.teams .badge {

.teams .badge {

  display: inline-block;

  display: inline-block;

  height:max-content;

  font-size: small;

  font-size: small;

  color: white;

  color: white;

  background-color: #405061;

  background-color: #405061;

  line-height: 1em;

  position: relative;

  position: relative;

}





.teams .text {

    margin-top: 1.2rem;

    place-self: center;

    vertical-align: middle;

    height: fit-content;

    font-size: large;

    color: black;

    position: relative;

    padding-left: 0.3rem;

  }

  }





input {

input {

web/src/app/components/teams/teams.component.html

+3 −2
Original line number Original line Diff line number Diff line 
<h2>Teams</h2>

<h2 class="fw-bold ms-4 mt-1 fs-2">Teams</h2>

<ul class="teams">

<ul class="teams">

  <li *ngFor="let team of teams">

  <li *ngFor="let team of teams">

    <span class="badge">{{team.id}}</span> {{team.name}}

    <span class="badge">{{team.id}}</span>

    <span class="text">{{team.name}}</span>

  </li>

  </li>

</ul>
 
</ul>