Work on using Emoji Mart picker
This commit is contained in:
parent
e882c2a352
commit
3d64f9647c
9 changed files with 12 additions and 103 deletions
Binary file not shown.
BIN
app/soapbox/features/soapbox_config/components/icon_picker.js
Normal file
BIN
app/soapbox/features/soapbox_config/components/icon_picker.js
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
app/soapbox/features/soapbox_config/utils/async.js
Normal file
BIN
app/soapbox/features/soapbox_config/utils/async.js
Normal file
Binary file not shown.
|
@ -179,6 +179,10 @@ code {
|
|||
}
|
||||
}
|
||||
|
||||
.input.font_icon_picker {
|
||||
width: 52px;
|
||||
}
|
||||
|
||||
.input.with_block_label {
|
||||
max-width: none;
|
||||
|
||||
|
@ -255,10 +259,6 @@ code {
|
|||
}
|
||||
}
|
||||
|
||||
.input.popup {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.input.radio_buttons .radio label {
|
||||
margin-bottom: 5px;
|
||||
font-family: inherit;
|
||||
|
@ -511,92 +511,18 @@ code {
|
|||
}
|
||||
}
|
||||
|
||||
&__icon_picker {
|
||||
&__font_icon_picker {
|
||||
font-size: 14px;
|
||||
|
||||
.rfipbtn {
|
||||
display: inline-flex;
|
||||
line-height: 19px;
|
||||
min-height: 19px;
|
||||
padding: 0;
|
||||
.font-icon-button {
|
||||
padding: 9px;
|
||||
border: 1px solid var(--highlight-text-color);
|
||||
border-radius: 4px;
|
||||
|
||||
&__icon {
|
||||
margin: 3.5px 0 3.5px 10px;
|
||||
.fa {
|
||||
font-size: 18px;
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
&--default {
|
||||
.rfipbtn__icon {
|
||||
border-color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
.rfipbtn__del {
|
||||
background-color: var(--primary-text-color--faint);
|
||||
color: var(--foreground-color);
|
||||
}
|
||||
|
||||
.rfipbtn__button {
|
||||
border-left: 1px solid var(--highlight-text-color);
|
||||
background-color: var(--foreground-color);
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
&__icon--empty {
|
||||
text-transform: none;
|
||||
font-style: normal;
|
||||
color: var(--primary-text-color--faint);
|
||||
font-size: 16px;
|
||||
line-height: 15px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
&__current {
|
||||
flex: 0;
|
||||
}
|
||||
|
||||
&--default:active,
|
||||
&--default:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&__button {
|
||||
border-top-right-radius: inherit;
|
||||
border-bottom-right-radius: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.rfipdropdown {
|
||||
&--default {
|
||||
background-color: var(--background-color);
|
||||
border: none;
|
||||
color: var(--primary-text-color);
|
||||
width: 325px;
|
||||
|
||||
input,
|
||||
select {
|
||||
color: var(--primary-text-color);
|
||||
background-color: var(--foreground-color);
|
||||
}
|
||||
|
||||
.rfipsearch input:focus,
|
||||
.rfipsearch input:active {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.rfipicons__ibox,
|
||||
.rfipicons__left,
|
||||
.rfipicons__right {
|
||||
border: none;
|
||||
background-color: var(--foreground-color);
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
.rfipicons__cp,
|
||||
.rfipcategory select {
|
||||
border-bottom: 1px solid var(--highlight-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -45,7 +45,6 @@
|
|||
"@babel/preset-env": "^7.3.4",
|
||||
"@babel/preset-react": "^7.0.0",
|
||||
"@babel/runtime": "^7.3.4",
|
||||
"@fonticonpicker/react-fonticonpicker": "^1.2.0",
|
||||
"@popperjs/core": "^2.4.4",
|
||||
"array-includes": "^3.0.3",
|
||||
"autoprefixer": "^10.0.0",
|
||||
|
@ -114,7 +113,6 @@
|
|||
"react-swipeable-views": "^0.13.0",
|
||||
"react-textarea-autosize": "^8.0.0",
|
||||
"react-toggle": "^4.0.1",
|
||||
"react-transition-group": "^2.3.0",
|
||||
"redux": "^4.0.5",
|
||||
"redux-immutable": "^4.0.0",
|
||||
"redux-thunk": "^2.2.0",
|
||||
|
|
17
yarn.lock
17
yarn.lock
|
@ -1345,11 +1345,6 @@
|
|||
minimatch "^3.0.4"
|
||||
strip-json-comments "^3.1.1"
|
||||
|
||||
"@fonticonpicker/react-fonticonpicker@^1.2.0":
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@fonticonpicker/react-fonticonpicker/-/react-fonticonpicker-1.2.0.tgz#cbcb898f3d788ef50d7090fe623afe2e8e5eb1d7"
|
||||
integrity sha512-I7U4VNIpwJHnOaWq1v2MSuaUTxPiur/MYG4B1hr+FWI1O7k+tTym1ysdAyfp7YbEdF4Q8TYoY5Q2hbTmhQeTSQ==
|
||||
|
||||
"@formatjs/ecma402-abstract@^1.2.3":
|
||||
version "1.2.3"
|
||||
resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.2.3.tgz#ca94911dd8e9c89eeaabba0f00e2f692979fc27b"
|
||||
|
@ -4342,7 +4337,7 @@ dom-converter@^0.2:
|
|||
dependencies:
|
||||
utila "~0.4"
|
||||
|
||||
dom-helpers@^3.2.1, dom-helpers@^3.3.1, dom-helpers@^3.4.0:
|
||||
dom-helpers@^3.2.1, dom-helpers@^3.3.1:
|
||||
version "3.4.0"
|
||||
resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.4.0.tgz#e9b369700f959f62ecde5a6babde4bccd9169af8"
|
||||
integrity sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==
|
||||
|
@ -10074,16 +10069,6 @@ react-transition-group@^2.2.1:
|
|||
prop-types "^15.6.2"
|
||||
react-lifecycles-compat "^3.0.4"
|
||||
|
||||
react-transition-group@^2.3.0:
|
||||
version "2.9.0"
|
||||
resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.9.0.tgz#df9cdb025796211151a436c69a8f3b97b5b07c8d"
|
||||
integrity sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==
|
||||
dependencies:
|
||||
dom-helpers "^3.4.0"
|
||||
loose-envify "^1.4.0"
|
||||
prop-types "^15.6.2"
|
||||
react-lifecycles-compat "^3.0.4"
|
||||
|
||||
react@^16.13.1:
|
||||
version "16.13.1"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
|
||||
|
|
Loading…
Reference in a new issue