public/stylesheets/profile-list.scss
// FIXME: move to more specific places
.profile-list {
margin: 0px;
padding: 0px;
list-style: none;
}
.profile-list li {
display: inline-block;
margin: 5px;
padding: 5px;
list-style: none;
}
.profile-list li:hover {
background-color: #eeeeec;
}
.profile-list img {
border: none;
}
.controller-favorite_enterprises .profile-list a.profile-link,
.controller-friends .profile-list a.profile-link,
.controller-followers .profile-list a.profile-link,
.list-profile-connections .profile-list a.profile-link,
.profiles-suggestions .profile-list a.profile-link {
text-decoration: none;
text-align: center;
display: block;
font-size: 12px;
}
.controller-favorite_enterprises .profile-list a.profile-link:hover,
.controller-friends .profile-list a.profile-link:hover,
.controller-followers .profile-list a.profile-link:hover,
.profiles-suggestions .profile-list a.profile-link:hover {
color: #FFF;
}
.controller-favorite_enterprises .profile-list .profile_link span,
.controller-friends .profile-list .profile_link span,
.controller-followers .profile-list .profile_link span,
.box-1 .profiles-suggestions .profile-list .profile_link span {
width: 80px;
display: block;
overflow: hidden;
}
#manage_friends {
.profile-list {
@media only screen and (max-width: 960px) {
width: 345px;
margin: auto;
}
@media only screen and (max-width: 768px) {
width: 250px;
margin: auto;
}
}
.button-bar {
display: flex;
a.button {
flex-grow: 1;
}
}
.pagination {
margin: 0;
}
}
#manage_followed {
.profile-list {
@media only screen and (max-width: 960px) {
width: 345px;
margin: auto;
}
@media only screen and (max-width: 768px) {
width: 250px;
margin: auto;
}
}
.button-bar {
display: inline-block;
margin-right: 7px;
@media only screen and (max-width: 768px) {
display: flex;
margin-right: 0px;
a {
flex-grow: 1;
}
}
}
select#profile-type-filter {
display: inline-block;
@media only screen and (max-width: 768px) {
width: 100%;
}
}
}
.controller-favorite_enterprises .profile-list {
@media only screen and (max-width: 960px) {
text-align: center;
}
li {
display: inline-flex;
width: 250px;
a {
flex-grow: 1;
img {
display: block;
width: 64px;
margin: auto;
margin-bottom: 4px;
}
}
.control {
width: 25px;
a.remove-favorite-enterprise {
display: none;
}
}
&:hover {
a.remove-favorite-enterprise {
display: block;
color: #ccc !important;
&:hover {
color: #babdb6 !important;
}
}
}
}
}
.controller-friends .profile-list,
.controller-followers .profile-list,
.profiles-suggestions .profile-list {
li {
width: 100px;
img {
display: block;
width: 64px;
margin: auto;
margin-bottom: 4px;
}
a {
width: 100%;
}
}
}
.controller-favorite_enterprises .profile-list .control,
.controller-friends .profile-list .control,
.controller-followers .profile-list .control,
.profiles-suggestions .profile-list .control {
display: flex;
width: 64px;
margin: auto;
margin-top: 2px;
a {
color: #212e3c !important;
flex-grow: 1;
text-align: center;
}
}
.controller-favorite_enterprises .profile-list .control a,
.controller-friends .profile-list .control a,
.controller-followers .profile-list .control a,
.profiles-suggestions .profile-list .control a {
display: block;
margin-bottom: 2px;
}
.controller-favorite_enterprises .msie6 .profile-list .control a,
.controller-friends .msie6 .profile-list .control a,
.controller-folloed_people .msie6 .profile-list .control a,
.profiles-suggestions .msie6 .profile-list .control a {
width: 0px;
}
.profiles-suggestions .profile-list .extra_info p {
margin: 0px;
}
.profiles-suggestions .profile-list .extra_info a {
text-decoration: none;
padding: 0;
}
.profile-connections {
height: 20px;
}
.tag-connections {
margin-left: 2px;
margin-top: 3px;
overflow: hidden;
width: 100px;
}
#content .block-footer-content .profiles-suggestions .tag-connections a.more-tag-connections {
text-decoration: underline;
font-size: 14px;
}
#content .profiles-suggestions .profile-list .extra_info .profile-suggestion-connection-icon {
position: relative;
}
.profiles-suggestions .profile-list .extra_info big {
font-size: 14px;
font-weight: bold;
line-height: 20px;
}
.profiles-suggestions .profile-list .extra_info span {
background-position: 4px 50%;
background-repeat: no-repeat;
display: block;
line-height: 20px;
padding: 0 0 0 25px;
width: auto;
}
.list-profile-connections .profile-list li {
border: 1px solid transparent;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.box-1 .profiles-suggestions .profile-list li {
width: 100px;
height: 120px;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
}
.profiles-suggestions .profile-list .remove-suggestion,
.box-1 .profiles-suggestions .profile-list li>a {
text-decoration: none;
}
.common-profile-list-block {
display: inline-block;
}
.common-profile-list-block .profiles-suggestions .profile-list li {
width: 100%;
max-width: 100%;
max-height: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.common-profile-list-block .profiles-suggestions .profile-list li img {
float: left;
}
#content .common-profile-list-block .profiles-suggestions .profile-list a.profile-link {
text-align: left;
position: relative;
}
#content .common-profile-list-block .profiles-suggestions .profile-list li {
width: 100%;
max-width: 100%;
padding: 3px 0;
border-radius: 5px;
}
.common-profile-list-block .profiles-suggestions .profile-list li img {
float: left;
}
#content .common-profile-list-block .profiles-suggestions .profile-list a.profile-link {
text-align: left;
position: relative;
height: 50px;
width: 50px;
float: left;
margin-right: 5px;
}
.common-profile-list-block .vcard,
.comment-actions .vcard {
position: relative !important;
float: left;
}
#content {
.menu-submenu {
bottom: 70px;
right: -50px;
}
.common-profile-list-block .vcard,
.comment-actions {
.menu-submenu {
a {
float: none;
display: block;
height: auto;
font-size: 12px;
}
h4 {
margin: 0 14px;
padding-bottom: 3px;
margin-bottom: 3px;
border-bottom: 1px dotted rgba(0, 0, 0, 0.3);
a {
position: relative;
top: -3px;
font-size: 14px;
font-weight: bold;
text-align: center;
}
}
.isTouch & li {
padding: 5px 0;
}
}
.isntTouch & {
& .menu-submenu-trigger {
display: none;
width: 16px;
height: 16px;
position: absolute;
top: -1px;
left: -3px;
overflow: hidden;
background: #efefef url(../images/top-arrow.png) center center no-repeat;
border: 1px solid #CCC;
z-index: 2;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
&:hover .menu-submenu-trigger {
display: block;
background: #fff url(../images/top-arrow.png) center center no-repeat;
border: 1px solid #CCC;
}
}
}
.isTouch & .common-profile-list-block .vcard .menu-submenu-trigger {
background: transparent;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
}
#content-inner .comment-actions {
position: relative;
margin: -1px 23px 0 5px;
.menu-submenu {
bottom: 4px;
.menu-submenu-list {
padding: 5px 8px;
width: auto;
min-width: 50px;
li {
padding: 3px 0;
a {
padding: 0;
}
}
}
}
.menu-submenu-trigger {
display: block;
width: 19px;
height: 19px;
border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.2);
background: rgba(0, 0, 0, 0.1) 50% 50% url(../images/top-arrow.png) no-repeat;
}
}
}
.action-profile-members .profile_link {
position: relative;
}
.action-profile-members .profile_link span.new-profile:last-child {
position: absolute;
top: 3px;
right: 2px;
text-transform: uppercase;
color: #FFF;
font-size: 9px;
background: #66CC33;
padding: 2px;
display: block;
width: 35px;
font-weight: 700;
}
.action-profile-members .profile_link .fn {
font-style: normal;
color: #000;
}
.category-name {
margin-top: 0px;
margin-bottom: 0px;
font-style: italic;
color: #888a85;
text-align: center;
}
.set-category-modal {
width: 250px;
}
.set-category-modal #actions-container {
margin-top: 20px
}
.common-profile-list-block-none {
font-style: italic;
text-align: center;
padding-top: 20px;
padding-bottom: 20px;
}