User Information

Link to article: User Information.

Module Styles

• #ui-tabs {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
      grid-template-columns: repeat(auto-fit,minmax(min((100% - 1.25rem),max(20ch,(100% - 1.25rem)/3)),1fr));
      gap: .5rem;
  }
  
  #ui-tabs li { display: contents; }
  #ui-tabs li a {
      display: flex;
      padding: .375em .625em;
      border-radius: .375rem;
      align-items: center;
  }
  #ui-tabs li a:is(:hover,:focus) {
      background-color: #b012;
  }
  #ui-tabs li.active a {
      background-color: #884148;
      color: white;
  }
  
  .col-md-9 {
      padding-top: 1rem;
      margin-top: 1rem;
      border-top: solid .05rem #ccc;
  }
  
  .dl-horizontal {
      display: grid;
      grid-template-columns: minmax(0,1fr) minmax(0,4fr);
      gap: .5rem;
  }
  
  #user-info-area :is(dt,dd) {
      padding: 0;
      margin: 0;
  }
  .dl-horizontal dt { font-weight: bold; }
  
  #user-info-area > dl a { font-weight: 600; }
  #user-info-area > dl > dt small { color: #999; }
  #user-info-area > dl > dt small::before {
      content: "—";
      margin-inline: .25em;
  }
  #user-info-area > dl > dd { margin-block: .125em .75em; }

Inline Styles

• (none)

Includes

• (none)

CSS Classes

• (none)

Page Source

[[module UserInfo]]

[[module CSS]]
#ui-tabs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min((100% - 1.25rem),max(20ch,(100% - 1.25rem)/3)),1fr));
    gap: .5rem;
}

#ui-tabs li { display: contents; }
#ui-tabs li a {
    display: flex;
    padding: .375em .625em;
    border-radius: .375rem;
    align-items: center;
}
#ui-tabs li a:is(:hover,:focus) {
    background-color: #b012;
}
#ui-tabs li.active a {
    background-color: #884148;
    color: white;
}

.col-md-9 {
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: solid .05rem #ccc;
}

.dl-horizontal {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,4fr);
    gap: .5rem;
}

#user-info-area :is(dt,dd) {
    padding: 0;
    margin: 0;
}
.dl-horizontal dt { font-weight: bold; }

#user-info-area > dl a { font-weight: 600; }
#user-info-area > dl > dt small { color: #999; }
#user-info-area > dl > dt small::before {
    content: "—";
    margin-inline: .25em;
}
#user-info-area > dl > dd { margin-block: .125em .75em; }
[[/module]]