Add splitted element on profile and add first steps of create characters menu
This commit is contained in:
parent
af987ce195
commit
8e3d83cc43
@ -116,14 +116,40 @@
|
||||
backdrop-filter: blur(5px);
|
||||
border-radius : 15px;
|
||||
width: calc(90vw);
|
||||
height: calc(80vh);
|
||||
height: calc(85vh);
|
||||
|
||||
margin-left: calc(5%);
|
||||
margin-top: calc(5%);
|
||||
margin-left: calc(5vw);
|
||||
margin-top: calc(5vh);
|
||||
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.flex-box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.charlist-item {
|
||||
width: 25vw;
|
||||
}
|
||||
|
||||
.avatar-on-charlist {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-right: 15px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.characters-menu {
|
||||
width: 25vw;
|
||||
height: 75vh;
|
||||
}
|
||||
|
||||
.character-menu {
|
||||
float: left;
|
||||
width: 65vw;
|
||||
height: 75vh;
|
||||
}
|
||||
|
||||
/* $accordion-color:green; */
|
||||
/* $accordion-padding-y:1.3rem; */
|
||||
/* $accordion-padding-x:2.5rem; */
|
||||
|
@ -104,6 +104,22 @@ ServerAuth.mainMenuForm.innerHTML = `
|
||||
<div id="main-panel" >
|
||||
<div id="main-content">
|
||||
<center><h2>Your Profile</h2></center><hr/>
|
||||
<div class="flex-box">
|
||||
<div class="characters-menu">
|
||||
<center><h4>Characters</h4></center>
|
||||
<div class="user-character-list btn-group-vertical charlist-item" role="group" aria-label="Characters">
|
||||
<button type="button" class="btn btn-dark btn-outline-light">
|
||||
<div class="flex-box"><img src="https://fullgream.tech/assets/contacts-image.jpg" class="avatar-on-charlist" /><h5>John Doe</h5></div>
|
||||
</button>
|
||||
<button type="button" class="btn btn-success btn-outline-light">Add character</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="character-menu">
|
||||
<center><h4>Character</h4></center>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user