User:GrantMasterMariya/ModernProfile.css

/* @author <community.fandom.com/wiki/Dr.Bryan */

/* = Профиль = */ /* Отступы */ .skin-fandomdesktop #userProfileApp { --width-padding: 186px; margin: -20px -15px 12px -25px !important; }


 * 1) userProfileApp .user-identity-box,
 * 2) userProfileApp .user-identity-header__actions button {margin: 0;}

/* Аватар */ body.skin-fandomdesktop #userProfileApp .user-identity-avatar { /* 	margin: 0 !important; */ /* 	margin: 0 28px 20px 0; */ padding: 18px 0 0 28px; width: 140px; height: 140px; z-index: 1; box-sizing: content-box; }   border: solid 2px var(--theme-accent-color) !important; box-shadow: 0 0 10px rgb(0 0 0 / 50%); }
 * 1) userProfileApp .user-identity-avatar__image {

/* Хэдер */ body.skin-fandomdesktop #userProfileApp .user-identity-header { width: calc(100% + var(--width-padding)); position: relative; left: calc(var(--width-padding)*-1); padding-left: var(--width-padding); min-height: 37px; background: var(--theme-accent-color); }
 * 1) userProfileApp .user-identity-header :is(h1,h2) {color: var(--theme-accent-label-color, white);}

display: flex; align-items: center; flex-wrap: wrap; grid-row-gap: 5px; } body.skin-fandomdesktop #userProfileApp .user-identity-header__tag { margin: 6px 12px 6px 0 !important; background-color: var(--theme-accent-color--hover); color: var(--theme-accent-label-color); }
 * 1) userProfileApp .user-identity-header__attributes,
 * 2) userProfileApp .user-identity-header__action {

/* Править профайл */ display: flex; align-items: center; } body.skin-fandomdesktop #userProfileApp .user-identity-header__actions .wds-button, .modal-wrapper__header .modal-wrapper__cta-button { padding: .4em .8em; margin-right: 1em; border: none; border-radius: 18px; /*    vertical-align: middle; */ color: rgb(var(--theme-accent-dynamic-color-2--rgb),.5); } body.skin-fandomdesktop #userProfileApp .user-identity-header__actions .wds-button:hover, .modal-wrapper__header .modal-wrapper__cta-button:hover, .modal-wrapper__header .wds-is-square:hover { color: var(--theme-page-accent-mix-color) !important; background-color: rgba(var(--theme-link-color--rgb),.3); }
 * 1) userProfileApp .user-identity-header__actions {

/* Вкладки */ /* .user-profile-navigation {padding-left: 18px;} */ border-bottom: none !important; /* 	margin-right: -1px; */ }	padding: 0 !important; width: 100%; text-align: center !important; border-bottom: 4px solid; transition: .2s; }	display: block; color: var(--theme-link-color) !important; padding: 10px 15px; font-weight: bold; text-decoration: none; text-shadow: none; }	text-transform: capitalize !important; }   border-bottom-color: var(--theme-link-color) !important; }   color: var(--theme-link-color); }	border-bottom-color: var(--theme-link-color) !important; opacity: 1; transition: .2s; }
 * 1) userProfileApp .user-profile-navigation {
 * 1) userProfileApp .user-profile-navigation__link {
 * 1) userProfileApp .user-profile-navigation__link a {
 * 1) userProfileApp .user-profile-navigation__link:nth-child(2) a {
 * 1) userProfileApp .user-profile-navigation__link.is-active {
 * 1) userProfileApp .user-profile-navigation__link.is-active a {
 * 1) userProfileApp .user-profile-navigation__link:not(.is-active):hover {

/* = Редактирование профиля = */ padding: 0 !important; } .modal-wrapper__header { background: var(--theme-accent-color); margin-bottom: -37px !important; padding: 0 0 0 20px !important; /* 	height: 53px !important; */ color: var(--theme-accent-label-color)!important; } .modal-wrapper__header h3 {display: none;} .modal-wrapper__header .wds-is-square { color: var(--theme-page-accent-mix-color); border-radius: 18px; } .modal-wrapper__header .modal-wrapper__cta-button, .modal-wrapper__header .wds-is-square { position: relative; z-index: 2; } .theme-fandomdesktop-dark :is(.modal-wrapper__header .modal-wrapper__cta-button, .modal-wrapper__header .wds-is-square) {color: var(--theme-link-color);} /* Форма заполнения */ .user-profile-editor__form h1 { color: var(--theme-accent-label-color); line-height: normal; } .user-profile-editor__form {margin-top: 2px;} .user-profile-editor__form .wds-fieldset {padding-top: 0;} .user-identity-avatar__actions { /*    position: absolute; */ /*    z-index: 1; */ /* 	bottom: 0px !important; */ /* 	right: -10px !important; */ border-radius: 50%; box-shadow: 0 0 10px rgb(0 0 0 / 50%); transition: .5s; } .user-identity-avatar__actions svg { color: var(--theme-link-color); transition: color .3s; } .user-identity-avatar__actions:hover svg {color: var(--theme-link-color--hover);} @media (min-width: 1084px) { .user-identity-avatar__actions {opacity: .4;} } .user-identity-avatar:hover .user-identity-avatar__actions {opacity: 1;}
 * 1) userProfileApp .modal-wrapper__main {

/* Адаптация под малый размер */ @media (max-width: 664px) { .user-profile-navigation {overflow-x: scroll; white-space: nowrap;} .user-profile-navigation__link {width: auto !important;} .user-identity-header {flex-direction: column;} .user-identity-box {flex-direction: column;} .user-identity-avatar {padding: 0 !important; margin: 10px auto !important;} .user-identity-header { width: 100% !important; left: 0 !important; padding-left: 0px !important; gap: 0px !important; align-items: center; }	.user-identity-box__info {display: flex; flex-direction: column; gap: 10px;} .user-identity-box__info > :is(ul,div:not(.user-identity-header)) {margin: 0 0 0 20px !important;} }