Profile meta spacing adjustments
This commit is contained in:
parent
16c31b40ae
commit
360f431880
|
@ -1,7 +1,6 @@
|
||||||
{#if massagedFields.length}
|
{#if massagedFields.length}
|
||||||
<h2 class="sr-only">{intl.fields}</h2>
|
<h2 class="sr-only">{intl.fields}</h2>
|
||||||
<div class="account-profile-meta">
|
<div class="account-profile-meta">
|
||||||
<div class="account-profile-meta-border"></div>
|
|
||||||
{#each massagedFields as field, i}
|
{#each massagedFields as field, i}
|
||||||
<div
|
<div
|
||||||
id="account-profile-meta-name-{i}"
|
id="account-profile-meta-name-{i}"
|
||||||
|
@ -28,7 +27,6 @@
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
<div class="account-profile-meta-border"></div>
|
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
<style>
|
<style>
|
||||||
|
@ -39,42 +37,40 @@
|
||||||
grid-row-gap: 0;
|
grid-row-gap: 0;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
}
|
margin-top: 5px;
|
||||||
|
margin-bottom: 5px;
|
||||||
.account-profile-meta-border {
|
border-top: 1px solid var(--main-border);
|
||||||
height: 1px;
|
border-bottom: 1px solid var(--main-border);
|
||||||
width: 100%;
|
|
||||||
grid-column: 1 / 3;
|
|
||||||
background: currentColor;
|
|
||||||
opacity: 0.2;
|
|
||||||
justify-self: center;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-profile-meta-cell {
|
.account-profile-meta-cell {
|
||||||
|
padding: 4px 0;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-profile-meta-name {
|
.account-profile-meta-name {
|
||||||
padding: 10px 20px 10px 0;
|
|
||||||
color: var(--deemphasized-text-color);
|
color: var(--deemphasized-text-color);
|
||||||
position: relative;
|
position: relative;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
|
padding-right: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-profile-meta-name:after {
|
.account-profile-meta-name:after {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 15%;
|
margin: auto;
|
||||||
height: 70%;
|
height: 60%;
|
||||||
border-right: 1px solid;
|
border-right: 1px solid;
|
||||||
opacity: 0.2;
|
opacity: 0.2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-profile-meta-value {
|
.account-profile-meta-value {
|
||||||
padding: 10px 10px 10px 20px;
|
padding-left: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
:global(.underline-links .account-profile-meta a) {
|
:global(.underline-links .account-profile-meta a) {
|
||||||
|
@ -100,7 +96,7 @@
|
||||||
.account-profile-meta-cell-verified {
|
.account-profile-meta-cell-verified {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
column-gap: 10px;
|
column-gap: 0.8em;
|
||||||
}
|
}
|
||||||
.account-profile-meta-verified {
|
.account-profile-meta-verified {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
@ -108,7 +104,6 @@
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
gap: 0.2em;
|
gap: 0.2em;
|
||||||
margin-left: 0.5em;
|
|
||||||
padding: 2px 0;
|
padding: 2px 0;
|
||||||
padding-left: 4px;
|
padding-left: 4px;
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
|
|
Loading…
Reference in New Issue