1KA_F2F/resources/sass/admin_new/pages/library/library.scss

#anketa_knjiznica{

    #libraryInner{
        display: flex;
        flex-direction: column;


        .advanced_search{
            display: flex;
            justify-content: center;
            align-items: center;
    
            margin-bottom: 30px;

            #searchLibrarySettings {
                display: flex;
                flex-direction: column;

                max-width: 750px;
                width: 100%;

                background-color: $white;
                border: 1px solid $gray;
                border-radius: 2px;

                .search_settings_top{
                    display: flex;

                    padding: 20px 32px;

                    background-color: $light-gray;
                    border-bottom: 1px $gray solid;

                    >div{
                        padding-right: 8px;
                        margin-right: 8px;

                        border-right: 1px $gray solid;

                        &.search_text{
                            width: 100%;

                            input[type="text"]{
                                width: 100%;
                                height: 42px;
                                box-sizing: border-box;
                                padding: 0 8px;
                                margin: 0;

                                font-size: 16px;

                                background: $white;
                                border: 1px solid $dark-gray;
                                border-radius: 2px;
                            }
                        }

                        &.search_type{

                            select{
                                cursor: pointer;

                                width: 160px;
                                height: 42px;
                                box-sizing: border-box;
                                padding: 0 8px;
                                margin: 0;

                                font-size: 16px;

                                background: $white;
                                border: 1px solid $dark-gray;
                                border-radius: 2px;
                            }
                        }

                        &.search_button{
                            padding-right: 0px;
                            margin-right: 0px;

                            border: none;
                        }
                    }
                }

                .search_settings_advanced_buttons{
                    display: flex;
                    justify-content: space-between;

                    padding: 8px 32px;

                    button{
                        padding: 5px 16px;

                        font-size: 14px;
                        font-weight: 400;

                        border: 1px $gray solid;
                        border-radius: 2px;

                        &.active{
                            border: 1px $blue solid;
                        }

                        .faicon::before{
                            margin-right: 8px;

                            color: $blue;
                            font-size: 14px;
                        }
                    }
                }
            }
        }

        .library_title{
            margin-bottom: 16px;

            font-weight: 600;
            font-size: 16px;
        }

        ul{
            list-style-type: none;

            margin: 0;
            padding: 0;

            li{
                list-style-type: none;

                // Okvircek in drag handle na levi
                .folder_box_holder{
                    display: flex;
                    align-items: center;

                    .faicon.move_updown{
                        cursor: pointer;

                        padding: 0 8px;
                        margin-bottom: 16px;

                        &:before{
                            color: $blue;
                        }
                    }

                    // Okvircek za folder
                    .folder_box{
                        align-items: center;
                        display: flex;
    
                        height: 41px;
                        width: 100%;
    
                        box-sizing: border-box;
                        padding: 0 16px;
                        margin-bottom: 16px;
                        
                        border: 1px $gray solid;
                        border-radius: 4px;
    
                        transition: 0.2s;
    
                        &.folderhover{
                            background-color: $gray !important;
                        }

                        input[type="text"] {
                            font-size: 16px;
                            padding: 2px 3px;
                            margin: 0;
                        }
    
                        .faicon.new_folder,
                        .faicon.delete_folder{
                            opacity: 0;
                            cursor: pointer;
    
                            margin-left: 8px;
    
                            transition: 0.2s;
    
                            &:before{
                                color: $blue;
                                font-size: 15px;
                            }
                        }
    
                        .folder_arrow_icon{
                            cursor: pointer;
                        }
                        .folder_arrow_icon::before{
                            content: "\f078";
                            font-size: 14px;
                            color: $black;
            
                            margin-right: 8px;
                        }
                        .folder::before{
                            content: "\f07b";
                            font-size: 16px;
                            font-weight: 400;
                            color: $blue;
            
                            margin-right: 8px;
                        }

                        .folder_clickable{
                            cursor: pointer;

                            flex-grow: 1;
                            height: 41px;
                        }
            
                        &:hover{
                            background-color: $light-gray;
            
                            .faicon.new_folder,
                            .faicon.delete_folder{
                                opacity: 1;
                            }
                        }
    
                        &.open{
                            background-color: $light-gray;
            
                            /*.faicon.new_folder,
                            .faicon.delete_folder{
                                display: inline-block;
                            }*/
                            
                            .folder_arrow_icon::before{
                                content: "\f077";
                            }
                            .folder::before{
                                font-weight: 600;
                            }
                        }
                    }
                }

                // Okvircek za anketo
                .folder_container{
                    display: flex;
                    align-items: center;
                    justify-content: space-between;

                    height: 41px;
                    width: 100%;

                    box-sizing: border-box;
                    padding: 0 16px;
                    margin-bottom: 16px;
                    
                    border: 1px $gray solid;
                    border-radius: 4px;

                    transition: 0.2s;

                    &:hover{
                        background-color: $light-gray;
                    }

                    .folder_left{
                        cursor: pointer;

                        display: flex;
                        align-items: center;
                        flex-grow: 1;
                        height: 41px;

                        .faicon{
                            margin-right: 8px;

                            &:before{
                                color: $blue;
                            }
                        }
                    }

                    .folder_right{
                        display: flex;
                        align-items: center;

                        button{
                            margin-left: 8px;
                        }
                    }                      
                }   

                ul{
                    padding-left: 36px;
                }
            }
        }


    }

}