Improve project styles or something

This commit is contained in:
Ben Visness 2021-10-27 21:54:20 -05:00
parent 4e47c51fa1
commit 2882c49b2b
3 changed files with 53 additions and 46 deletions

View File

@ -34,7 +34,7 @@
<div>made</div>
</a>
<a href="{{ .Project.Url }}">
<h2 class="mb0 mt2 mt0-ns ml3-ns">{{ .Project.Name }}</h2>
<h2 class="mb0 mt2 mt0-ns mh3 mr0-ns tc tl-ns">{{ .Project.Name }}</h2>
</a>
{{ with .Header.Project }}
<div class="{{ $itemsClass }}">

View File

@ -7,27 +7,32 @@
{{ end }}
{{ define "content" }}
<div class="flex flex-column flex-row-ns">
<div class="sidebar flex-shrink-0 mw5 self-center self-start-ns mh3 ml0-ns overflow-hidden">
<img alt="{{ .Project.Name }}" class="br3" src="{{ .Project.Logo }}" />
<a href="{{ .CurrentProjectUrl }}">
<h2 class="mt3">{{ .Project.Name }}</h2>
</a>
<div class="mt3">
<div class="flex flex-column flex-row-l">
<div class="
sidebar flex-shrink-0 self-start-l
flex flex-column flex-row-ns items-start-ns flex-column-l items-stretch-l
mw5-l mh3 ml0-ns mb3 overflow-hidden
">
<div class="w-100 w5-ns flex-shrink-0 flex justify-center">
<img alt="{{ .Project.Name }}" class="br3" src="{{ .Project.Logo }}">
</div>
<div class="mt3 mt0-ns mt3-l ml3-ns ml0-l overflow-hidden">
<div class="mb3">
{{ range $i, $owner := .Owners }}
<div class="flex mv3 items-center {{ if eq $i 0 }}mt2{{ end }}">
<div class="flex mb3 items-center">
<img class="avatar-icon mr2" src="{{ $owner.AvatarUrl }}" />
<a class="user-link" href="{{ $owner.ProfileUrl }}">{{ $owner.Name }}</a>
</div>
{{ end }}
</div>
{{ range .ProjectLinks }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">{{ .Name }}</div>
<div class="value projectlink truncate"><a class="external" href="{{ .Url }}" ><span class="icon-{{ .Icon }}"></span> {{ .LinkText }}</a></div>
</div>
{{ end }}
<div class="w-100 w-auto-ns w-100-l">
{{ range .ProjectLinks }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">{{ .Name }}</div>
<div class="value projectlink truncate"><a class="external" href="{{ .Url }}" ><span class="icon-{{ .Icon }}"></span> {{ .LinkText }}</a></div>
</div>
{{ end }}
</div>
</div>
</div>
<div class="flex-grow-1 overflow-hidden">

View File

@ -2,6 +2,39 @@
{{ define "content" }}
<div class="flex flex-column flex-row-l">
<div class="
sidebar flex-shrink-0 self-start-l
flex flex-column flex-row-ns items-start-ns flex-column-l items-stretch-l
mw5-l mh3 ml0-ns mb3 overflow-hidden
">
<div class="w-100 w5-ns flex-shrink-0 flex justify-center">
<img class="br3" alt="{{ .ProfileUser.Name }}'s Avatar" src="{{ .ProfileUser.AvatarUrl }}">
</div>
<div class="mt3 mt0-ns mt3-l ml3-ns ml0-l flex flex-column items-start overflow-hidden">
{{ with or .ProfileUser.Bio .ProfileUser.Blurb }}
<div class="mb3">{{ . }}</div>
{{ end }}
<div class="w-100 w-auto-ns">
{{ if .ProfileUser.Email }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">Email</div>
<div class="value projectlink truncate">{{ .ProfileUser.Email }}</div>
</div>
{{ end }}
{{ range .ProfileUserLinks }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">{{ .Name }}</div>
<div class="value projectlink truncate"><a class="external" href="{{ .Url }}" ><span class="icon-{{ .Icon }}"></span> {{ .LinkText }}</a></div>
</div>
{{ end }}
<div class="pair flex">
<div class="key flex-auto flex-shrink-0 mr2">Member since</div>
<div class="value projectlink truncate">{{ absoluteshortdate .ProfileUser.DateJoined }}</div>
</div>
</div>
</div>
</div>
<div class="flex-grow-1 overflow-hidden">
{{ with .ProfileUserProjects }}
<div class="content-block ph3 ph0-ns">
@ -37,37 +70,6 @@
</div>
{{ end }}
</div>
<div class="sidebar flex-shrink-0 mw6 w-30-l self-center self-start-l mh3 mh0-ns ml3-l overflow-hidden">
<div class="content-block box avatar">
<img alt="{{ .ProfileUser.Name }}'s Avatar" src="{{ .ProfileUser.AvatarUrl }}" />
</div>
<div class="content-block box list">
<div class="content-block">
<div class="description">
<p>{{ .ProfileUser.Bio }}</p>
</div>
</div>
<div class="pair flex flex-wrap">
<div class="key flex-auto mr1">Member since</div>
<div class="value">{{ absoluteshortdate .ProfileUser.DateJoined }}</div>
</div>
{{ if .ProfileUser.Email }}
<div class="pair flex flex-wrap">
<div class="key flex-auto mr1">Email</div>
<div class="value">{{ .ProfileUser.Email }}</div>
</div>
{{ end }}
{{ range .ProfileUserLinks }}
<div class="pair flex flex-wrap">
<div class="key flex-auto mr1">{{ .Name }}</div>
<div class="value projectlink"><a class="external" href="{{ .Url }}" ><span class="icon-{{ .Icon }}"></span> {{ .LinkText }}</a></div>
</div>
{{ end }}
</div>
</div>
</div>
<script>
const filterTitles = [];