source: branches/version-2_11-dev/html/user_data/packages/sphone/css/button.css @ 21081

Revision 21081, 9.4 KB checked in by Seasoft, 13 years ago (diff)

#1294 (ソースを読みやすくする)

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