diff --git a/client.sample.etuc.css b/client.sample.etuc.css deleted file mode 100644 index 27651d3..0000000 --- a/client.sample.etuc.css +++ /dev/null @@ -1,282 +0,0 @@ -:root { - --color-primary: pink; - --color-secondary: green; - --color-complementary: #6259E5; - --color-complementary-darken: #36383B; - --color-white: #FFFFFF; - - --color-black-h: 216; - --color-black-s: 4%; - --color-black-l: 22%; - - --color-main-background: var(--color-grey-13); - --color-main-text: #7A7F85; - --color-highlight-primary: var(--color-primary); - --color-user-panel: var(--color-black); - --color-bell: var(--color-secondary); - --color-avatar-background: #E4E8ED; - --color-title: #36383B; - --color-h1: var(--color-title); - --color-h2: var(--color-title); - - /* Depreciated */ - --color-tag-group-text: #9BA0A7; - --color-tag-group-border: var(--color-primary); - --color-label-dark: var(--color-grey-6); - - /* Header's elements */ - --color-header-background: var(--color-white); - --color-bell: var(--color-complementary-darken); - --color-notification-counter-number: black; - --color-notification-summary: #7A7F85; - --solid-notifications-theme: var(--color-primary); - --color-notification-item-border: #E4E8ED; - --color-notification-scrollbar-background: #EDF1FA; - --color-notification-scrollbar-track: #BDC2D7; - --color-user-panel-header-text: var(--color-complementary-darken); - --color-user-panel-header-background: var(--color-white); - --color-user-panel-header-text-open: var(--color-white); - --color-user-panel-header-background-open: var(--color-secondary); - --color-user-panel-list-background: var(--color-white); - --color-user-panel-list-text-hover: var(--color-complementary); - --color-user-panel-list-border: #E4E8ED; - - /* Left menu */ - --color-menu-highlight-primary: transparent; - --color-menu-background: var(--color-secondary); - --color-menu-text: var(--color-white); - --color-menu-text-active: var(--color-secondary); - --color-menu-background-active: var(--color-menu-highlight-primary); - --color-menu-badge-background: var(--color-menu-highlight-primary); - --color-menu-badge-text-active: var(--color-menu-highlight-primary); - --color-menu-badge-background-active: var(--color-secondary); - --color-menu-icon-background-active: var(--color-secondary); - - /* Right menu */ - --color-right-menu-background: #DAE2F3; - --color-right-menu-text: var(--color-secondary); - --color-right-menu-link-border: #BDC2D7; - --color-right-menu-active-text: var(--color-primary); - --color-right-menu-active-background: var(--color-secondary); - --color-right-menu-active-icon: var(--color-primary); - - /* Scrollbar */ - --color-scrollbar-right-background: var(--color-white); - --color-scrollbar-right-track: var(--color-grey-6); - --color-scrollbar-left-background: var(--color-secondary); - --color-scrollbar-left-track: var(--color-grey-11); - - /* Tags */ - --color-tag-admin-text: var(--color-complementary); - --color-tag-admin-border: var(--color-complementary); - - /* Form elements */ - --color-button-white: var(--color-white); - --color-button-primary: var(--color-primary); - --color-button-secondary: var(--color-complementary); - --color-button-complementary: var(--color-secondary); - - --color-input-background: #EDF1FA; - --color-input-text: var(--color-secondary); - --color-input-icon: var(--color-complementary); - --color-input-active: var(--color-complementary); - --color-fieldset: var(--color-title); - --color-fieldset-border: #DAE2F3; - --color-button-modal: var(--color-title); - --color-select-list: var(--color-secondary); - --color-select-add-button: var(--color-button-secondary); - --color-select-add-button-background: var(--color-button-white); - - --color-label-light: var(--color-grey-6); - - /* Skill */ - --color-skill-background: var(--color-primary); - --color-skill-text: var(--color-white); - - /* Icon */ - --color-icon: var(--color-primary); - - /* Table */ - --color-table-header-background: #BDC2D7; - --color-table-header-text: var(--color-white); - --color-table-border: #BDC2D7; - - /* User thumb */ - --color-user-thumb-name: #7A7F85; - - --color-backlink: var(--color-secondary); - --color-content-header: #DAE2F3; - - /* Chat */ - --color-chat-white: var(--color-white); - --color-chat-primary: var(--color-primary); - --color-chat-complementary: var(--color-complementary); - --color-chat-secondary: var(--color-secondary); - --color-chat-complementary-darken: var(--color-complementary-darken); - --color-chat-grey-1: var(--color-grey-4); - --color-chat-grey-2: var(--color-grey-6); - --color-chat-grey-3: var(--color-grey-10); - - /* Directory */ - --color-directory-grey-4: #7A7F85 !important; - --color-directory-grey-5: #F0F3F6 !important; - - --color-directory-avatar-background: #E4E8ED !important; - --color-directory-back-link: #36383B !important; - --color-directory-border: #DAE2F3 !important; - --color-directory-content-header-border: #DAE2F3 !important; - --color-directory-h1: var(--color-complementary-darken); - --color-directory-list-icon: var(--color-primary); - --color-directory-text: var(--color-directory-grey-4); - - --color-directory-send-border: var(--color-complementary) !important; - --color-directory-list-icon: var(--color-primary) !important; - --color-directory-counter-background: var(--color-directory-grey-5) !important; - --color-directory-counter-border: #9BA0A7 !important; - --color-directory-counter-text: #4A4A4A !important; - - --color-directory-paginate: #36383B !important; - --color-directory-paginate-disabled: #9BA0A7 !important; - - --color-directory-form-input: #EDF1FA !important; - --color-directory-form-input-text: var(--color-directory-grey-4) !important; - --color-directory-form-input-active: var(--color-complementary) !important; - --color-directory-form-select-icon: var(--color-complementary) !important; -} - -/* Text color for the beta label */ - -#header>div.header-left>span.beta-tag { - color: var(--color-complementary); -} - -/* Button to edit a channel or a project (in project-profile) */ -#project solid-link[next="project-edit"], -#circle solid-link[next="circle-edit"] { - background: var(--color-complementary); - border: 1px solid var(--color-complementary); -} - -#project solid-link[next="project-edit"]:hover, -#circle solid-link[next="circle-edit"]:hover { - background: var(--color-white); - border: 1px solid var(--color-complementary); - color: var(--color-complementary); -} - -/* Button to delete a channel */ -/* box-button is depreciated */ -#circle-profile>div>div.desktop-button__end>solid-ac-checker>solid-delete, -#circle-profile>div>div.box-button>solid-ac-checker>solid-delete { - background: var(--color-white); - border: 1px solid var(--color-complementary); - color: var(--color-complementary); -} - -#circle-profile>div>div.desktop-button__end>solid-ac-checker>solid-delete>button, -#circle-profile>div>div.box-button>solid-ac-checker>solid-delete>button { - color: var(--color-complementary); -} - -#circle-profile>div>div.desktop-button__end>solid-ac-checker>solid-delete:hover, -#circle-profile>div>div.box-button>solid-ac-checker>solid-delete:hover { - background: var(--color-complementary); - border: 1px solid var(--color-complementary); - color: var(--color-white); -} - -#circle-profile>div>div.desktop-button__end>solid-ac-checker>solid-delete:hover>button, -#circle-profile>div>div.box-button>solid-ac-checker>solid-delete:hover>button { - color: var(--color-white); -} - -/* Button with a pen to edit a user */ -#admin-users-list>div>div.table>solid-display>div>solid-display>div>solid-action-hd-custom>solid-ac-checker>solid-link { - background: var(--color-complementary); - border: 1px solid var(--color-complementary); - color: var(--color-white); -} - -#admin-users-list>div>div.table>solid-display>div>solid-display>div>solid-action-hd-custom>solid-ac-checker>solid-link:hover { - background: var(--color-white); - border: 1px solid var(--color-complementary); - color: var(--color-complementary); -} - -/* Button to join a channel */ -#admin-circle-list>div>div.table>solid-display:nth-child(5)>div>solid-display>div>admin-circle-join-button>solid-form { - background: var(--color-complementary); - border: 1px solid var(--color-complementary); - color: var(--color-white); -} - -#admin-circle-list>div>div.table>solid-display:nth-child(5)>div>solid-display>div>admin-circle-join-button>solid-form:hover { - background: var(--color-white); - border: 1px solid var(--color-complementary); - color: var(--color-complementary); -} - -#admin-circle-list>div>div.table>solid-display:nth-child(5)>div>solid-display>div>admin-circle-join-button>solid-form:hover input { - color: var(--color-complementary); -} - - -/* Directory - my profile*/ - -/* Colors for buttons to send a message to a member and to update or remove your profile picture */ -#member-profile>div.profile-card>div.user-profile>div>solid-display>div>solid-action.button.button-primary.bordered, -button#solid-picture-browse.button.button-primary, -button#solid-picture-remove.button.button-primary { - border: 1px solid var(--color-directory-complementary) !important; -} - -#member-profile solid-action.button.button-primary>solid-link, -button#solid-picture-browse.button.button-primary, -button#solid-picture-remove.button.button-primary { - color: var(--color-directory-complementary) !important; -} - -#member-profile>div.profile-card>div.user-profile>div>solid-display>div>solid-action.button.button-primary.bordered>solid-link::before { - background-color: var(--color-directory-complementary) !important; -} - -/* Hover */ -#member-profile solid-action.button.button-primary:hover, -#member-profile solid-action.button.button-primary:hover>solid-link, -button#solid-picture-browse.button.button-primary:hover, -button#solid-picture-remove.button.button-primary:hover { - color: var(--color-directory-white) !important; - background-color: var(--color-directory-complementary) !important; -} - -#member-profile>div.profile-card>div.user-profile>div>solid-display>div>solid-action.button.button-primary.bordered:hover>solid-link::before { - background-color: var(--color-directory-white) !important; -} - -#members-list .send-display solid-link::before { - background-color: var(--color-directory-complementary)!important; -} - -/* Dashboard */ -.dashboard-card>div>div>p { - color: var(--color-complementary) !important; -} - -.dashboard-card .svg-color-secondary { - fill: var(--color-complementary) !important; -} - -.dashboard-card i { - border-color: var(--color-primary) !important; - color: var(--color-complementary) !important; -} - -.dashboard-card sib-link, .dashboard-card solid-link { - border-color: var(--color-complementary) !important; - color: var(--color-complementary) !important; -} - -.dashboard-card sib-link:hover, .dashboard-card solid-link:hover { - background-color: var(--color-complementary) !important; - color: #fff !important; -} diff --git a/client.sample.etuc.scss b/client.sample.etuc.scss deleted file mode 100644 index f4a3ed7..0000000 --- a/client.sample.etuc.scss +++ /dev/null @@ -1,180 +0,0 @@ -:root { - --color-primary: #063B5C; - --color-secondary: #3A3A3A; - --color-complementary: #C4262E; - --color-complementary-darken: #36383B; - --color-white: #FFFFFF; - - --color-black-h: 216; - --color-black-s: 4%; - --color-black-l: 22%; - - --color-main-background: var(--color-grey-13); - --color-main-text: #7A7F85; - --color-highlight-primary: var(--color-primary); - --color-user-panel: var(--color-black); - --color-bell: var(--color-secondary); - --color-avatar-background: #E4E8ED; - --color-title: #36383B; - --color-h1: var(--color-title); - --color-h2: var(--color-title); - - /* Depreciated */ - --color-tag-group-text: #9BA0A7; - --color-tag-group-border: var(--color-primary); - --color-label-dark: var(--color-grey-6); - - /* Header's elements */ - --color-header-background: var(--color-white); - --color-bell: var(--color-complementary-darken); - --color-user-panel-header-text: var(--color-complementary-darken); - --color-user-panel-header-background: var(--color-white); - --color-user-panel-header-text-open: var(--color-white); - --color-user-panel-header-background-open: var(--color-secondary); - --color-user-panel-list-background: var(--color-white); - --color-user-panel-list-text-hover: var(--color-complementary); - --color-user-panel-list-border: #E4E8ED; - - /* Left menu */ - --color-menu-highlight-primary:var(--color-white); - --color-menu-background: var(--color-secondary); - --color-menu-text: var(--color-white); - --color-menu-text-active: var(--color-complementary); - --color-menu-background-active: var(--color-menu-highlight-primary); - --color-menu-badge-background: var(--color-menu-highlight-primary); - --color-menu-badge-text-active: var(--color-menu-highlight-primary); - --color-menu-badge-background-active: var(--color-secondary); - --color-menu-icon-background-active: var(--color-secondary); - - /* Right menu */ - --color-right-menu-background: #e8e8e8; - --color-right-menu-text: #3c3F57; - --color-right-menu-link-border: #BDC2D7; - --color-right-menu-active-text: var(--color-white); - --color-right-menu-active-background: var(--color-complementary); - --color-right-menu-active-icon: var(--color-primary); - - /* Scrollbar */ - --color-scrollbar-right-background: var(--color-white); - --color-scrollbar-right-track: var(--color-grey-6); - --color-scrollbar-left-background: var(--color-secondary); - --color-scrollbar-left-track: var(--color-grey-11); - - /* Tags */ - --color-tag-admin-text: var(--color-complementary); - --color-tag-admin-border: var(--color-complementary); - - /* Form elements */ - --color-button-white: var(--color-white); - --color-button-primary: var(--color-primary); - --color-button-secondary: var(--color-complementary); - --color-button-complementary: var(--color-secondary); - - --color-input-background: #EDF1FA; - --color-input-text: var(--color-secondary); - --color-input-icon: var(--color-complementary); - --color-input-active: var(--color-complementary); - --color-fieldset: var(--color-title); - --color-fieldset-border: #DAE2F3; - --color-button-modal: var(--color-title); - --color-select-list: var(--color-secondary); - --color-select-add-button: var(--color-button-secondary); - --color-select-add-button-background: var(--color-button-white); - - --color-label-light: var(--color-grey-6); - - /* Skill */ - --color-skill-background: var(--color-primary); - --color-skill-text: var(--color-white); - - /* Icon */ - --color-icon: var(--color-primary); - - /* Table */ - --color-table-header-background: #BDC2D7; - --color-table-header-text: var(--color-white); - --color-table-border: #BDC2D7; - - /* User thumb */ - --color-user-thumb-name: #7A7F85; - - --color-backlink: var(--color-secondary); - --color-content-header: #DAE2F3; - - /* Chat */ - --color-chat-white: var(--color-white); - --color-chat-primary: var(--color-primary); - --color-chat-complementary: var(--color-complementary); - --color-chat-secondary: var(--color-secondary); - --color-chat-complementary-darken: var(--color-complementary-darken); - --color-chat-grey-1: var(--color-grey-4); - --color-chat-grey-2: var(--color-grey-6); - --color-chat-grey-3: var(--color-grey-10); - - /* Directory */ - --color-directory-grey-4: #7A7F85; - --color-directory-grey-5: #F0F3F6; - - --color-directory-avatar-background: #E4E8ED; - --color-directory-back-link: #36383B; - --color-directory-border: #DAE2F3; - --color-directory-content-header-border: #DAE2F3; - --color-directory-h1: var(--color-complementary-darken); - --color-directory-list-icon: var(--color-primary); - --color-directory-text: var(--color-directory-grey-4); - - --color-directory-form-input: #EDF1FA; - --color-directory-form-input-text: var(--color-directory-grey-4); - --color-directory-form-input-active: var(--color-complementary); - --color-directory-form-select-icon: var(--color-complementary); -} - -#main__menu { - font-family: "RefrigeratorDelxW01Bold"; -} -#main__menu .menu { - font-size: 1.8rem; -} -#main__menu .unread { - font-weight: bold; -} -#main__menu .menu[active=""] { - color: var(--color-complementary); -} -#main__menu .sub-menu.menu-notification { - font-family: Facit; -} -#main__menu solid-router sib-route.menu, #main__menu sib-router sib-route.menu { - padding: 1.2rem 0; -} -#viewport .content-box { - font-family: Facit; -} -#viewport #circle .content-box__header solid-display div { - text-align: center; -} -#viewport #circle .content-box__header .h1-like { - font-family: "RefrigeratorDelxW01Bold"; - font-size: 3.2rem; - color: var(--color-primary); -} -#viewport #circle .content-box__header solid-display div .h1-aside { - - margin: 10px 0; -} -#viewport .with-sidebar nav > solid-router { - color: #3C3F57; -} -#viewport .with-sidebar nav > solid-router > ul > sib-route[active] { - background-color: var(--color-right-menu-active-background); - color: var(--color-right-menu-active-text); - display: inline-block; -} -@media (min-width: 992px) { - .content-box__height { - min-height: calc(100vh - 83px - 98px); - } - #viewport .chat-view { - height: calc(100vh - 84px - 98px); - } -} \ No newline at end of file