source: branches/version-2_12-multilang/html/user_data/packages/sphone_en/css/button.css @ 22157

Revision 22157, 9.6 KB checked in by h_yoshimoto, 11 years ago (diff)

#1992 英文テンプレートを一旦コミット
Line 
1@charset "utf-8";
2/* ===================================================================
3CSS information
4
5file name  :button.css
6style info :ボタン用
7
8=================================================================== */
9.btn_area {
10    padding: 10px;
11    clear: both;
12}
13ul.btn_btm {
14    clear: both;
15}
16.btn_area li,
17ul.btn_btm li {
18    margin-bottom: 12px;
19}
20.btn_area_top {
21    box-shadow: 0 1px 1px 1px rgba(255,255,255,1) inset;
22    -webkit-box-shadow: 0 1px 1px 0 rgba(255,255,255,1) inset;
23    -moz-box-shadow: 0 1px 1px rgba(255,255,255,1) inset;
24    border-top: 1px solid #CCC;
25    border-bottom: 1px solid #CCC;
26    background: #EEE;
27    display: block;
28    clear: both;
29    margin-bottom: 10px;
30    padding: 10px 0;
31}
32/*-----------------------------------------------
33ボタン（進む系ボタン:グリーン）
34----------------------------------------------- */
35a.btn,
36a.btn:link,
37a.btn:visited,
38a.btn:hover {
39    color: #FFF;
40    font-size: 16px;
41    font-weight: bold;
42    text-decoration: none;
43    text-align: center;
44    padding: 10px;
45    text-shadow: 0 -1px 1px rgba(0,0,0,1);
46    border: 1px solid #A9ABAD;
47    border-radius: 5px;
48    -moz-border-radius: 5px;
49    -webkit-border-radius: 5px;
50    display: block;
51    background: #B4DF34;
52    background: -moz-linear-gradient(center top, #B4DF34 0%,#669222 100%);
53    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #B4DF34),color-stop(1, #669222));
54    cursor: pointer;
55    -webkit-transition: opacity 0.5s ease-in;
56    -moz-transition: opacity 0.5s ease-in;
57}
58input[type="submit"].btn {
59    width: 100%;
60    color: #FFF;
61    font-size: 16px;
62    font-weight: bold;
63    text-decoration: none;
64    text-align: center;
65    padding: 10px;
66    text-shadow: 0 -1px 1px rgba(0,0,0,1);
67    border: 1px solid #A9ABAD;
68    border-radius: 5px;
69    -moz-border-radius: 5px;
70    -webkit-border-radius: 5px;
71    display: block;
72    background: #B4DF34;
73    background: -moz-linear-gradient(center top, #B4DF34 0%,#669222 100%);
74    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #B4DF34),color-stop(1, #669222));
75    cursor: pointer;
76    -webkit-transition: opacity 0.5s ease-in;
77    -moz-transition: opacity 0.5s ease-in;
78}
79/*-----------------------------------------------
80ボタン（戻る系ボタン:グレー）
81----------------------------------------------- */
82a.btn_back,
83a.btn_back:link,
84a.btn_back:visited,
85a.btn_back:hover {
86    color: #FFF;
87    font-size: 16px;
88    font-weight: bold;
89    text-decoration: none;
90    text-align: center;
91    text-shadow: 0 -1px 1px rgba(0,0,0,1);
92    border: 1px solid #A9ABAD;
93    border-radius: 5px;
94    -moz-border-radius: 5px;
95    -webkit-border-radius: 5px;
96    display: block;
97    padding: 5px 0;
98    background: #999999;
99    background: -moz-linear-gradient(center top, #C5C5C5 0%,#999999 100%);
100    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #C5C5C5),color-stop(1, #999999));
101}
102input[type="submit"].btn_back {
103    color: #FFF;
104    font-size: 16px;
105    font-weight: bold;
106    text-decoration: none;
107    text-align: center;
108    text-shadow: 0 -1px 1px rgba(0,0,0,1);
109    border: 1px solid #A9ABAD;
110    border-radius: 5px;
111    -moz-border-radius: 5px;
112    -webkit-border-radius: 5px;
113    display: block;
114    padding: 5px 0;
115    background: #999999;
116    background: -moz-linear-gradient(center top, #C5C5C5 0%,#999999 100%);
117    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #C5C5C5),color-stop(1, #999999));
118}
119/*-----------------------------------------------
120ボタン（サブ系ボタン:ライトグレー）
121----------------------------------------------- */
122.btn_sub,
123a.btn_sub,
124a.btn_sub:link,
125a.btn_sub:visited,
126a.btn_sub:hover {
127    color: #000;
128    font-size: 16px;
129    padding: 5px 0;
130    font-weight: bold;
131    text-decoration: none;
132    text-align: center;
133    text-shadow: 0 -1px 1px rgba(255,255,255,1);
134    border: 1px solid #A9ABAD;
135    border-radius: 5px;
136    -moz-border-radius: 5px;
137    -webkit-border-radius: 5px;
138    display: block;
139    background: #FDFDfD;
140    background: -moz-linear-gradient(center top, #FDFDFD 0%,#D7DDE3 100%);
141    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #D7DDE3));
142}
143input[type="submit"].btn_sub {
144    color: #000;
145    font-size: 16px;
146    padding: 5px 0;
147    font-weight: bold;
148    text-decoration: none;
149    text-align: center;
150    text-shadow: 0 -1px 1px rgba(0,0,0,0.3);
151    border: 1px solid #A9ABAD;
152    border-radius: 5px;
153    -moz-border-radius: 5px;
154    -webkit-border-radius: 5px;
155    display: block;
156    background: #FDFDfD;
157    background: -moz-linear-gradient(center top, #FDFDFD 0%,#D7DDE3 100%);
158    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FDFDFD),color-stop(1, #D7DDE3));
159}
160/*-----------------------------------------------
161ボタン（追加系ボタン:ホワイト）
162----------------------------------------------- */
163a.btn_more,
164a.btn_more:link,
165a.btn_more:visited,
166a.btn_more:hover {
167    color: #000;
168    font-size: 16px;
169    padding: 5px 0;
170    font-weight: bold;
171    text-decoration: none;
172    text-align: center;
173    border: 1px solid #A9ABAD;
174    border-radius: 5px;
175    -moz-border-radius: 5px;
176    -webkit-border-radius: 5px;
177    display: block;
178    background: #FFF;
179    clear: both;
180    margin: 10px 0;
181}
182input[type="submit"].btn_more {
183    color: #000;
184    font-size: 16px;
185    padding: 5px 0;
186    font-weight: bold;
187    text-decoration: none;
188    text-align: center;
189    border: 1px solid #A9ABAD;
190    border-radius: 5px;
191    -moz-border-radius: 5px;
192    -webkit-border-radius: 5px;
193    display: block;
194    background: #FFF;
195    clear: both;
196}
197/*-----------------------------------------------
198ボタン（フッター）
199----------------------------------------------- */
200a.btn_btm {
201    width: 150px;
202    text-align: center;
203    color: #FFF;
204    background-color: #000;
205    background: -moz-linear-gradient(center top, #5E5E5E 0%,#232323 48%);
206    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5E5E5E),color-stop(0.48, #232323));
207    border: #303030 solid 1px;
208    text-shadow: 0 -1px 1px rgba(0,0,0,0.5);
209    -moz-border-radius: 5px;
210    -webkit-border-radius: 5px;
211    padding: 5px;
212    margin: 10px auto;
213    transition: background-color 1s ease-in;
214    -webkit-transition: background-color 1s ease-in;
215    -moz-transition: opacity 1s ease-int;
216    cursor: pointer;
217}
218.btn_btm,
219a.btn_btm:link,
220a.btn_btm:hover,
221a.btn_btm:visited {
222    color: #FFF;
223    text-decoration: none;
224}
225input[type="submit"].btn_btm {
226    width: 150px;
227    text-align: center;
228    color: #FFF;
229    background-color: #000;
230    background: -moz-linear-gradient(center top, #5E5E5E 0%,#232323 48%);
231    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5E5E5E),color-stop(0.48, #232323));
232    border: #303030 solid 1px;
233    text-shadow: 0 -1px 1px rgba(0,0,0,0.5);
234    -moz-border-radius: 5px;
235    -webkit-border-radius: 5px;
236    padding: 5px;
237    margin: 10px auto;
238    transition: background-color 1s ease-in;
239    -webkit-transition: background-color 1s ease-in;
240    -moz-transition: opacity 1s ease-int;
241    cursor: pointer;
242}
243/*-----------------------------------------------
244ボタン小（編集/削除）
245----------------------------------------------- */
246ul.edit {
247    float: right;
248    clear: right;
249    display: inline;
250    vertical-align: top;
251    line-height: 1;
252    position: absolute;
253    right: 10px;
254    top: 15px;
255}
256ul.edit li {
257    display: inline;
258    float: left;
259    line-height: 1;
260    vertical-align: middle;
261}
262ul.edit li:first-child {
263    margin-right: 0.8em;
264}
265a.b_edit:link,
266a.b_edit:visited,
267a.b_edit:hover {
268    color: #000;
269    font-size: 11px;
270    padding: 4px 5px;
271    border: #CCC solid 1px;
272    border-radius: 12px;
273    -moz-border-radius: 12px;
274    -webkit-border-radius: 12px;
275    background: #D7DDE3;
276    background: -moz-linear-gradient(center top, #FFFFFF 0%,#D7DDE3 100%);
277    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF),color-stop(1, #D7DDE3));
278    display: inline;
279    text-align: center;
280    cursor: pointer;
281    vertical-align: middle;
282}
283a.b_delete:link,
284a.b_delete:visited,
285a.b_delete:hover {
286    vertical-align: top;
287    cursor: pointer;
288}
289/*-----------------------------------------------
290ボタン（商品詳細:カゴに入れる）
291----------------------------------------------- */
292.cartbtn_default {
293    width: 50%!important;
294    font-size: 15px;
295    padding: 10px 0;
296    background: #669222;
297    background: -moz-linear-gradient(center top, #B4DF34 0%,#669222 100%);
298    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #B4DF34),color-stop(1, #669222));
299}
300
301/*-----------------------------------------------
302ボタン（商品詳細:お気に入り)
303----------------------------------------------- */
304.btn_favorite .btn_sub {
305    width: auto;
306    display: block;
307}
308.btn_favorite p {
309    text-align: center;
310}
311/*-----------------------------------------------
312ボタン（新しいお届け先を追加する)
313----------------------------------------------- */
314.addbtn {
315    margin: 0 30px;
316    padding: 5px 0;
317}
318/*-----------------------------------------------
319ボタン（トップページへ)
320----------------------------------------------- */
321.btn_s {
322    width: 12em;
323    padding: 10px 0!important;
324    margin: 10px auto;
325    clear: both;
326}
327/*-----------------------------------------------
328ボタン（住所自動入力)
329----------------------------------------------- */
330.btn_inputzip {
331    margin: 12px 0 5px 0;
332}
333/*-----------------------------------------------
334ボタン（ログイン/ウィンドウ)
335----------------------------------------------- */
336.btn_login,
337.btn_close {
338    width: 70%;
339    margin: 10px auto;
340}
Note: See TracBrowser for help on using the repository browser.