comable-frontend-fashionable 0.6.0

data/app/assets/stylesheets/comable/orders.scss

@@ -0,0 +1,341 @@
+@charset "UTF-8";
+/* CSS cart */
+
+
+p.center {
+	text-align: center;
+}
+	p.center a {
+		color: #000;
+		text-decoration: underline;
+	}
+	p.center a:hover {
+		color: #747474;
+		text-decoration: none;
+	}
+	p.center span {
+		display: block;
+		font-size: 14px;
+		padding: 30px 0;
+	}
+
+/* -------------------------------- */
+.cart {
+	width: 850px;
+	margin: 0 auto;
+}
+	 /* th */
+	.cart th {
+		text-align: center;
+		border: #ccc 1px solid;
+		padding: 2px 10px;
+	}
+	/* td */
+	.cart td {
+		border: #ccc 1px solid;
+		padding: 5px 10px;
+	}
+	.cart td img.sample {
+		width: 80px;
+	}
+	.cart td.center {
+		text-align: center;
+	}
+	.cart td.right {
+		text-align: right;
+	}
+	td.center img:hover {
+	opacity: 0.8;
+	filter: alpha(opacity=80);
+	-ms-filter: "alpha( opacity=80 )";
+	background: #fff;
+}
+
+/* 新規会員登録 */
+table.new-member {
+	width: 828px;
+	margin: 0 auto 15px;
+}
+	/* th */
+	table.new-member th {
+		width: 160px;
+		background: #f1f1f1;
+		border: #ccc 1px solid;
+		padding: 5px 20px;
+	}
+	table.new-member th span {
+		color: #e71f19;
+	}
+	/* td */
+	table.new-member td {
+		border: #ccc 1px solid;
+		padding: 5px 0 5px 20px;
+	}
+
+
+/* step1 注文情報入力（新規会員登録） */
+/* -------------------------------- */
+/* step */
+.step {
+	width: 775px;
+	margin: 0 auto 20px;
+}
+
+/* ログイン・会員登録 */
+.member {
+	overflow: hidden;
+	width: 850px;
+	margin: 20px auto;
+}
+	/* ログイン */
+	.login-box {
+		float: left;
+		width: 375px;
+		border: #000 1px solid;
+		padding: 10px 20px;
+	}
+	.login-box p.login {
+		overflow: hidden;
+		background: #000;
+		color: #fff;
+		font-size: 13px;
+		border-radius: 5px;
+		padding: 4px 20px 2px;
+		margin: 0 0 10px 0;
+	}
+		.login-box span {
+			display: block;
+			color: #747474;
+			font-size: 11px;
+		}
+		.id-pass {
+			width: 365px;
+			margin: 0 0 12px 0;
+		}
+		.bt-login {
+			float: left;
+		}
+			.bt-login img:hover {
+				opacity: 0.8;
+				filter: alpha(opacity=80);
+				-ms-filter: "alpha( opacity=80 )";
+				background: #fff;
+			}
+		.forget {
+			float: right;
+			font-size: 14px;
+			background: image-url("forget_icon.png") no-repeat;
+			background-position: 98% 65%;
+			padding: 8px 18px 0 0;
+		}
+			.forget a {
+				color: #000;
+			}
+			.forget a:hover {
+				color: #666446;
+				text-decoration: underline;
+			}
+
+	/* 会員登録 */
+	.member-box {
+		float: right;
+		width: 375px;
+		border: #000 1px solid;
+		padding: 10px 20px;
+	}
+	.member-box p.login {
+		overflow: hidden;
+		background: #000;
+		color: #fff;
+		font-size: 13px;
+		border-radius: 5px;
+		padding: 4px 20px 2px;
+		margin: 0 0 10px 0;
+	}
+	.member-box .bt-member {
+		width: 207px;
+		margin: 10px auto 0;
+	}
+		.bt-member img:hover {
+			opacity: 0.8;
+			filter: alpha(opacity=80);
+			-ms-filter: "alpha( opacity=80 )";
+			background: #fff;
+		}
+
+/* button nonmember */
+.nonmember {
+	clear: both;
+	width: 260px;
+	margin: 15px auto 0;
+}
+	.nonmember img:hover {
+		opacity: 0.8;
+		filter: alpha(opacity=80);
+		-ms-filter: "alpha( opacity=80 )";
+		background: #fff;
+	}
+
+
+/* 注文者報入力 */
+/* -------------------------------- */
+table.nonmember-ordre {
+	width: 828px;
+	margin: 0 auto 15px;
+}
+	/* th */
+	table.nonmember-ordre th {
+		width: 160px;
+		background: #f1f1f1;
+		border: #ccc 1px solid;
+		padding: 10px 20px;
+	}
+	table.nonmember-ordre th span {
+		color: #e71f19;
+	}
+	/* td */
+	table.nonmember-ordre td {
+		border: #ccc 1px solid;
+		padding: 5px 0 5px 20px;
+	}
+
+
+/* step2 支払い方法・配送日時の選択 */
+/* -------------------------------- */
+p.title {
+	width: 810px;
+	background: #000;
+	color: #fff;
+	padding: 5px 20px;
+	margin: 20px auto 0;
+}
+.box {
+	width: 828px;
+	border: #000 1px solid;
+	padding: 15px 10px 0;
+	margin: 0 auto 10px;
+}
+	.box p {
+		padding: 0 0 15px 0;
+	}
+	.box p span {
+		display: block;
+		background: #cbcbcb;
+		padding: 2px 5px;
+		margin: 0 0 4px 0;
+	}
+table.delivery {
+	width: 828px;
+	margin: -15px 0 15px 0;
+}
+	table.delivery th {
+		width: 150px;
+		border: #ccc 1px solid;
+		padding: 5px 10px;
+	}
+	table.delivery td {
+		border: #ccc 1px solid;
+		padding: 5px 10px;
+	}
+	table.delivery td textarea {
+		resize: none;
+		height: 12px;
+	}
+
+/* ボタン */
+/* -------------------------------- */
+.btn-inner {
+	width:100%;
+	text-align:center;
+	margin: 20px 0 0 0;
+}
+
+.btn_new_member {
+	font-size:14px;
+	font-family:Arial;
+	font-weight:normal;
+	-moz-border-radius:3px;
+	-webkit-border-radius:3px;
+	border-radius:3px;
+	border:1px solid #5e5e5e;
+	padding:4px 18px 3px 0;
+	text-indent: 40px;
+	background: image-url("bt_icon.png") no-repeat #818181;
+	background-position: 18px 49%;
+	color:#ffffff;
+	display:inline-block;
+	-webkit-box-shadow:inset 1px 1px 0px 0px #cccccc;
+	-moz-box-shadow:inset 1px 1px 0px 0px #cccccc;
+	box-shadow:inset 1px 1px 0px 0px #cccccc;
+}
+.btn_new_member:hover {
+	opacity: 0.8;
+	filter: alpha(opacity=80);
+	-ms-filter: "alpha( opacity=80 )";
+}
+
+.btn {
+	font-size:14px;
+	font-family:Arial;
+	font-weight:normal;
+	-moz-border-radius:3px;
+	-webkit-border-radius:3px;
+	border-radius:3px;
+	border:1px solid #c91b24;
+	padding:4px 18px 3px 0;
+	text-indent: 40px;
+	background: image-url("bt_icon.png") no-repeat #e96b27;
+	background-position: 18px 49%;
+	color:#ffffff;
+	display:inline-block;
+	-webkit-box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	-moz-box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	margin: 0 auto 20px;
+}
+.btn:hover {
+	opacity: 0.8;
+	filter: alpha(opacity=80);
+	-ms-filter: "alpha( opacity=80 )";
+}
+
+/* next prev */
+.button-box {
+	width: 205px;
+	margin: 20px auto 0;
+}
+.prv-next {
+	float: left;
+	width: 80px;
+	font-size:14px;
+	font-weight:normal;
+	text-align: center;
+	-moz-border-radius:2px;
+	-webkit-border-radius:2px;
+	border-radius:2px;
+	border:1px solid #eeb44f;
+	background:-moz-linear-gradient( center top, #ffc477 5%, #fb9e25 100% );
+	background:-ms-linear-gradient( top, #ffc477 5%, #fb9e25 100% );
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc477', endColorstr='#fb9e25');
+	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffc477), color-stop(100%, #fb9e25) );
+	background-color:#ffc477;
+	color:#ffffff;
+	display:inline-block;
+	text-shadow:1px 1px 0px #cc9f52;
+	-webkit-box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	-moz-box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	box-shadow:inset 1px 1px 0px 0px #fce2c1;
+	padding: 3px 0;
+	margin: 0 10px;
+}
+.prv-next:hover {
+	background:-moz-linear-gradient( center top, #fb9e25 5%, #ffc477 100% );
+	background:-ms-linear-gradient( top, #fb9e25 5%, #ffc477 100% );
+	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fb9e25', endColorstr='#ffc477');
+	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #fb9e25), color-stop(100%, #ffc477) );
+	background-color:#fb9e25;
+}
+.prv-next:active {
+	position:relative;
+	top:1px;
+}

data/app/assets/stylesheets/comable/passwords.scss

@@ -0,0 +1,205 @@
+@charset "UTF-8";
+/* CSS mypage */
+
+
+/* -------------------------------- */
+/* ログイン画面 */
+/* -------------------------------- */
+section {
+	width: 850px;
+	margin: 10px auto;
+}
+
+p.title {
+	font-size: 15px;
+	font-weight: bold;
+	background: image-url("icon.png") top left no-repeat;
+	background-position: 0px 3px;
+	text-indent: 23px;
+}
+
+p.left {
+	text-align: left;
+	margin: 5px 0 20px 0;
+	}
+
+/* table */
+.login {
+	width: 850px;
+	margin: 5px auto 20px;
+}
+	.login th {
+		width: 150px;
+		background: #f1f1f1;
+		border: #ccc 1px solid;
+		padding: 10px 20px;
+	}
+	.login td {
+		font-size: 11px;
+		border: #ccc 1px solid;
+		padding: 10px 20px;
+	}
+		.login td span a {
+			color: #000;
+			text-decoration: underline;
+			margin: 0 0 0 60px;
+		}
+		.login td span a:hover {
+			color: #747474;
+			text-decoration: none;
+		}
+
+/* -------------------------------- */
+/* my page */
+/* -------------------------------- */
+.my-menu {
+	float: left;
+	width: 260px;
+	padding: 0 0 0 20px;
+}
+	.my-menu p {
+		margin: 0 0 5px 0;
+	}
+	.my-menu p a {
+		color: #000;
+	}
+	.my-menu p a:hover {
+		text-decoration: underline;
+	}
+
+/* 内容 */
+.my-contents {
+	float: left;
+	width: 680px;
+}
+
+	/* 注文履歴 */
+	.history {
+		width: 680px;
+	}
+	.history th {
+		text-align: center;
+		border: #ccc 1px solid;
+		background: #f1f1f1;
+		padding: 5px 20px;
+	}
+	.history td {
+		text-align: center;
+		border: #ccc 1px solid;
+		padding: 10px 20px;
+	}
+
+	/* メールアドレス・パスワード変更 */
+	.account {
+		width: 680px;
+		margin: 0 0 15px 0;
+	}
+	.account th {
+		vertical-align: top;
+		border: #ccc 1px solid;
+		background: #f1f1f1;
+		padding: 10px;
+	}
+	.account td {
+		border: #ccc 1px solid;
+		padding: 10px;
+	}
+		.account span {
+			display: block;
+			font-size: 11px;
+		}
+
+	/* 住所変更 */
+	.address {
+		width: 680px;
+		margin: 0 0 15px 0;
+	}
+	.address th {
+		width: 160px;
+		border: #ccc 1px solid;
+		background: #f1f1f1;
+		padding: 5px 0 5px 20px;
+	}
+		.address th span {
+			color: #e71f19;
+		}
+	.address td {
+		border: #ccc 1px solid;
+		padding: 5px 0 5px 20px;
+	}
+
+/* 変更後 */
+p.center {
+	text-align: center;
+}
+	p.center a {
+		color: #000;
+		text-decoration: underline;
+	}
+	p.center a:hover {
+		color: #000;
+		text-decoration: none;
+	}
+	p.center span {
+		display: block;
+		font-size: 14px;
+		padding: 0 0 30px 0;
+	}
+	p.center span.strong {
+		display: block;
+		font-weight: bold;
+		padding: 30px 0;
+	}
+
+/* -------------------------------- */
+/* パスワード再発行 */
+/* -------------------------------- */
+.forget {
+		width: 980px;
+		margin: 10px 0 15px 0;
+	}
+	.forget th {
+		width: 160px;
+		border: #ccc 1px solid;
+		background: #f1f1f1;
+		padding: 5px 0 5px 20px;
+	}
+		.forget th span {
+			color: #e71f19;
+		}
+	.forget td {
+		border: #ccc 1px solid;
+		padding: 5px 0 5px 20px;
+	}
+
+
+
+
+/* ボタン */
+.bt-box {
+	background: #ccc;
+	text-align: center;
+	padding: 20px;
+	margin: 5px 0 40px 0;
+}
+
+/* ログインボタン */
+.btn {
+	font-size:14px;
+	font-family:Arial;
+	font-weight:normal;
+	-moz-border-radius:3px;
+	-webkit-border-radius:3px;
+	border-radius:5px;
+	padding:6px 18px 5px 0;
+	text-indent: 40px;
+	background: image-url("bt_icon.png") no-repeat #000;
+	background-position: 18px 49%;
+	color:#ffffff;
+	display:inline-block;
+}
+.btn:hover {
+	opacity: 0.8;
+	filter: alpha(opacity=80);
+	-ms-filter: "alpha( opacity=80 )";
+}