Commit 030af7f5 authored by Nicolas Vetsch's avatar Nicolas Vetsch Committed by lic
Browse files

Profile page style & responsiveness

parent eb37c7be
......@@ -60,7 +60,6 @@
"commissions.no_contact_info": "Keine Kontaktinformationen",
"profile.free_beer": "Du bist berechtigt, gratis Bier zu beziehen!",
"profile.set_rfid": "Setze deine RFID unten, um gratis Bier zu erhalten!",
"profile.membership": "Art der Mitgliedschaft",
"profile.change_password": "Passwort ändern",
"profile.revert_to_ldap": "Zu LDAP zurückkehren",
"profile.set_password": "Passwort setzen",
......
......@@ -60,7 +60,6 @@
"commissions.no_contact_info": "No contact information.",
"profile.free_beer": "You are allowed to get free beer!",
"profile.set_rfid": "Set your RFID below to get free beer!",
"profile.membership": "Membership type",
"profile.change_password": "Change password",
"profile.revert_to_ldap": "Revert to LDAP",
"profile.set_password": "Set password",
......
#profile-container {
display: grid;
grid-template-columns: repeat(12, auto);
grid-template-columns: repeat(12, 1fr);
grid-gap: 1.5em;
border: none;
margin-top: 2em;
margin-bottom: 2em;
@media @mobile {
grid-template-columns: repeat(6, 1fr);
}
#info {
grid-column: ~'1 / 13';
grid-row: ~'1 / 2';
background-color: #ddd;
border: 1px solid @color-grey;
background-image: linear-gradient(@color-grey, #fff);
//border: 1px solid @color-grey;
display: flex;
justify-content: space-between;
@media @mobile {
grid-column: ~'1 / 7';
}
}
#user-info {
#info-user {
grid-column: ~'1 / 7';
text-align: left;
padding: .5em;
margin: .5em;
font-size: x-large;
}
#amiv-info {
text-align: end;
padding: .5em;
#info-amiv {
grid-column: ~'8 / 13';
text-align: right;
font-size: large;
padding: 1em;
@media @mobile {
grid-column: ~'1 / 7';
}
}
#sessions-subscriptions {
......@@ -31,11 +50,11 @@
border: 1px solid @color-grey;
.announce-subscription {
padding: 5px;
padding: .1em;
}
.sessions {
padding: 5px;
padding: .1em;
}
}
......@@ -59,20 +78,35 @@
grid-column: ~'7 / 13';
grid-row: ~'2 / 4';
background-color: #fdfdfd;
display: grid;
display: flex;
flex-direction: column;
justify-content: flex-start;
grid-template-columns: repeat(3, 1fr);
padding: 15px;
border: 1px solid @color-grey;
max-height: min-content;
@media @mobile {
grid-column: ~'1 / 7';
grid-row: ~'6 / 8';
}
}
#groups {
grid-column: ~'7 / 13';
grid-row: ~'4 / 6';
background-color: #fdfdfd;
display: grid;
display: flex;
flex-direction: column;
justify-content: flex-start;
grid-template-columns: repeat(3, 1fr);
padding: 15px;
border: 1px solid @color-grey;
@media @mobile {
grid-column: ~'1 / 7';
grid-row: ~'8 / 10';
}
}
}
......@@ -85,6 +119,8 @@
#group-list {
grid-row: ~'2 / 3';
grid-column: ~'1 / -1';
max-height: 13em;
overflow: scroll;
.group-entry {
grid-column: ~'1 / -1';
......
......@@ -24,11 +24,8 @@ export default class UserInfo {
}
return m('div#info', [
m('div#user-info', [m('b', [user.firstname, ' ', user.lastname]), m('div', user.legi)]),
m('div#amiv-info', [
m('div', [i18n('profile.membership'), ': ', m('b', i18n(`${user.membership}_member`))]),
freeBeerNotice,
]),
m('div#info-user', [m('b', [user.firstname, ' ', user.lastname]), m('div', user.legi)]),
m('div#info-amiv', [m('div', m('b', i18n(`${user.membership}_member`))), freeBeerNotice]),
]);
}
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment