/** * components: search */ .search .frame .suggestion-frame { width:98%; overflow: hidden; overflow-y: auto; word-wrap: normal; margin-top:2px; border-right:1px solid #CAD5E0; } .search .frame .suggestion-frame .suggestions { display:none; position:absolute; width:55%; height:55%; z-index:9; overflow:hidden; overflow-y: auto; padding:4px;; } .search .frame .input-frame{ display:grid; grid-template-columns: auto 32px 48px ; gap:4px; align-items: center; align-content:center; padding:4px; background-color: rgba(255,255,255,0.8); } .search .frame .input-frame i {color:#000000} .search .frame .input-frame .found { font-size:11px; color:maroon; text-align: center;} .search .frame input[type="text"] { padding:8px; font-size:14px; font-weight:normal; border:2px solid transparent; outline: 0px; background-color:#D3D3D3; } .search .frame .suggestions .item { display:grid; grid-template-columns: 60px auto ; height:60px; gap:4px; padding:8px; align-items:center; } .search .frame .suggestions .item .title { width:85%; overflow:hidden; font-size:14px; font-weight: normal; text-transform:capitalize; text-overflow: ellipsis; white-space: nowrap;} .search .frame .suggestions .item .author {width:80%; overflow:hidden; font-size:14px; font-weight: lighter;text-transform: capitalize;text-overflow: ellipsis; white-space: nowrap;} .search .frame .suggestions .item .picture{ height:50px; display:grid; grid-template-columns: auto; padding:4px; } .search .frame .suggestions .item .link { display:grid; grid-template-columns: auto 120px; font-size:12px; align-items:center; align-content: center; overflow:hidden; }