Projekt

Obecné

Profil

« Předchozí | Další » 

Revize a44aa67e

Přidáno uživatelem Jaroslav Hrubý před téměř 3 roky(ů)

Tag buttons tooltips implemented

Zobrazit rozdíly:

webapp/components/annotation/CategoryItem.tsx
1 1 
import { Col, Container, Row, Stack } from 'react-bootstrap';
2 
import { Button } from 'antd';
3 
import { DownOutlined, TagOutlined, UpOutlined } from '@ant-design/icons';
2 
import { Button, Tooltip } from 'antd';
3 
import {
4 
    DownOutlined,
5 
    QuestionCircleOutlined,
6 
    TagOutlined,
7 
    UpOutlined,
8 
} from '@ant-design/icons';
4 9 
import { TagCategoryInfo } from '../../api';
5 10 
import React, { useState } from 'react';
6 11 
import { TagItem } from './TagItem';
......
39 44 
                    className="w-100 text-start rounded"
40 45 
                >
41 46 
                    {props.category.name}
47 
                    {props.category.description && props.category.description !== '' && (
48 
                        <Tooltip
49 
                            title={props.category.description}
50 
                            key={props.category.description}
51 
                        >
52 
                            <QuestionCircleOutlined />
53 
                        </Tooltip>
54 
                    )}
42 55 
                </Button>
43 56 
            </Row>
44 57 
            {visibleTags && (
webapp/components/annotation/SubTagItem.tsx
1 1 
import { SubTagInfo, TagInfo } from '../../api';
2 2 
import { Container, Row } from 'react-bootstrap';
3 
import { Button } from 'antd';
4 
import { useContext } from 'react';
3 
import { Button, Tooltip } from 'antd';
4 
import React, { useContext } from 'react';
5 5 
import { TagCategoryContext } from '../../contexts/TagCategoryContext';
6 6 
import { AnnotationContext } from '../../contexts/AnnotationContext';
7 
import { QuestionCircleOutlined } from '@ant-design/icons';
7 8 

  		




  8
  9
  
    
/**


  		




  9
  10
  
    
 * Creates a single tag item in a tag panel.


  		




  ......




  37
  38
  
    
                    disabled={submitting}


  		




  38
  39
  
    
                >


  		




  39
  40
  
    
                    {props.subTag.name}


  		




  
  41
  
    
                    {props.subTag.description && props.subTag.description !== '' && (


  		




  
  42
  
    
                        <Tooltip


  		




  
  43
  
    
                            title={props.subTag.description}


  		




  
  44
  
    
                            key={props.subTag.description}


  		




  
  45
  
    
                        >


  		




  
  46
  
    
                            <QuestionCircleOutlined />


  		




  
  47
  
    
                        </Tooltip>


  		




  
  48
  
    
                    )}


  		




  40
  49
  
    
                </Button>


  		




  41
  50
  
    
            </Row>


  		




  42
  51
  
    
        </Container>


  		












  

    
      webapp/components/annotation/TagItem.tsx
    
  





  1
  1
  
    
import { Container, Row, Stack } from 'react-bootstrap';


  		




  2
  2
  
    
import { TagInfo } from '../../api';


  		




  3
  
  
    
import { Button } from 'antd';


  		




  4
  
  
    
import { DownOutlined, TagOutlined, UpOutlined } from '@ant-design/icons';


  		




  
  3
  
    
import { Button, Tooltip } from 'antd';


  		




  
  4
  
    
import {


  		




  
  5
  
    
    DownOutlined,


  		




  
  6
  
    
    QuestionCircleOutlined,


  		




  
  7
  
    
    TagOutlined,


  		




  
  8
  
    
    UpOutlined,


  		




  
  9
  
    
} from '@ant-design/icons';


  		




  5
  10
  
    
import React, { useContext, useState } from 'react';


  		




  6
  11
  
    
import { SubTagItem } from './SubTagItem';


  		




  7
  12
  
    
import { TagCategoryContext } from '../../contexts/TagCategoryContext';


  		




  ......




  63
  68
  
    
                        className="w-100 text-start rounded"


  		




  64
  69
  
    
                        disabled={submitting}


  		




  65
  70
  
    
                    >


  		




  66
  
  
    
                        {props.tag.name}


  		




  67
  71
  
    
                        <TagOutlined style={{ color: props.tag.color ?? 'black' }} />


  		




  
  72
  
    
                        {props.tag.name}


  		




  
  73
  
    
                        {props.tag.description && props.tag.description !== '' && (


  		




  
  74
  
    
                            <Tooltip


  		




  
  75
  
    
                                title={props.tag.description}


  		




  
  76
  
    
                                key={props.tag.description}


  		




  
  77
  
    
                            >


  		




  
  78
  
    
                                <QuestionCircleOutlined />


  		




  
  79
  
    
                            </Tooltip>


  		




  
  80
  
    
                        )}


  		




  68
  81
  
    
                    </Button>


  		




  69
  82
  
    
                )}


  		




  70
  83
  
    
                {!hasSubTags && (


  		




  ......




  73
  86
  
    
                        className="w-100 text-start rounded"


  		




  74
  87
  
    
                        disabled={submitting}


  		




  75
  88
  
    
                    >


  		




  76
  
  
    
                        {props.tag.name}


  		




  77
  89
  
    
                        <TagOutlined style={{ color: props.tag.color ?? 'black' }} />


  		




  
  90
  
    
                        {props.tag.name}


  		




  
  91
  
    
                        {props.tag.description && props.tag.description !== '' && (


  		




  
  92
  
    
                            <Tooltip


  		




  
  93
  
    
                                title={props.tag.description}


  		




  
  94
  
    
                                key={props.tag.description}


  		




  
  95
  
    
                            >


  		




  
  96
  
    
                                <QuestionCircleOutlined />


  		




  
  97
  
    
                            </Tooltip>


  		




  
  98
  
    
                        )}


  		




  78
  99
  
    
                    </Button>


  		




  79
  100
  
    
                )}


  		




  80
  101
  
    
            </Row>


  		












Také k dispozici:  Unified diff