${i}.
-${agent.name} :
+${agent.name}
${agent.credits}
${agent.hq}
${agent.faction}
diff --git a/css/profile.css b/css/profile.css index a1ad5d8..d7e05d3 100644 --- a/css/profile.css +++ b/css/profile.css @@ -1,68 +1,87 @@ #modal_profile { - width: 50%; - height: 45%; - padding: 0; - background-color: rgba(82, 82, 82, 0.774); - border-width: 0px; + width: 60%; + height: 70%; + padding: 10px; + background-color: rgba(0, 0, 0, 0.521); + border: none; + border-radius: 10px; + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; + color: white; } -.profile-modal +.profile-header { - margin: 20px; - color: white; + width: 100%; display: flex; - flex-direction: column; + align-items: center; + justify-content: space-between; } -.profile-header + +.profile-header p { - font-size: 14px; + font-size: 40px; } + .profile-header button { - font-size: 25px; - width: 30px; - height: 30px; - background-color: transparent; - border-color: transparent; - float: right; -} -.logout-logo img{ - z-index: -1; - position: absolute; - width: 7%; -} -.profile-footer{ display: flex; - flex-direction: column; + justify-content: center; + align-items: center; + border: none; +} + +.profile-header button p +{ + font-size: 25px; + padding: 0; + margin: 0; } -.profile-footer button + +.profile-content { - position: relative; - width: 63px; - height: 63px; - background-color: transparent; - border-color: transparent; + width: 80%; + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr 1fr 1fr 1fr 1fr; + border: 1px solid white; + border-radius: 10px; + padding: 0; } -.profile-footer p + +.profile-content p { - color: red; - font-size: 22px; - margin-bottom: -1px; - margin-top: -9px; + text-align: center; } -.profile-footer button:hover + +.tb-r { - cursor: pointer; + border-right: 1px solid white; } -#btn-token{ - background-color: grey; + +.profile-footer +{ + display: flex; + align-items: center; + justify-content: space-around; + width: 80%; + padding: 5px; } -#btn-token:hover{ - background-color: transparent; - cursor: pointer; + +#btn-logout +{ + width: 60px; + height: 60px; + padding: 0; + border: none; + background: none; } -.profile-header button:hover + +#btn-logout img { - cursor: pointer; + width: 100%; + height: 100%; } \ No newline at end of file diff --git a/html/templates/modal_profile.html b/html/templates/modal_profile.html index 56d02f3..575da89 100644 --- a/html/templates/modal_profile.html +++ b/html/templates/modal_profile.html @@ -1,25 +1,19 @@ -
Name:
-Faction:
-Credit:
-Headquarters:
-Ship count:
-Token:
-Profile
+ +Name
+Faction
+Credits
+Head Quaters
+Number of ships
+${i}.
-${agent.name} :
+${agent.name}
${agent.credits}
${agent.hq}
${agent.faction}