Pagina profilo e modiche al theme

Template.Shared/Components/Pages/PersonalInfo.razor.css

@@ -0,0 +1,95 @@
+.section-primary-info {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.personal-info {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    line-height: normal;
+    margin: 2rem 0;
+}
+
+.info-nome {
+    color: var(--mud-palette-text-primary);
+    font-weight: 800;
+    font-size: x-large;
+}
+
+.info-section {
+    color: var(--mud-palette-gray-default);
+    font-size: medium;
+    font-weight: 600;
+}
+
+.section-info {
+    width: 100%;
+    margin-bottom: 1rem;
+    border-radius: 12px;
+    display: flex;
+    justify-content: space-between;
+    flex-direction: row;
+    padding: .8rem 1.2rem;
+    background: var(--mud-palette-surface);
+}
+
+.section-personal-info {
+    display: flex;
+    flex-direction: column;
+}
+
+    .section-personal-info > div {
+        display: flex;
+        flex-direction: column;
+        line-height: normal;
+        margin: .25rem 0;
+    }
+
+.info-title {
+    color: var(--mud-palette-gray-darker);
+    font-weight: 800;
+}
+
+.info-text {
+    color: var(--mud-palette-text-secondary);
+    font-weight: 700;
+    font-size: small;
+}
+
+.user-button {
+    border: 2px solid var(--mud-palette-overlay-dark);
+    margin-top: 1rem;
+    background: transparent;
+    text-align: center;
+    border-radius: 6px;
+    padding: .45rem 2rem;
+    width: 100%;
+    font-weight: 700;
+    line-height: normal;
+}
+
+.user-button.logout {
+    border: 2px solid var(--mud-palette-error);
+    color: var(--mud-palette-error);
+}
+
+.user-button > i { font-size: large; }
+
+.user-button > span {
+    font-size: medium;
+    font-weight: 600;
+}
+
+.status {
+    font-weight: 700;
+}
+
+.status.online {
+    color: var(--mud-palette-success);
+}
+
+.status.offline {
+    color: var(--mud-palette-error);
+}