Skip to content

Commit

Permalink
Adjusting caption css & modal rewriting & footer adjustment
Browse files Browse the repository at this point in the history
  • Loading branch information
@OmarHany23
OmarHany23 committed May 17, 2023
1 parent 589bf61 commit 4a20b19
Show file tree
Hide file tree
Showing 17 changed files with 2,921 additions and 20 deletions.
233 changes: 233 additions & 0 deletions .history/static/css/upload_20230517213350.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,233 @@
.row{
justify-content: space-between;
}
.drag-area{
border: 2px dashed #fff;
border-radius: 30px;
height: 400px;
width: 480px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
/* for justifying cancel and submit buttons to the right and to the left */
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
position: relative;
}
.drag-area.active{
border: 2px solid #fff;
background: -webkit-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -moz-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -ms-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -o-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
}

.drag-area .icon{
font-size: 50px;
color: #fff;
}
.drag-area header{
font-size: 20px;
font-weight: 400;
color: #fff;
}
.drag-area span{
font-size: 25px;
font-weight: 400;
color: #fff;
margin: 10px 0 15px 0;
}
.drag-area button{
padding: 10px 25px;
font-size: 20px;
font-weight: 400;
border: none;
outline: none;
background: #fff;
color: #5256ad;
border-radius: 5px;
cursor: pointer;
}
.drag-area button:hover{
background: -webkit-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -moz-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -ms-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: -o-linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
background: linear-gradient(to right, #0a0a0a 0%, #403000 51%, #0a0a0a 100%);
font-weight: bold;
color:#FFF;
font-size: 22px;
}
.drag-area img{
height: 100%;
width: 100%;
object-fit: fill;
border-radius: 30px;
}
/*for buttons Location*/
.checker_form{
width:455px;
}
.drag-area .buttons-container {
display: flex;
width:300px;
justify-content: space-between;
margin-top: 10px;
}

.submit_btn{
margin-top: 10px;
margin-left: 20px;
padding: 5px 10px;
font-size: 20px;
font-weight: 400;
border: none;
outline: none;
background: #fff;
color: #5256ad;
border-radius: 5px;
cursor: pointer;
float:right;
}
.submit_btn:hover{
background: #5256ad;
color: #FFF;
font-size: 22px;
font-weight: bold;
}
.cancel_btn{
margin-top: 10px;
padding: 5px 10px;
font-size: 20px;
font-weight: 400;
border: none;
outline: none;
background: #fff;
color: #ca0c2f;
border-radius: 5px;
cursor: pointer;
}
.cancel_btn:hover{
background: #ca0c2f;
color: #fff;
font-size: 22px;
font-weight: bold;
}
.container label{
color:black;
font-size: 20px;
}
.modal-header{
background-color:#2C2172;
}
.modal-header span{
color:red;
}
.modal-title{
color:gainsboro;
font-weight: bolder;
font-family: 'Times New Roman', Times, serif;
font-size: 30px;
}
.modal-body{
background-color:#2C2172;
}
.modal-body p{
color:gainsboro;
font:15px;
font-weight: lighter;
font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.modal-footer{
background-color:#2C2172;
}
.col-lg-6{
float:left;
}
.col-lg-16{
float:right;
}
.container label{
color:rgb(6, 2, 25);
font-weight: bold;
}
.resetCard{
width: 35px;
margin-top: 10px;
padding: 5px 10px;
font-size: 16px;
font-weight: 400;
border: none;
outline: none;
background :gainsboro;
color: #000;
border-radius: 5px;
cursor: pointer;
}
.resetCard:hover{
background: -webkit-linear-gradient(to right, #696fba 0%, #8a8db6 51%, #e7e7ed 100%);
background: -moz-linear-gradient(to right, #696fba 0%, #8a8db6 51%, #e7e7ed 100%);
background: -ms-linear-gradient(to right, #696fba 0%, #8a8db6 51%, #e7e7ed 100%);
background: -o-linear-gradient(to right, #696fba 0%, #8a8db6 51%, #e7e7ed 100%);
background: linear-gradient(to right, #696fba 0%, #8a8db6 51%, #e7e7ed 100%);
color: #fff;
font-size: 17px;
font-weight: bold;
}
.loadCard{
margin-top: 10px;
margin-left: 5px;
padding: 5px 10px;
font-size: 16px;
font-weight: 400;
border: none;
outline: none;
background:gainsboro;
color: #FFF;
border-radius: 5px;
cursor: pointer;
}
.loadCard:hover{
background: -webkit-linear-gradient(to right, #e7e7ed 0%, #8a8db6 51%, #696fba 100%);
background: -moz-linear-gradient(to right, #e7e7ed 0%, #8a8db6 51%, #696fba 100%);
background: -ms-linear-gradient(to right, #e7e7ed 0%, #8a8db6 51%, #696fba 100%);
background: -o-linear-gradient(to right, #e7e7ed 0%, #8a8db6 51%, #696fba 100%);
background: linear-gradient(to right, #e7e7ed 0%, #8a8db6 51%, #696fba 100%);
color: #fff;
font-size: 17px;
font-weight: bold;
}
.card-body h5{
color:#2C2172;
}
.translateButton{
margin-top: 10px;
margin-left: 5px;
padding: 5px 10px;
font-size: 16px;
font-weight: 400;
border: none;
outline: none;
background: -webkit-linear-gradient(to right, #0c0643 0%, #3a28d6 51%, #847ccc 100%);
background: -moz-linear-gradient(to right, #0c0643 0%, #3a28d6 51%, #847ccc 100%);
background: -ms-linear-gradient(to right, #0c0643 0%, #3a28d6 51%, #847ccc 100%);
background: -o-linear-gradient(to right, #0c0643 0%, #3a28d6 51%, #847ccc 100%);
background: linear-gradient(to right, #0c0643 0%, #3a28d6 51%, #847ccc 100%);
color: #FFF;
border-radius: 5px;
cursor: pointer;
}
.translateButton:hover{
background: -webkit-linear-gradient(to right, #bababa 0%, #5a498a 51%, rgb(66, 51, 199) 100%);
background: -moz-linear-gradient(to right, #bababa 0%, #5a498a 51%, rgb(66, 51, 199) 100%);
background: -ms-linear-gradient(to right, #bababa 0%, #5a498a 51%, rgb(66, 51, 199) 100%);
background: -o-linear-gradient(to right, #bababa 0%, #5a498a 51%, rgb(66, 51, 199) 100%);
background: linear-gradient(to right, #bababa 0%, #5a498a 51%, rgb(66, 51, 199) 100%);
color: #000;
font-size: 17px;
font-weight: bold;
}
Loading

0 comments on commit 4a20b19

Please sign in to comment.