ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Adjust position of see all and search scrollbar 

Description: Adjust the position for the See all button on
smaller mobile view and remove the scrollbars in the
search input in mobile view
test plan: Go to Discover page adjust the screen size down to 320px
flag=lti_registrations_page
refs LRN-8726

Change-Id: I6b291c9ab9bf6f3371e8bb0b9e5b01044aee0da2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/359936
Reviewed-by: Westin Humble <westin.humble@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Panna Kristóf <panna.kristof@instructure.com>
Product-Review: Panna Kristóf <panna.kristof@instructure.com>
This commit is contained in:
David Veres 2024-10-21 10:55:58 +02:00
parent 7cd6542083
commit 13543fd7ea
3 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ui/shared/lti-apps/components/apps/Products.tsx
View File

@ -46,6 +46,7 @@ export const Products = (props: {
props
const {queryParams, setQueryParams, updateQueryParams} = useDiscoverQueryParams()
const isLarge = useMedia(`(min-width: ${breakpoints.large})`)
const isMobile = useMedia(`(min-width: ${breakpoints.mobile})`)
const renderProducts = (products: Product[]) => {
if (!isLarge) {
@ -133,10 +134,13 @@ export const Products = (props: {
{group.tag_group.name}
</Heading>
<Flex justifyItems="space-between" margin="0 0 medium 0">
<View margin="x-small 0 small 0" padding="0 small 0 0">
<View margin="x-small 0 small 0" padding="0 small 0 0" maxWidth="70%">
{group.tag_group.description}
</View>
<CondensedButton onClick={() => setTag(group.tag_group)}>
<CondensedButton
onClick={() => setTag(group.tag_group)}
margin={isMobile ? '0 small 0 0' : '0'}
>
{I18n.t('See All')}
</CondensedButton>
</Flex>

2
ui/shared/lti-apps/components/apps/SearchAndFilter.tsx
View File

@ -42,7 +42,7 @@ export const SearchAndFilter = (props: {setIsTrayOpen: (isOpen: boolean) => void
return (
<Flex gap="small" margin="0 0 small 0" direction={isMobile ? 'column-reverse' : 'row'}>
<Flex.Item shouldGrow={true}>
<Flex.Item shouldGrow={true} overflowX="hidden" overflowY="hidden">
<View as="div">
<TextInput
renderLabel={

13
ui/shared/lti-apps/components/common/Disclaimer.tsx
View File

@ -18,16 +18,19 @@
import React from 'react'
import {useScope as useI18nScope} from '@canvas/i18n'
import {Text} from '@instructure/ui-text'
import {View} from '@instructure/ui-view'
const I18n = useI18nScope('lti_registrations')
function Disclaimer() {
return (
<Text color="secondary">
{I18n.t(
'Apps offered in the Canvas Apps library are not reviewed or otherwise vetted by Instructure. We encourage you to review the AI, privacy, and security practices of each provider before connecting to your Canvas LMS account.'
)}
</Text>
<View as="div">
<Text color="secondary">
{I18n.t(
'Apps offered in the Canvas Apps library are not reviewed or otherwise vetted by Instructure. We encourage you to review the AI, privacy, and security practices of each provider before connecting to your Canvas LMS account.'
)}
</Text>
</View>
)
}