diff --git a/README.md b/README.md
index 39d8777..9435734 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,12 @@
# Element Web Modifications
-For version [f0ck.it version: 1.9.5-4](https://github.com/vector-im/element-web)
+For version [f0ck.it version: 1.9.6](https://github.com/vector-im/element-web) (Develop Branch)
Running at https://chat.f0ck.it
- glowers patchset (greentexting)
-- custom.css with some quality of life enhancements like smaller images/videos
-- Atmos default theme
+- Quality of Life css enhancements
# Compile yourself with patchset
`git pull https://github.com/vector-im/element-web`
@@ -18,16 +17,14 @@ Running at https://chat.f0ck.it
Copy the `patch` directory to the root of the element-web directory and run the patch after `yarn install`
+After successful `yarn install` copy the _QoLEhancements.scc file to `$element-web-path/node_modules/matrix-react-sdk/res/css/structures/` then go back one folder and run rethemendex.sh to regenerate the components file.
+
+Continue like normal...
+
`(cd node_modules/matrix-react-sdk; yarn reskindex)`
`yarn dist`
-After successful compile go to the dist/ directory and unpack your compiled element-web, open the index.html and add the following line after ``
-
-``
-
-Should be around line ~53
-
# If weak male download prebuilt
See prebuilt folder for that
diff --git a/_QoLEnhancements.scss b/_QoLEnhancements.scss
new file mode 100644
index 0000000..29f16a8
--- /dev/null
+++ b/_QoLEnhancements.scss
@@ -0,0 +1,62 @@
+/*
+ Quality of Life Enhancements to make Element less shitty
+ compared to other instant messaging clients out there,
+ make it feel a little bit more like a real thing.
+
+ Ideas by schrumpel, 12/11/2021
+
+*/
+
+/* The default behaviour is just horrible and triggers me everytime I scroll through the timeline, apply this and see for yourself why this is better! */
+.mx_MImageBody {
+ width: max-content!important;
+}
+/* Running a Discord bridge for example and you will thank me for this, this is important because otherwise Messages from people that use Discord are shown with less opacity than normal messages, because they are being sent as notices */
+.mx_MNoticeBody {
+ opacity: 1!important;
+}
+/* make the file clipper appear on the left side, more intuitive for me */
+.mx_AccessibleButton.mx_MessageComposer_button.mx_MessageComposer_upload {
+ position: absolute!important;
+ left: 10px!important;
+}
+/* remove the horrible and ugly padding from the right panel */
+.mx_MainSplit > .mx_RightPanel_ResizeWrapper {
+ padding: 0!important;
+}
+/* also the border radius! */
+.mx_RightPanel {
+ border-radius: 0!important;
+}
+/* make avatars more edgy, but only 15% */
+.mx_BaseAvatar_image {
+ border-top-left-radius: 5px!important;
+ border-top-right-radius: 5px!important;
+ border-bottom-left-radius: 5px!important;
+ border-bottom-right-radius: 5px!important;
+}
+
+.mx_DecoratedRoomAvatar.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar, .mx_ExtraTile.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
+ -webkit-mask-image: unset!important;
+ mask-image: unset!important;
+ }
+
+/* videos/images should not have rounded borders... */
+.mx_MImageBody_thumbnail, .mx_MVideoBody {
+ border-radius: 0!important;
+}
+
+/* fix the ugly room list white border */
+.mx_SpacePanel .mx_SpaceButton.mx_SpaceButton_active.mx_SpaceButton_narrow .mx_SpaceButton_selectionWrapper {
+ padding: 1px!important;
+ border: 3px solid transparent!important;
+ border-radius: 15%!important;
+ background: var(--roomlist-highlights-color) !important;
+ box-shadow: 1px 1px 0px white, 1px -1px 0px white, -1px -1px 0px white, -1px 1px 0px white;
+}
+
+/* wtf is wrong with you guys?! */
+/* why the hell are there 2 borders on the mx_RoomHeader? JESUS */
+.mx_RoomHeader_wrapper {
+ border: 0!important;
+}
\ No newline at end of file
diff --git a/config.json b/config.json
index 0bd515f..8fa83e4 100644
--- a/config.json
+++ b/config.json
@@ -11,7 +11,7 @@
"disable_3pid_login": false,
"brand": "f0ck.it",
"branding": {
- "welcomeBackgroundUrl": "/img/background-auth.jpg",
+ "welcomeBackgroundUrl": "https://w.wallhaven.cc/full/z8/wallhaven-z8dg9y.png",
"authFooterLinks": [{"text": "chat.f0ck.it is running with glowers patchset", "url": "https://git.lat/schrumpel/element-modifications"}]
},
"embeddedPages": {
@@ -31,7 +31,7 @@
"feature_dnd": true
},
"default_federate": true,
- "default_theme": "custom-Atmos",
+ "default_theme": "custom-Retus",
"roomDirectory": {
"servers": [
"matrix.org",
@@ -42,29 +42,33 @@
"settingDefaults": {
"breadcrumbs": true,
"custom_themes": [{
- "name": "Atmos",
- "is_dark": true,
- "colors": {
- "accent-color": "#1fb2b0",
- "accent": "#1fb2b0",
- "primary-color": "#1fb2b0",
- "warning-color": "#ff120c",
- "blah-bums-color": "#252525",
- "blah-bums-color-2": "#252525",
- "eventTile-hover-1": "4px solid #1fb2b0",
- "GroupPlaceHolder": "#252525",
- "sidebar-color": "#202020",
- "roomlist-background-color": "#252525",
- "roomlist-text-color": "#ffffff",
- "roomlist-text-secondary-color": "#b9b9b9",
- "roomlist-highlights-color": "#3b3b3b",
- "roomlist-separator-color": "#121212",
- "timeline-background-color": "#161618",
- "timeline-text-color": "#FFFFFF",
- "timeline-text-secondary-color": "#777777",
- "timeline-highlights-color": "#252525",
- "reaction-row-button-selected-bg-color": "#161618"
+ "name": "Retus",
+ "is_dark": true,
+ "colors": {
+ "accent-color": "#1fb2b0",
+ "accent": "#1fb2b0",
+ "primary-color": "#1fb2b0",
+ "warning-color": "#ff120c",
+ "alert": "#ff5050de",
+
+ "sidebar-color": "#161618",
+ "roomlist-background-color": "#252525",
+ "roomlist-text-color": "#dcddde",
+ "roomlist-text-secondary-color": "#8e9297",
+ "roomlist-highlights-color": "#3b3b3b",
+ "roomlist-separator-color": "#40444b",
+
+ "timeline-background-color": "#161618",
+ "timeline-text-color": "#dcddde",
+ "secondary-content": "#dcddde",
+ "tertiary-content": "#dcddde",
+ "timeline-text-secondary-color": "#b9bbbe",
+ "timeline-highlights-color": "#2b2b2b",
+ "reaction-row-button-selected-bg-color": "#b9bbbe",
+
+ "quinary-content": "#4b4b4b",
+ "system": "#3b3b3b"
}
}
]}
-}
+}
\ No newline at end of file
diff --git a/custom.css b/custom.css
deleted file mode 100644
index 7fcf464..0000000
--- a/custom.css
+++ /dev/null
@@ -1,384 +0,0 @@
-/* Element Web modification by @nixc:f0ck.it */
-/* Quality of Life enhancements the devs don't seem to see */
-/* f0ck.it version: 1.9.3-14 */
-.mx_AuthPage_modalContent {
- background: #222121 !important;
-}
-
-.mx_Header_title {
- color: white;
- font-family: monospace;
- text-transform: uppercase full-width;
-}
-
-.mx_ButtonSignIn {
- background-color: #9f0;
- color: black !important;
- font-family: monspace;
- text-transform: uppercase full-width;
- font-weight: bold;
-}
-
-.mx_ButtonSignIn {
- background-color: #828384 !important;
-}
-
-.mx_AuthPage_modalBlur {
- filter: none !important;
- background: none !important;
-}
-
-.mx_AuthPage_modalContent {
- border-radius: 0 !important;
-}
-
-.mx_AuthPage {
-background: rgba(0, 0, 0, 0) url("img/background-auth.jpg") repeat fixed center center / cover !important;
-}
-
-body {
- background: #161618;
-}
-
-.mx_AuthBody_language .mx_Dropdown_input {
- color: #333435;
-}
-
-.mx_MImageBody_thumbnail_container {
- max-width: 430px;
-}
-
-.mx_ShareDialog_social_container {
- display: none;
-}
-
-.mx_MNoticeBody.mx_EventTile_content {
-/* background: #1c1c1e;
- border-radius: 5px;
- padding: 5px; */
- opacity: 1;
-}
-
-.mx_MStickerBody_wrapper {
- max-width: 500px;
-}
-
-.mx_MStickerBody_wrapper {
- padding: 0;
-}
-
-#stickerpicker > .mx_AppTileMenuBar {
- display: none;
-}
-
-.mx_ContextualMenu.mx_ContextualMenu_withChevron_bottom {
- border-radius: 0;
-}
-
-.mx_AppTileFullWidth {
- border-radius: 0;
- border: 0;
-}
-
-.mx_AppTileBody, .mx_AppTileBody_mini {
- border-radius: 0;
-}
-
-.mx_ContextualMenu.mx_ContextualMenu_withChevron_bottom {
- bottom: 8px;
- padding: 1px;
- margin: -1px;
- border: 1px solid black;
-}
-
-.mx_ContextualMenu_chevron_bottom {
- border-left: 8px solid #0000;
- border-top: 8px solid #000;
- border-right: 8px solid transparent;
-}
-
-.mx_MImageBody_thumbnail {
- border-radius: 0;
-}
-
-span.mx_MVideoBody video.mx_MVideoBody {
- max-height: 480px;
- max-width: 480px;
- border-radius: 0;
- /*min-width: 480px;*/
- background: black;
-}
-
-.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_userHeader {
- padding: 5px;
- order: 3;
- border-top: 1px solid var(--roomlist-separator-color);
-}
-
-.mx_LeftPanel .mx_LeftPanel_roomListContainer .mx_LeftPanel_filterContainer {
- margin-left: 0;
- margin-right: 0;
-}
-
-.mx_RoomSearch.mx_RoomSearch_focused {
- -webkit-box-shadow: none;
- box-shadow: none;
- border-color: transparent;
- border-radius: 0;
- background: #161618;
-}
-
-.mx_UserMenu .mx_UserMenu_headerButtons::before {
- mask-image: url(../../img/feather-customised/chevron-down.5278abe.svg);
- -webkit-transform: rotate(180deg);
- transform: rotate(180deg);
-}
-
-.mx_AccessibleButton.mx_MessageComposer_button.mx_MessageComposer_upload {
- order: -1;
-}
-
-.mx_MessageComposer_upload {
- margin-right: 30px;
- margin-left: 20px;
-}
-
-.mx_MessageComposer .mx_MessageComposer_avatar {
- position: relative;
- left: -15px;
-}
-
-.mx_MessageComposer_wrapper {
- padding-left: 15px;
- padding-right: 5px;
-}
-
-.mx_MainSplit > .mx_RightPanel_ResizeWrapper {
- padding: 0;
-}
-
-.mx_RightPanel {
- border-radius: 0;
-}
-
-.mx_AccessibleButton.mx_MessageComposer_button.mx_MessageComposer_voiceMessage {
- order: 1;
-}
-
-.mx_MessageComposer_button {
- order: 2;
-}
-
-.mx_BetaCard {
- background-color: #252526;
-}
-
-.mx_MImageBody_gifLabel {
- display: none;
-}
-
-.mx_VoiceMessagePrimaryContainer .mx_Clock {
- width: auto;
- padding-right: 6px;
- padding-left: 8px;
-}
-
-.mx_MImageBody {
- display: block;
- margin-right: 0;
- width: max-content;
- min-width: unset;
- max-width: 50%;
-}
-
-/* .mx_MFileBody {
- max-width: 0ch;
- display: flex;
- height: 0;
- overflow: hidden;
-} */
-
-.mx_BaseAvatar_image {
- border-top-left-radius: 5px;
- border-top-right-radius: 5px;
- border-bottom-left-radius: 5px;
- border-bottom-right-radius: 5px;
-}
-
-.mx_DecoratedRoomAvatar.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar, .mx_ExtraTile.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
- -webkit-mask-image: unset;
- mask-image: unset;
-}
-
-span.mx_MVideoBody video.mx_MVideoBody {
- max-height: 270px;
- max-width: 0;
- border-radius: 5px;
- min-width: 480px;
- background: black;
- margin-top: 5px;
-}
-
-.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_line, .mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_reply {
- padding-top: 5px;
- padding-bottom: 5px;
-}
-
-.mx_MImageBody_thumbnail {
- margin-bottom: 5px;
- padding-bottom: 5px;
-}
-
-.mx_InlineSpinner {
- display: inline;
- position: relative;
- left: 0;
- top: 5px;
-}
-
-.mx_Spinner_icon {
- background-color: #000;
- -webkit-animation: spin 2.1s steps(60) infinite;
- animation: spin 2.1s steps(60) infinite;
- filter: invert(100);
-}
-
-.mx_SendMessageComposer .mx_BasicMessageComposer {
- -ms-flex: 1;
- flex: 1;
- -ms-flex-direction: column;
- flex-direction: column;
- min-height: 48px;
-}
-
-.mx_MessageComposer_wrapper {
- padding-left: 0;
- padding-right: 0;
-}
-
-.mx_MainSplit > .mx_RightPanel_ResizeWrapper {
- margin-left: 0;
-}
-
-.mx_LeftPanel {
- z-index: 1;
-}
-
-.mx_ReplyPreview {
- border: 0;
- border-bottom-color: currentcolor;
- border-bottom-style: none;
- border-bottom-width: 0px;
- background: var(--timeline-background-color);
- border-bottom: none;
- border-radius: 0;
- max-height: 50vh;
- overflow: auto;
- -webkit-box-shadow: none;
- box-shadow: none;
- margin: 0;
- z-index: 0;
-}
-
-.mx_EventTile_content .markdown-body code, .mx_EventTile_content .markdown-body pre {
- background-color: black;
-}
-
-.hljs {
- color: #ece0e0;
-}
-
-.mx_EventTile[data-layout=bubble][data-self=true] {
- --backgroundColor: #252525;
-}
-
-.mx_EventTile[data-layout=bubble][data-self=false] {
- --backgroundColor: #252525;
-}
-
-.mx_EventTile[data-layout=bubble] .mx_EventTile_avatar img {
- -webkit-box-shadow: 0 0 0 3px #252525;
- box-shadow: 0 0 0 3px #252525;
- border-radius: 50%;
-}
-
-.mx_EventTile[data-layout=bubble].mx_EventTile_selected:before, .mx_EventTile[data-layout=bubble]:hover:before {
- background: #25252540;
-}
-
-.mx_EventTile[data-layout=bubble].mx_EventTile_selected .mx_EventTile_avatar img, .mx_EventTile[data-layout=bubble]:hover .mx_EventTile_avatar img {
- -webkit-box-shadow: 0 0 0 3px #252525;
- box-shadow: 0 0 0 3px #252525;
-}
-
-.mx_MediaBody.mx_AudioPlayer_container .mx_AudioPlayer_seek .mx_Clock {
- width: auto;
-}
-
-.mx_ToastContainer .mx_Toast_toast, .mx_ToastContainer.mx_ToastContainer_stacked::before {
- -webkit-box-shadow: 0px 0px 0px 1px rgba(136, 131, 131, 0.5);
- box-shadow: 0px 0px 0px 1px rgba(136, 131, 131, 0.5);
- border-radius: 0;
- background: #202020;
-}
-
-.mx_NotificationBadge.mx_NotificationBadge_visible {
- background-color: #ff0707;
-}
-
-.mx_MessageComposer_e2eIcon.mx_E2EIcon {
- position: absolute;
- left: 55px;
- margin-right: 0;
- top: 25px;
-}
-
-.mx_ContextualMenu {
- border-radius: 0;
-}
-
-.mx_Dialog {
- -webkit-box-shadow: unset;
- box-shadow: unset;
- border-radius: 0;
-}
-
-.mx_MatrixChat_useCompactLayout .mx_EventTile .mx_EventTile_e2eIcon {
- top: 10px;
- opacity: 0.1;
-}
-
-
-/* in v 1.19.1 the access menu had no color anymore, this attempts to fix it */
-.mx_AccessibleButton.mx_MessageActionBar_maskButton::after {
- background: white;
-}
-
-.mx_ToastContainer {
- background: var(--roomlist-background-color);
-}
-
-.mx_AppPermissionWarning {
- background: #161618;
- padding: 5px;
-}
-
-.mx_ContextualMenu {
- -webkit-box-shadow: none;
- box-shadow: none;
- color: var(--timeline-text-color);
- border: 1px solid #2e2e30;
- margin: 5px;
-}
-
-.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList .mx_AccessibleButton:hover {
- background-color: var(--roomlist-highlights-color);
-}
-
-.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:last-child .mx_AccessibleButton:last-child {
- border-radius: 0;
-}
-
-.mx_IconizedContextMenu .mx_IconizedContextMenu_optionList:first-child .mx_AccessibleButton:first-child {
- border-radius: 0;
-}
\ No newline at end of file
diff --git a/prebuilt/README.md b/prebuilt/README.md
index e253fc7..bd15936 100644
--- a/prebuilt/README.md
+++ b/prebuilt/README.md
@@ -1 +1 @@
- The prebuilt archives are vanilla Element except for the greentext patch!
\ No newline at end of file
+All prebuilt versions from `element-v1.9.6-24` on will contain customized css and the greentext patch, below this version it's vanilla except for the greentext patch!
\ No newline at end of file
diff --git a/prebuilt/element-v1.9.6-24-g0744c86a.tar.gz b/prebuilt/element-v1.9.6-24-g0744c86a.tar.gz
new file mode 100644
index 0000000..7ee51c6
Binary files /dev/null and b/prebuilt/element-v1.9.6-24-g0744c86a.tar.gz differ