[CORL-550] More stable css classes (#2515)

* feat: more stable css classes

* chore: renamee ValidationMessageHelper to FormValidationMessage

* chore: Rename FormValidationMessage to FieldValidationMessage

* feat: more css classes, icons use <i> tag

* feat: stable classnames for gdpr features

* feat: more css stable classnames
This commit is contained in:
Vinh
2019-09-04 12:34:42 -04:00
committed by Kim Gardner
parent fcf3640adc
commit aa32fcaea6
157 changed files with 2965 additions and 1531 deletions
@@ -91,12 +91,12 @@ exports[`approves comment in reported queue: dangling 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -158,12 +158,12 @@ exports[`approves comment in reported queue: dangling 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -196,12 +196,12 @@ exports[`approves comment in reported queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -215,12 +215,12 @@ exports[`approves comment in reported queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -319,12 +319,12 @@ exports[`rejects comment in reported queue: dangling 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -386,12 +386,12 @@ exports[`rejects comment in reported queue: dangling 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -424,12 +424,12 @@ exports[`rejects comment in reported queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -443,12 +443,12 @@ exports[`rejects comment in reported queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -544,12 +544,12 @@ exports[`renders reported queue with comments 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -611,12 +611,12 @@ exports[`renders reported queue with comments 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -649,12 +649,12 @@ exports[`renders reported queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -668,12 +668,12 @@ exports[`renders reported queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -756,12 +756,12 @@ exports[`renders reported queue with comments 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -823,12 +823,12 @@ exports[`renders reported queue with comments 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -861,12 +861,12 @@ exports[`renders reported queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -880,12 +880,12 @@ exports[`renders reported queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -984,12 +984,12 @@ exports[`renders reported queue with comments 2`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -1051,12 +1051,12 @@ exports[`renders reported queue with comments 2`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -1089,12 +1089,12 @@ exports[`renders reported queue with comments 2`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -1108,12 +1108,12 @@ exports[`renders reported queue with comments 2`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -1196,12 +1196,12 @@ exports[`renders reported queue with comments 2`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -1263,12 +1263,12 @@ exports[`renders reported queue with comments 2`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -1301,12 +1301,12 @@ exports[`renders reported queue with comments 2`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -1320,12 +1320,12 @@ exports[`renders reported queue with comments 2`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -1414,12 +1414,12 @@ exports[`renders reported queue with comments and load more 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -1499,12 +1499,12 @@ exports[`renders reported queue with comments and load more 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -1537,12 +1537,12 @@ exports[`renders reported queue with comments and load more 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -1556,12 +1556,12 @@ exports[`renders reported queue with comments and load more 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -91,12 +91,12 @@ exports[`approves comment in rejected queue: dangling 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -158,12 +158,12 @@ exports[`approves comment in rejected queue: dangling 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -196,12 +196,12 @@ exports[`approves comment in rejected queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -215,12 +215,12 @@ exports[`approves comment in rejected queue: dangling 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -316,12 +316,12 @@ exports[`renders rejected queue with comments 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -383,12 +383,12 @@ exports[`renders rejected queue with comments 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -421,12 +421,12 @@ exports[`renders rejected queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -440,12 +440,12 @@ exports[`renders rejected queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -528,12 +528,12 @@ exports[`renders rejected queue with comments 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -595,12 +595,12 @@ exports[`renders rejected queue with comments 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -633,12 +633,12 @@ exports[`renders rejected queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -652,12 +652,12 @@ exports[`renders rejected queue with comments 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -746,12 +746,12 @@ exports[`renders rejected queue with comments and load more 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div>
@@ -826,12 +826,12 @@ exports[`renders rejected queue with comments and load more 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -864,12 +864,12 @@ exports[`renders rejected queue with comments and load more 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -883,12 +883,12 @@ exports[`renders rejected queue with comments and load more 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -33,12 +33,12 @@ exports[`all stories active search with no results 1`] = `
<div
className="Box-root Flex-root Field-begin Flex-flex Flex-alignCenter"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-md Field-searchIcon"
>
search
</span>
</i>
<div
className="Field-beginStories"
>
@@ -172,12 +172,12 @@ exports[`all stories active search with too many results 1`] = `
<span>
See all results
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm SeeAllOption-icon"
>
arrow_forward
</span>
</i>
</a>
</li>
`;
@@ -215,12 +215,12 @@ exports[`all stories renders search bar 1`] = `
<div
className="Box-root Flex-root Field-begin Flex-flex Flex-alignCenter"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-md Field-searchIcon"
>
search
</span>
</i>
</div>
<input
aria-autocomplete="list"
@@ -78,12 +78,12 @@ exports[`approves single comment 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div
@@ -124,12 +124,12 @@ exports[`approves single comment 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -162,12 +162,12 @@ exports[`approves single comment 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -181,12 +181,12 @@ exports[`approves single comment 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -272,12 +272,12 @@ exports[`rejects single comment 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div
@@ -318,12 +318,12 @@ exports[`rejects single comment 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -356,12 +356,12 @@ exports[`rejects single comment 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -375,12 +375,12 @@ exports[`rejects single comment 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -501,12 +501,12 @@ exports[`renders single comment view 1`] = `
target="_blank"
>
View Context
<span
<i
aria-hidden="true"
className="Icon-root Icon-xs TextLink-icon"
>
open_in_new
</span>
</i>
</a>
</div>
<div
@@ -547,12 +547,12 @@ exports[`renders single comment view 1`] = `
>
Details
</span>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
arrow_drop_down
</span>
</i>
</button>
</div>
</div>
@@ -585,12 +585,12 @@ exports[`renders single comment view 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg RejectButton-icon"
>
close
</span>
</i>
</button>
<button
aria-label="Approve"
@@ -604,12 +604,12 @@ exports[`renders single comment view 1`] = `
onTouchEnd={[Function]}
type="button"
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-lg ApproveButton-icon"
>
done
</span>
</i>
</button>
</div>
</div>
@@ -22,12 +22,12 @@ exports[`tab bar renders tab bar (empty queues) 1`] = `
href="/admin/moderate/reported"
onClick={[Function]}
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
flag
</span>
</i>
<span>
reported
</span>
@@ -51,12 +51,12 @@ exports[`tab bar renders tab bar (empty queues) 1`] = `
href="/admin/moderate/pending"
onClick={[Function]}
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
access_time
</span>
</i>
<span>
Pending
</span>
@@ -80,12 +80,12 @@ exports[`tab bar renders tab bar (empty queues) 1`] = `
href="/admin/moderate/unmoderated"
onClick={[Function]}
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
forum
</span>
</i>
<span>
unmoderated
</span>
@@ -109,12 +109,12 @@ exports[`tab bar renders tab bar (empty queues) 1`] = `
href="/admin/moderate/rejected"
onClick={[Function]}
>
<span
<i
aria-hidden="true"
className="Icon-root Icon-sm"
>
cancel
</span>
</i>
<span>
rejected
</span>