#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; } } } } }