snapshot of https://github.com/jitsi/jitsi-meet.git @ fd1749dd28f4138aa80234fc7f311b19aaffa0e7 (2026-09-15)

react/features/settings/components/native/styles.ts

@@ -0,0 +1,244 @@
+import BaseTheme from '../../../base/ui/components/BaseTheme.native';
+
+export const ANDROID_UNDERLINE_COLOR = 'transparent';
+export const PLACEHOLDER_COLOR = BaseTheme.palette.focus01;
+
+/**
+ * The styles of the native components of the feature {@code settings}.
+ */
+export default {
+
+    profileContainerWrapper: {
+        margin: BaseTheme.spacing[4]
+    },
+
+    profileContainer: {
+        backgroundColor: BaseTheme.palette.ui02,
+        borderRadius: BaseTheme.shape.borderRadius,
+        alignItems: 'center',
+        flexDirection: 'row',
+        justifyContent: 'flex-start',
+        padding: BaseTheme.spacing[3]
+    },
+
+    profileView: {
+        flexGrow: 1,
+        flexDirection: 'column',
+        justifyContent: 'space-between'
+    },
+
+    applyProfileSettingsButton: {
+        marginHorizontal: BaseTheme.spacing[4],
+        marginVertical: BaseTheme.spacing[3]
+    },
+
+    avatarContainer: {
+        alignItems: 'center',
+        flexDirection: 'row',
+        justifyContent: 'center',
+        padding: BaseTheme.spacing[3],
+        margin: BaseTheme.spacing[4]
+    },
+
+    gavatarMessageContainer: {
+        marginHorizontal: BaseTheme.spacing[4],
+        color: BaseTheme.palette.text02,
+        marginTop: -BaseTheme.spacing[2],
+        ...BaseTheme.typography.bodyShortRegular
+    },
+
+    displayName: {
+        ...BaseTheme.typography.bodyLongRegularLarge,
+        color: BaseTheme.palette.text01,
+        marginLeft: BaseTheme.spacing[3],
+        position: 'relative'
+    },
+
+    profileViewArrow: {
+        position: 'absolute',
+        right: BaseTheme.spacing[3]
+    },
+
+    /**
+     * Style for screen container.
+     */
+    settingsViewContainer: {
+        backgroundColor: BaseTheme.palette.ui01,
+        flex: 1
+    },
+
+    /**
+     * Standardized style for a field container {@code View}.
+     */
+    fieldContainer: {
+        alignItems: 'center',
+        flexDirection: 'row',
+        minHeight: BaseTheme.spacing[8],
+        paddingHorizontal: BaseTheme.spacing[2],
+        justifyContent: 'space-between'
+    },
+
+    /**
+     * * Appended style for column layout fields.
+     */
+    fieldContainerColumn: {
+        alignItems: 'flex-start',
+        flexDirection: 'column'
+    },
+
+    /**
+     * Standard container for a {@code View} containing a field label.
+     */
+    fieldLabelContainer: {
+        alignItems: 'center',
+        flexShrink: 1,
+        flexDirection: 'row',
+        paddingLeft: BaseTheme.spacing[3],
+        paddingRight: BaseTheme.spacing[1]
+    },
+
+    /**
+     * Text of the field labels on the form.
+     */
+    fieldLabelText: {
+        ...BaseTheme.typography.bodyShortRegularLarge
+    },
+
+    /**
+     * Field container style for all but last row {@code View}.
+     */
+    fieldSeparator: {
+        marginHorizontal: BaseTheme.spacing[4],
+        borderBottomWidth: 1,
+        borderColor: BaseTheme.palette.ui05,
+        marginVertical: BaseTheme.spacing[3]
+    },
+
+    /**
+     * Style for the {@code View} containing each
+     * field values (the actual field).
+     */
+    fieldValueContainer: {
+        alignItems: 'center',
+        flexDirection: 'row',
+        flexShrink: 1,
+        justifyContent: 'flex-end',
+        paddingRight: BaseTheme.spacing[3]
+    },
+
+    /**
+     * Style for the form section separator titles.
+     */
+
+    formSectionTitleContent: {
+        backgroundColor: BaseTheme.palette.ui02,
+        paddingVertical: BaseTheme.spacing[1]
+    },
+
+    formSectionTitleText: {
+        ...BaseTheme.typography.bodyShortBold,
+        color: BaseTheme.palette.text02,
+        marginHorizontal: BaseTheme.spacing[4],
+        marginVertical: BaseTheme.spacing[3]
+    },
+
+    /**
+     * Global {@code Text} color for the components.
+     */
+    text: {
+        color: BaseTheme.palette.text01
+    },
+
+    /**
+     * Text input container style.
+     */
+    customContainer: {
+        marginBottom: BaseTheme.spacing[3],
+        marginHorizontal: BaseTheme.spacing[4],
+        marginTop: BaseTheme.spacing[2]
+    },
+
+    languageButtonContainer: {
+        borderRadius: BaseTheme.shape.borderRadius,
+        overflow: 'hidden'
+    },
+
+    languageButton: {
+        alignItems: 'center',
+        display: 'flex',
+        flexDirection: 'row',
+        height: BaseTheme.spacing[7],
+        justifyContent: 'center'
+    },
+
+    languageOption: {
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        height: BaseTheme.spacing[6],
+        marginHorizontal: BaseTheme.spacing[4],
+        borderBottomWidth: 1,
+        borderColor: BaseTheme.palette.ui05
+    },
+
+    selectedLanguage: {
+        color: BaseTheme.palette.text03
+    },
+
+    languageText: {
+        ...BaseTheme.typography.bodyShortRegularLarge,
+        color: BaseTheme.palette.text01,
+        marginHorizontal: BaseTheme.spacing[2]
+    },
+
+    /**
+     * Standard text input field style.
+     */
+    textInputField: {
+        color: BaseTheme.palette.field01,
+        flex: 1,
+        ...BaseTheme.typography.bodyShortRegularLarge,
+        textAlign: 'right'
+    },
+
+    /**
+     * Appended style for column layout fields.
+     */
+    textInputFieldColumn: {
+        backgroundColor: 'rgb(245, 245, 245)',
+        borderRadius: 8,
+        marginVertical: 5,
+        paddingVertical: 3,
+        textAlign: 'left'
+    },
+
+    /**
+     * Style for screen container.
+     */
+    screenContainer: {
+        flex: 1
+    },
+
+    linksSection: {
+        display: 'flex',
+        flexDirection: 'row',
+        flex: 1,
+        marginHorizontal: BaseTheme.spacing[3]
+    },
+
+    linksButton: {
+        width: '33%',
+        justifyContent: 'center',
+        flexDirection: 'row',
+        alignItems: 'center',
+        ...BaseTheme.typography.bodyShortBoldLarge
+    },
+
+    logBtn: {
+        marginRight: BaseTheme.spacing[3]
+    },
+
+    backBtn: {
+        marginLeft: BaseTheme.spacing[3]
+    }
+};