src/main/resources/static/css/window.css - master - Parmenid/BookStore

src/main/resources/static/css/window.css

116 строк2 KB

Sergei Prokofev

implement confirm registration by link

25 окт 2022, 20:46

25 окт 2022, 20:4698e4769

.window {
    position: absolute;
    top: -100%;
    background: #F6F6f6;
    border-radius: 10px;
    border: 4px slategray solid;
    -webkit-box-shadow: 9px 13px 25px 0 rgba(0, 0, 0, 0.18);
    -moz-box-shadow: 9px 13px 25px 0 rgba(0, 0, 0, 0.18);
    box-shadow: 9px 13px 25px 0 rgba(0, 0, 0, 0.18);
    opacity: 0;
}

.window .success-symbol {
    position: relative;
    background: #F6F6f6;
    border: 5px green solid;
    border-radius: 50%;
    height: 100px;
    width: 100px;
    padding: 10px;
    top: 20%;
    left: 25%;
    align-items: center;
}

.window .success-symbol i {
    overflow-y: hidden;
    color: green;
    font-size: 55px;
    line-height: 60px;
    margin-left: 10px;

}

.window .message {
    position: absolute;
    top: 75%;
    left: 35%;
    text-transform: uppercase;
}

#success-window.open{
    left: 16%;
    top: 10%;
    transition: 0.3s;
    z-index: 2;
    opacity: 1;
}

.window.close {
    transition: 0.2s;
    opacity: 0;
    top: -100%;
}

.window .email-symbol {
    position: relative;
    left: 27%;
}

.window .email-symbol i{
    font-size: 100px;
    color: steelblue;
}


#accept-window .close-window-btn {
    position: relative;
    left: 92%;
    top: 1%;
    color: whitesmoke;
    background-color: grey;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    overflow-y: hidden;
    text-align: center;
    font-size: 15px;
    line-height: 10px;
    cursor: pointer;
    border: 2px solid slategray;
}

#accept-window .message {
    left: 4%;
}

#accept-window {
    height: 180px;
    width: 220px;
}

#success-window {
    height: 200px;
    width: 200px;
}

#accept-window .close-window-btn:hover {
    background-color: #555555;
}

#accept-window.open {
    top: 25%;
    left: 13%;
    transition: 0.3s;
    z-index: 2;
    opacity: 1;
}

#accept-window .message {
    cursor: pointer!important;
}

#accept-window .message:hover{
    color: #222222!important;
}