Files
frontend-app-authoring/src/search-modal/SearchModal.scss
Rômulo Penido 25ab1fffa1 feat: adds filter by tags and contentType to library home (#1141)
Refactor to add search-manager feature.

Co-authored-by: Yusuf Musleh <yusuf@opencraft.com>
2024-07-24 12:13:24 -07:00

70 lines
2.2 KiB
SCSS

// Simulate Tailwind-style arbitrary value classNames. We have to hard code this one though.
.h-\[calc\(100vh-200px\)\] {
height: calc(100vh - 200px);
}
// Helper to set a minimum width for the This Course / All Courses toggle
.pgn__menu-select.with-min-toggle-width {
& > button {
min-width: 155px;
}
}
.courseware-search-modal {
// Fix so the 'This course' / 'All courses' dropdown is not cut off on the right hand side,
// But still preserve correct scrolling behavior for the results list (vertical)
// (If we set 'isOverflowVisible: true', the scrolling of the results list is messed up)
overflow: visible;
// Highlight matching terms using bold, not yellow highlighting
mark {
font-weight: bold;
background-color: transparent;
padding: 0;
display: inline;
}
.pgn__modal-header .pgn__menu-select {
// The "All courses" / "This course" toggle button
& > button {
min-width: 155px; // Set a minumum width so it doesn't change size when you change the selection
// The current Open edX theme makes the search field square but the button round and it looks bad. We need this
// hacky override until the theme is fixed to be more consistent.
border-radius: 0;
// Needed so the the focus borders matches the button's borders
&:focus::before {
border-radius: 0;
}
}
}
.pgn__menu-item {
// Fix a bug in Paragon menu dropdowns: the checkbox currently shrinks if the text is too long.
// https://github.com/openedx/paragon/pull/3019
// This can be removed once we upgrade Paragon - https://github.com/openedx/frontend-app-course-authoring/pull/933
input[type="checkbox"] {
flex-grow: 0;
flex-shrink: 0;
}
// Fix a bug in Paragon menu dropdowns: very long text is not truncated with an ellipsis
// https://github.com/openedx/paragon/pull/3019
// This can be removed once we upgrade Paragon - https://github.com/openedx/frontend-app-course-authoring/pull/933
> div {
overflow: hidden;
}
}
.search-result {
&:hover {
background-color: $gray-100;
cursor: pointer;
}
&:hover.text-muted {
cursor: unset;
background-color: unset;
}
}
}