regluit/static/less/supporter_layout.less

@import "variables.less";

.block-inner { 
	padding-right:10px;
}

.user-block {
	width:100%;
	clear:both;
}

.user-block-hide {
	float: left;
	width:100%;
	clear:both;
	
	.block { 
		float:left; 
		width:33%;
	}
	
	input { 
		float:left; 
		margin:3px 10px 0 0;
	}
	
	label {
		float:left; 
		width:90%;
	}	
}

.user-block1 {
	float:left;
	width:25%;
}

.user-block-inner {

}

.user-block2 {
	color:@medium-blue;
	font-size:11px;
	line-height:normal;
	float:left;
	width:25%;
}

.user-block3, 
.user-block4 {
	float:left;
	width:25%;
}

.user-block3 {
	margin-top:8px;
	.ungluingtext {
		.height(29px);
		float: left;
		color: @text-blue;
		padding-right: 5px;
	}
}

img.user-avatar { 
	float:left; 
	margin-right:10px;
}

.social { 
	width:100%;
	padding-left:35px;
}

span.user-name,
span.user-date, 
span.user-short-info { 
	display: block;
}

span.user-name,
span.user-name a,
a { 
	font-size:12px;
	color:@text-blue;
}

span.user-status-title { 
	float:left; 
	margin-right: 8px; 
	padding-top: 5px;
}

span.rounded {
	border:1px solid #d4d4d4;
	.border-radius(7px, 7px, 7px, 7px);
	padding:1px; 
	color:#fff; 
	margin:0 8px 0 0;
	display:inline-block;
	
	> span { 
		padding:7px 10px; 
		min-width:15px; 
		.border-radius(5px, 5px, 5px, 5px);
		text-align:center; 
		display:inline-block;
	}
	
}

span.blue {
	.supporter-color-span(#a7d26a, blue);
}

span.orange { 
	.supporter-color-span(#eabc7c, orange);
}

span.grey { 
	.supporter-color-span(#bacfd6, grey);
}

div.check-list { 
	float: left; 
	width:100%; 
	padding-bottom:7px;
}

a.profile-edit { 
	display:block; 
	background:url("@{image-base}header/icon-edit.png") right top no-repeat;
}

div.profile-save { 
	padding-top:15px;
	border: none;
}

input.profile-save {
	background: url("@{image-base}header/save-setting.png") 0 0 no-repeat;
	width: 116px;
	height: 42px;
	display: block;
	text-indent: -100000px;
	border:none;
}

a.my-setting { 
	background:@blue-grey url("@{image-base}header/explane.png") 90% center no-repeat; 
	border-radius:7px; 
	.height(50px);
	display:block; 
	padding:0 0 0 10px; 
	font-size:20px;
}

a.my-setting.active { 
	background:@blue-grey url("@{image-base}header/collspane.png") 90% center no-repeat;
}

#tabs {
    clear: both;
    float: left;
    margin-left: 10px;
    margin-top: 10px;
    width: 100%;

	&.wantto {
		border-bottom: 4px solid #bacfd6;
	}

	&.ungluing {
		border-bottom: 4px solid #eabc7c;
	}

	&.unglued {
		border-bottom: 4px solid #a7d26a;
	}
}

#tabs ul.book-list-view { 
	margin-bottom:4px !important;
}

#tabs-1,
#tabs-2,
#tabs-3 { 
	margin-left:10px;
}

ul.tabs {
	float:left;
	padding:0; 
	margin:0; 
	list-style:none;

	li {
		float: left; 
		.height(46px); 
		margin-right:2px;

		a { 
			.height(46px);
			display:block;
			text-align:center;
			padding:0 10px;
			min-width:80px;
			.border-radius(7px, 7px, 0, 0);
			background:@blue-grey;
			color:@text-blue;
		}
		
		a:hover, &.active a {
			background:@medium-blue;
			color:#fff;
		}
	}
}


.book-list span.rounded > span { 
	line-height:normal; 
	width:75px;
	
	a { 
		text-transform:capitalize;
	}
}

div.content-block-content {
  padding-left: 10px;
}

.js-news-text {
	float:left;
	width:70%;
	font-size:16px;
	color:@text-blue;
	font-family:lucida grande;
}

.js-news-links {
	float:right;
	width:30%;
}

.column-left .item {
	margin:0 10px 10px 0;
}

.column-center .item {
	margin:0 5px 10px 5px;
}

.column-right .item {
	margin:0 0 10px 10px;
}

.column .item {
	border:7px solid @pale-blue;
	padding:10px;
}

.book-image { 
	padding:0 0 10px 0;
}

.book-info {
	padding:0 0 10px 0;
	line-height:125%;
	position:relative;

	span.book-new {
		background:url(/static/images/images/icon-new.png) 0 0  no-repeat;
		width:38px;
		height:36px;
		display:block;
		position:absolute;
		right:10px;
		top:0;
	}
}

.book-name {
	color:@text-blue;
}

.book-author {
	color:@medium-blue;
}

.book-status {
	margin:0 -10px;
	border-top:1px solid @pale-blue;
	padding:15px 10px 0 10px;
	position:relative;

	span.unglue {
		font-style:italic;
	}

	span.status {
		position:absolute;
		right:10px;
		bottom:-5px;
		width:37px;
		height:25px;
		display:block;
	}

}