forked from rachanon/stdbWeb
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
214 lines
3.1 KiB
214 lines
3.1 KiB
ul { |
|
list-style-type: none; |
|
margin: 0; |
|
padding: 0; |
|
overflow: hidden; |
|
background-color: #333; |
|
} |
|
|
|
li { |
|
float: left; |
|
} |
|
|
|
li a { |
|
display: block; |
|
color: white; |
|
text-align: center; |
|
padding: 30px 16px; |
|
text-decoration: none; |
|
} |
|
|
|
li a:hover:not(.active) { |
|
background-color: #111; |
|
} |
|
.upload { |
|
position: absolute; |
|
border-radius: 5px; |
|
width: 80px; |
|
height: 40px; |
|
background-color: #90CAF9; |
|
color: #FFF; |
|
overflow: hidden; |
|
} |
|
|
|
div .flexCenter input { |
|
border-radius: 5px; |
|
display: block !important; |
|
width: 80px !important; |
|
height: 40px !important; |
|
opacity: 0 !important; |
|
} |
|
img{ |
|
border-radius: 10px; |
|
position: absolute; |
|
width: 400px; |
|
height: 400px; |
|
} |
|
|
|
.column { |
|
-webkit-flex-direction: column; |
|
flex-direction: column; |
|
float: left; |
|
} |
|
.column li { |
|
background: deepskyblue; |
|
} |
|
|
|
.bgImage{ |
|
border-radius: 10px; |
|
width: 400px; |
|
height: 400px; |
|
} |
|
.active { |
|
background-color: #333; |
|
} |
|
.titleIn{ |
|
position: fixed; |
|
height: 80px; |
|
width: 100%; |
|
color:#FFF; |
|
font-size:30px; |
|
} |
|
.container{ |
|
margin-right: auto; |
|
margin-left: auto; |
|
} |
|
.boxShow{ |
|
display:flex; |
|
justify-content: center; |
|
align-items:center; |
|
/*margin-top: 10px;*/ |
|
} |
|
.cardData{ |
|
display:flex; |
|
justify-content: center; |
|
align-items:center; |
|
margin-top: 10px; |
|
margin: 10px; |
|
background-color: #FFF; |
|
width: 150px; |
|
height: 150px; |
|
border: 1px solid navy; |
|
|
|
} |
|
.flexEnd { |
|
display:flex; |
|
justify-content: flex-end; |
|
align-items:center; |
|
} |
|
.flexCenter { |
|
display:flex; |
|
justify-content: center; |
|
align-items:center; |
|
} |
|
.flexCenterSpace { |
|
display:flex; |
|
justify-content: space-around; |
|
-webkit-justify-content: space-around; |
|
align-items:center; |
|
|
|
} |
|
.cardStyle{ |
|
border-radius: 5px; |
|
width: auto; |
|
/*height: 150px;*/ |
|
margin-top: 5px; |
|
background-color: #FFF; |
|
border: 1px solid navy; |
|
} |
|
.cardSearch{ |
|
border-radius: 5px; |
|
width: auto; |
|
height: 40px; |
|
margin-top: 5px; |
|
background-color: #F0F0F0; |
|
border: 1px solid navy; |
|
} |
|
.cardAdd{ |
|
width: auto; |
|
background-color:unset; |
|
margin-top: 5px; |
|
} |
|
.modalStyle{ |
|
width: auto; |
|
/*height: 150px;*/ |
|
margin-top: 5px; |
|
background-color: #FFF; |
|
border: 1px solid navy; |
|
} |
|
|
|
.miniImage{ |
|
border-radius: 10px; |
|
width: 125px; |
|
height: 125px; |
|
} |
|
.bgMiniImage{ |
|
border-radius: 10px; |
|
width: 125px; |
|
height: 400px; |
|
} |
|
.modal { |
|
display: none; |
|
position: fixed; |
|
z-index: 1; |
|
padding-top: 100px; |
|
left: 0; |
|
top: 0; |
|
width: 100%; |
|
height: 1000px; |
|
overflow: auto; |
|
background-color: rgb(0,0,0); |
|
background-color: rgba(0,0,0,0.4); |
|
} |
|
|
|
.modal-content { |
|
border-radius: 8px; |
|
background-color: #fefefe; |
|
margin: auto; |
|
border: 1px solid #888; |
|
width: 840px; |
|
} |
|
|
|
.imgTagStyle { |
|
background-color: #80CBC4; |
|
border-radius: 10px; |
|
width: 500px; |
|
height: 500px; |
|
border: 1px solid navy; |
|
} |
|
|
|
.buttonUpdate{ |
|
background-color: #00C853; |
|
color:#FFF; |
|
width: 80px; |
|
height: 40px; |
|
border-radius: 5px; |
|
} |
|
.buttonDelete{ |
|
background-color: #B71C1C; |
|
color:#FFF; |
|
width: 80px; |
|
height: 40px; |
|
border-radius: 5px; |
|
} |
|
.buttonBack{ |
|
background-color: #263238; |
|
color:#FFF; |
|
width: 80px; |
|
height: 40px; |
|
border-radius: 5px; |
|
} |
|
|
|
.addStyle{ |
|
position: fixed; |
|
|
|
} |
|
.buttonSearch{ |
|
background-color: #263238; |
|
color:#000; |
|
width: 80px; |
|
height: 40px; |
|
border-radius: 5px; |
|
border: 0px; |
|
|
|
} |