ReplyEditor: only show toolbar when active
This commit is contained in:
		
							parent
							
								
									2f8613c4fe
								
							
						
					
					
						commit
						baf0ed1447
					
				
					 2 changed files with 40 additions and 34 deletions
				
			
		| 
						 | 
				
			
			@ -229,51 +229,56 @@ const ReplyEditor: Component<{
 | 
			
		|||
      onClick={(e) => inputRef.focus()}
 | 
			
		||||
    >
 | 
			
		||||
      <div class={tootComposers.replyInput}>
 | 
			
		||||
        <Avatar src={props.profile.inf?.avatar} sx={{marginLeft: '-0.25em'}} />
 | 
			
		||||
        <Avatar
 | 
			
		||||
          src={props.profile.inf?.avatar}
 | 
			
		||||
          sx={{ marginLeft: "-0.25em" }}
 | 
			
		||||
        />
 | 
			
		||||
        <textarea
 | 
			
		||||
          ref={inputRef!}
 | 
			
		||||
          placeholder={`Reply to ${props.replyToDisplayName}...`}
 | 
			
		||||
          style={{ width: "100%", border: "none" }}
 | 
			
		||||
        ></textarea>
 | 
			
		||||
        <IconButton sx={{marginRight: '-0.5em'}}>
 | 
			
		||||
        <IconButton sx={{ marginRight: "-0.5em" }}>
 | 
			
		||||
          <Send />
 | 
			
		||||
        </IconButton>
 | 
			
		||||
      </div>
 | 
			
		||||
 | 
			
		||||
      <div
 | 
			
		||||
        style={{
 | 
			
		||||
          display: "flex",
 | 
			
		||||
          "justify-content": "flex-end",
 | 
			
		||||
          "margin-top": "8px",
 | 
			
		||||
          gap: "16px",
 | 
			
		||||
          "flex-flow": "row wrap",
 | 
			
		||||
        }}
 | 
			
		||||
      >
 | 
			
		||||
        <Button onClick={[setLangPickerOpen, true]}>
 | 
			
		||||
          <Translate sx={{ marginTop: "-0.25em", marginRight: "0.25em" }} />
 | 
			
		||||
          {iso639_1.getNativeName(language())}
 | 
			
		||||
          <ArrowDropDown sx={{ marginTop: "-0.25em" }} />
 | 
			
		||||
        </Button>
 | 
			
		||||
        <Button onClick={[setPermPicker, true]}>
 | 
			
		||||
          <Visibility sx={{ marginTop: "-0.15em", marginRight: "0.25em" }} />
 | 
			
		||||
          {visibilityText()}
 | 
			
		||||
          <ArrowDropDown sx={{ marginTop: "-0.25em" }} />
 | 
			
		||||
        </Button>
 | 
			
		||||
      </div>
 | 
			
		||||
      <Show when={typing()}>
 | 
			
		||||
        <div
 | 
			
		||||
          style={{
 | 
			
		||||
            display: "flex",
 | 
			
		||||
            "justify-content": "flex-end",
 | 
			
		||||
            "margin-top": "8px",
 | 
			
		||||
            gap: "16px",
 | 
			
		||||
            "flex-flow": "row wrap",
 | 
			
		||||
          }}
 | 
			
		||||
        >
 | 
			
		||||
          <Button onClick={[setLangPickerOpen, true]}>
 | 
			
		||||
            <Translate sx={{ marginTop: "-0.25em", marginRight: "0.25em" }} />
 | 
			
		||||
            {iso639_1.getNativeName(language())}
 | 
			
		||||
            <ArrowDropDown sx={{ marginTop: "-0.25em" }} />
 | 
			
		||||
          </Button>
 | 
			
		||||
          <Button onClick={[setPermPicker, true]}>
 | 
			
		||||
            <Visibility sx={{ marginTop: "-0.15em", marginRight: "0.25em" }} />
 | 
			
		||||
            {visibilityText()}
 | 
			
		||||
            <ArrowDropDown sx={{ marginTop: "-0.25em" }} />
 | 
			
		||||
          </Button>
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
      <TootVisibilityPickerDialog
 | 
			
		||||
        open={permPicker()}
 | 
			
		||||
        onClose={() => setPermPicker(false)}
 | 
			
		||||
        visibility={visibility()}
 | 
			
		||||
        onVisibilityChange={setVisibility}
 | 
			
		||||
      />
 | 
			
		||||
        <TootVisibilityPickerDialog
 | 
			
		||||
          open={permPicker()}
 | 
			
		||||
          onClose={() => setPermPicker(false)}
 | 
			
		||||
          visibility={visibility()}
 | 
			
		||||
          onVisibilityChange={setVisibility}
 | 
			
		||||
        />
 | 
			
		||||
 | 
			
		||||
      <TootLanguagePickerDialog
 | 
			
		||||
        open={langPickerOpen()}
 | 
			
		||||
        onClose={() => setLangPickerOpen(false)}
 | 
			
		||||
        code={language()}
 | 
			
		||||
        onCodeChange={setLanguage}
 | 
			
		||||
      />
 | 
			
		||||
        <TootLanguagePickerDialog
 | 
			
		||||
          open={langPickerOpen()}
 | 
			
		||||
          onClose={() => setLangPickerOpen(false)}
 | 
			
		||||
          code={language()}
 | 
			
		||||
          onCodeChange={setLanguage}
 | 
			
		||||
        />
 | 
			
		||||
      </Show>
 | 
			
		||||
    </div>
 | 
			
		||||
  );
 | 
			
		||||
};
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -270,6 +270,7 @@ const TootBottomSheet: Component = (props) => {
 | 
			
		|||
          )}
 | 
			
		||||
        </For>
 | 
			
		||||
      </TimeSourceProvider>
 | 
			
		||||
      <div style={{height: "var(--safe-area-inset-bottom, 0)"}}></div>
 | 
			
		||||
    </Scaffold>
 | 
			
		||||
  );
 | 
			
		||||
};
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue