wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-29 11:28:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

update markers to make sure they're legible (#2745)

Browse Source
This commit is contained in:
Tessa Thornton
2019-12-09 16:11:12 -05:00
committed by Kim Gardner
parent 88f6cad840
commit 514a549a77
6 changed files with 70 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/admin/components/ModerateCard/Markers.css
-1
View File
@@ -16,7 +16,6 @@
}
.detailsText {
color: var(--v2-palette-details-header);
margin: 0;
}
src/core/client/admin/components/ModerateCard/Markers.tsx
+11 -2
View File
@@ -2,7 +2,12 @@ import { Localized } from "fluent-react/compat";
import React, { FunctionComponent, useCallback, useState } from "react";
import { useUUID } from "coral-framework/hooks";
import { Button, Flex, HorizontalGutter, Icon } from "coral-ui/components/v2";
import {
Button,
ButtonIcon,
Flex,
HorizontalGutter,
} from "coral-ui/components/v2";
import styles from "./Markers.css";
@@ -28,14 +33,18 @@ const Markers: FunctionComponent<Props> = ({ children, details }) => {
variantDefault: styles.detailsButton,
colorDefault: styles.detailsButtonColorRegular,
}}
variant="ghost"
onClick={toggleDetails}
aria-controls={uuid}
aria-expanded={showDetails}
color="mono"
>
<Localized id="moderate-markers-details">
<span className={styles.detailsText}>DETAILS</span>
</Localized>
<Icon>{showDetails ? "arrow_drop_up" : "arrow_drop_down"}</Icon>
<ButtonIcon>
{showDetails ? "arrow_drop_up" : "arrow_drop_down"}
</ButtonIcon>
</Button>
)}
</Flex>
src/core/client/admin/test/moderate/__snapshots__/regularQueue.spec.tsx.snap
+28 -28
View File
@@ -170,9 +170,9 @@ exports[`approves comment in reported queue: dangling 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -188,7 +188,7 @@ exports[`approves comment in reported queue: dangling 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -423,9 +423,9 @@ exports[`rejects comment in reported queue: dangling 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -441,7 +441,7 @@ exports[`rejects comment in reported queue: dangling 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -673,9 +673,9 @@ exports[`renders reported queue with comments 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -691,7 +691,7 @@ exports[`renders reported queue with comments 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -910,9 +910,9 @@ exports[`renders reported queue with comments 1`] = `
<button
aria-controls="uuid-1"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -928,7 +928,7 @@ exports[`renders reported queue with comments 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -1163,9 +1163,9 @@ exports[`renders reported queue with comments 2`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -1181,7 +1181,7 @@ exports[`renders reported queue with comments 2`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -1400,9 +1400,9 @@ exports[`renders reported queue with comments 2`] = `
<button
aria-controls="uuid-1"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -1418,7 +1418,7 @@ exports[`renders reported queue with comments 2`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -1661,9 +1661,9 @@ exports[`renders reported queue with comments and load more 1`] = `
<button
aria-controls="uuid-2"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -1679,7 +1679,7 @@ exports[`renders reported queue with comments and load more 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
src/core/client/admin/test/moderate/__snapshots__/rejectedQueue.spec.tsx.snap
+16 -16
View File
@@ -170,9 +170,9 @@ exports[`approves comment in rejected queue: dangling 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -188,7 +188,7 @@ exports[`approves comment in rejected queue: dangling 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -420,9 +420,9 @@ exports[`renders rejected queue with comments 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -438,7 +438,7 @@ exports[`renders rejected queue with comments 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -657,9 +657,9 @@ exports[`renders rejected queue with comments 1`] = `
<button
aria-controls="uuid-1"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -675,7 +675,7 @@ exports[`renders rejected queue with comments 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -913,9 +913,9 @@ exports[`renders rejected queue with comments and load more 1`] = `
<button
aria-controls="uuid-2"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -931,7 +931,7 @@ exports[`renders rejected queue with comments and load more 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
src/core/client/admin/test/moderate/__snapshots__/singleComment.spec.tsx.snap
+12 -12
View File
@@ -131,9 +131,9 @@ exports[`approves single comment 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -149,7 +149,7 @@ exports[`approves single comment 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -345,9 +345,9 @@ exports[`rejects single comment 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -363,7 +363,7 @@ exports[`rejects single comment 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
@@ -594,9 +594,9 @@ exports[`renders single comment view 1`] = `
<button
aria-controls="uuid-0"
aria-expanded={false}
className="BaseButton-root Button-root Button-sizeSmall Button-colorDefault Markers-detailsButtonColorRegular Button-variantDefault Markers-detailsButton Button-uppercase"
data-color="default"
data-variant="default"
className="BaseButton-root Button-root Button-sizeSmall Button-colorMono Button-variantGhost Button-uppercase"
data-color="mono"
data-variant="ghost"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -612,7 +612,7 @@ exports[`renders single comment view 1`] = `
</span>
<i
aria-hidden="true"
className="Icon-root Icon-sm"
className="Icon-root Icon-sm ButtonIcon-root"
>
arrow_drop_down
</i>
src/core/client/ui/components/v2/Marker/Marker.css
+3
View File
@@ -23,11 +23,14 @@
}
.variantFilled {
color: var(--v2-colors-pure-white);
&.colorReported {
background-color: var(--v2-palette-marker-reported);
border-color: var(--v2-palette-marker-reported);
}
&.colorPending {
background-color: var(--v2-palette-marker-pending);
border-color: var(--v2-palette-marker-pending);
}
}