diff --git a/assets/less/site/collections/form.overrides b/assets/less/site/collections/form.overrides new file mode 100644 index 0000000..e2b0f48 --- /dev/null +++ b/assets/less/site/collections/form.overrides @@ -0,0 +1,5 @@ +.ui.form { + input { + border-radius: 0; + } +} diff --git a/assets/less/site/collections/grid.overrides b/assets/less/site/collections/grid.overrides new file mode 100644 index 0000000..9c36283 --- /dev/null +++ b/assets/less/site/collections/grid.overrides @@ -0,0 +1,4 @@ +.invenio-administration.ui.grid > .side-bar.column { + background-color: @lavender; + border-right: 2px solid @primaryColor; +} diff --git a/assets/less/site/collections/menu.overrides b/assets/less/site/collections/menu.overrides new file mode 100644 index 0000000..05a26b7 --- /dev/null +++ b/assets/less/site/collections/menu.overrides @@ -0,0 +1,129 @@ +/*********************************************** + Invenio App RDM Menu Overrides +***********************************************/ + +#invenio-nav.ui.menu { + margin-top: 2rem; + .ui.menu { + background-color: transparent; + box-shadow: none; + .item { + text-decoration: underline; + text-decoration-color: @primaryColor; + a:not(.ui.button) { + display: inline-block; + color: @primaryColor; + padding: 2rem 1rem; + text-decoration: underline; + text-decoration-color: @primaryColor; + &:hover { + color: @black; + text-decoration: underline; + text-decoration-color: @black; + } + } + a:not(.ui.button):has(.icon) { + text-decoration: none; + &:hover { + text-decoration: none; + } + } + } + &.transition.visible { + a.item { + text-decoration: none; + &:hover { + text-decoration: none; + } + } + } + } +} + +#rdm-burger-toggle { + font-size: 20px; + position: absolute; + right: -1.5rem; + top: calc(50%); + border: none; + + #rdm-burger-menu-icon { + .navicon { + background: @primaryColor; + color: @primaryColor; + &:hover { + color: @black; + } + } + } +} + +.ui.secondary.pointing.menu .item { + padding: @itemVerticalPadding @itemHorizontalPadding; + &.active { + border-color: @primaryColor; + font-weight: @fontSemibold; + } + &:hover { + border-color: @black; + } +} + +.ui.menu { + box-shadow: none; +} + +.ui.vertical.menu { + .ui.header.item { + font-weight: @fontSemibold; + } + a.item { + i { + text-decoration: none !important; + } + color: @darkTextColor; + font-weight: @fontRegular; + text-decoration: none; + } +} + +.invenio-administration .side-menu-toggle { + color: @primaryColor; +} + +#invenio-admin-home-nav { + box-shadow: none; + background: @lavender; + border-right: 2px @primaryColor solid; +} + +.invenio-administration #invenio-admin-top-nav.ui.menu { + background: @white; +} + +.ui.dropdown .menu.visible.transition { + min-width: min-content; + .item:not(.disabled) { + width: 100%; + text-decoration: none; + &:hover, &:focus { + background-color: @whiteSmoke; + } + } + .item.disabled:not(.active) { + background-color: transparent; + color: @slateGray; + &:hover, &:focus { + i { + text-decoration: none !important; + } + color: @slateGray; + background-color: transparent; + font-weight: @fontRegular; + text-decoration: none; + } + } + .item:not(.active) { + background-color: @whiteSmoke; + } +} diff --git a/assets/less/site/collections/message.variables b/assets/less/site/collections/message.variables new file mode 100644 index 0000000..16700bf --- /dev/null +++ b/assets/less/site/collections/message.variables @@ -0,0 +1,26 @@ +.ui.message { + background-color: @white; + color: @black; + margin-bottom: .5rem; + &.positive { + background-color: @greenBackground; + border: 1px solid @green; + .header { + color: @green; + } + } + &.warning { + border: 1px solid @darkOrange; + background: @orangeBackground; + .header { + color: @brown; + } + } + &.negative { + background-color: @redBackground; + border: 1px solid red; + .header { + color: @red; + } + } +} diff --git a/assets/less/site/collections/table.overrides b/assets/less/site/collections/table.overrides new file mode 100644 index 0000000..77da059 --- /dev/null +++ b/assets/less/site/collections/table.overrides @@ -0,0 +1,7 @@ +.ui.table thead th { + background-color: @lavender; +} + +.ui.table tbody tr td.collapsing > .ui.buttons { + flex-wrap: wrap; +} diff --git a/assets/less/site/collections/table.variables b/assets/less/site/collections/table.variables new file mode 100644 index 0000000..562f0d9 --- /dev/null +++ b/assets/less/site/collections/table.variables @@ -0,0 +1 @@ +@headerBackground: @lavender; diff --git a/assets/less/site/elements/button.overrides b/assets/less/site/elements/button.overrides new file mode 100644 index 0000000..db43740 --- /dev/null +++ b/assets/less/site/elements/button.overrides @@ -0,0 +1,127 @@ +.ui.button, +.ui.basic.buttons .button, +.ui.basic.button { + background-color: @defaultButtonBackgroundColor; + &:not(.search), + &:not(#skip-to-main){ + border-style: solid !important; + border-width: 1px !important; + } + border-color: @defaultButtonBorderColor; + color: @defaultButtonTextColor; + &:hover { + background: @black; + color: @white; + } +} + +.ui.button.primary:not(.disabled), +.ui.button.positive:not(.disabled) { + background-color: @primaryButtonBackgroundColor; + border-color: @primaryButtonBorderColor; + color: @primaryButtonTextColor !important; + &:hover, + &:active, + &:focus { + background-color: @primaryButtonBackgroundColorHovered; + border-color: @primaryButtonBorderColorHovered; + color: @primaryButtonTextColorHovered !important; + } +} + +.ui.button.disabled { + background-color: @disabledButtonBackgroundColor; + border-color: @disabledButtonBorderColor; + color: @disabledButtonTextColor !important; + &:hover, + &:active, + &:focus { + background-color: @disabledButtonBackgroundColor; + border-color: @disabledButtonBorderColor; + color: @disabledButtonTextColor !important; + } +} + +div.ui.card.access-right .ui.two.buttons .ui.active.button.positive { + background-color: @green; + border-color: @green; + color: @white; +} + +.ui.button.secondary { + background-color: @primaryButtonBackgroundColor; + border-color: @defaultButtonBorderColor; + color: @primaryButtonTextColor; + &:hover, + &:active, + &:focus { + background-color: @primaryButtonBackgroundColorHovered; + border-color: @defaultButtonBorderColorHovered; + color: @primaryButtonTextColorHovered; + } +} + +.ui.button.negative, +.ui.button.red { + background-color: @negativeButtonBackgroundColor; + border-color: @negativeButtonBorderColor; + color: @negativeButtonTextColor; + &:hover, + &:active, + &:focus { + background-color: @negativeButtonBackgroundColorHovered; + border-color: @negativeButtonBorderColorHovered; + color: @negativeButtonTextColorHovered; + } +} + +#skip-to-main { + position: absolute; + top: 0px; + left: 0px; + color: @black; + background: @whiteSmoke; + border: none; + font-weight: 400; + text-decoration: underline; + text-decoration-thickness: 1px; + transform: translateY(-100%); + transition: transform 0.25s ease-out; + z-index: 100; + + &:focus { + position: absolute; + left: 0px; + transform: none; + background: @whiteSmoke; + outline: 0; + } +} + +.ui.button.search { + border: none; + &:hover { + i.icon.search { + color: @white; + } + } +} + +.ui.basic.buttons { + .ui.button:not(.active), + .ui.basic.button:not(.active){ + background-color: @white !important; + box-shadow: none !important; + border: 1px solid rgba(34, 36, 38, 0.15) !important; + color: @black !important; + &:hover { + background: @whiteSmoke !important; } + } + .active.button, + .ui.button.active, + .ui.basic.button.active { + background-color: @black !important; + border: 1px @black !important; + color: @white !important; + } +} diff --git a/assets/less/site/elements/button.variables b/assets/less/site/elements/button.variables new file mode 100644 index 0000000..2653820 --- /dev/null +++ b/assets/less/site/elements/button.variables @@ -0,0 +1,55 @@ +@searchButtonColor: @whiteSmoke; +@searchButtonColorHover: @black; + +@fontWeight: @fontRegular; + +/*------------------------------- +default button +--------------------------------*/ + +@defaultButtonBackgroundColor: @white; +@defaultButtonBorderColor: @black; +@defaultButtonTextColor: @black; +@defaultButtonBackgroundColorHovered: @black; +@defaultButtonBorderColorHovered: @black; +@defaultButtonTextColorHovered: @whiteSmoke; + +/*------------------------------ +primary button +--------------------------------*/ +@primaryButtonBackgroundColor: @primaryColor; +@primaryButtonBorderColor: @primaryColor; +@primaryButtonTextColor: @white; +@primaryButtonBackgroundColorHovered: @black; +@primaryButtonBorderColorHovered: @black; +@primaryButtonTextColorHovered: @white; + +/*------------------------------- +secondary button +--------------------------------*/ + +@secondaryButtonBackgroundColor: @white; +@secondaryButtonBorderColor: @primaryColor; +@secondaryButtonTextColor: @primaryColor; +@secondaryButtonBackgroundColorHovered: @primaryColor; +@secondaryButtonBorderColorHovered: @primaryColor; +@secondaryButtonTextColorHovered: @white; + +/*------------------------------- +negative button +--------------------------------*/ + +@negativeButtonBackgroundColor: @white; +@negativeButtonBorderColor: @red; +@negativeButtonTextColor: @red; +@negativeButtonBackgroundColorHovered: @red; +@negativeButtonBorderColorHovered: @red; +@negativeButtonTextColorHovered: @white; + +/*------------------------------- +disabled button +--------------------------------*/ + +@disabledButtonBackgroundColor: @whiteSmoke; +@disabledButtonBorderColor: @darkGray; +@disabledButtonTextColor: @darkGray; diff --git a/assets/less/site/elements/container.overrides b/assets/less/site/elements/container.overrides new file mode 100644 index 0000000..3ac3459 --- /dev/null +++ b/assets/less/site/elements/container.overrides @@ -0,0 +1,12 @@ +.ui.container.frontpage-header { + background-color: @frontpageSearchBarBackgroundColor !important; +} + +.ui.container.page-subheader { + padding-inline: @itemVerticalPadding @itemHorizontalPadding; + display: flex; + align-items: center; + &-outer { + background-color: @subheaderColor; + } +} diff --git a/assets/less/site/elements/header.overrides b/assets/less/site/elements/header.overrides new file mode 100644 index 0000000..0c9b51d --- /dev/null +++ b/assets/less/site/elements/header.overrides @@ -0,0 +1,53 @@ +/*********************************************** + Invenio App RDM Header Overrides +***********************************************/ + + h1, + h1.ui.header, + .ui.huge.header { + font-size: fontSizeHeadline; + } + + h2, + h2.ui.header, + .ui.large.header { + font-size: @fontSizeSubheadline; + + &:not(:first-child) { + margin-top: 2.5rem; + } + } + + h3, + h3.ui.header, + .ui.medium.header { + font-size: @fontSizeBodyHeader; + } + + h4, + h4.ui.header, + .ui.small.header { + font-size: @fontSizeBase; + } + +aside.sidebar { + h3.hidden { + display: none; + } +} + +.ui.header { + word-break: break-word; + + &.text-muted { + color: @mutedTextColor; + } + + .doi.sub.header { + display: inline-block; + } + + &.highlight{ + background-color: @highlightBackgroundColor; + } +} diff --git a/assets/less/site/elements/icon.overrides b/assets/less/site/elements/icon.overrides new file mode 100644 index 0000000..e69de29 diff --git a/assets/less/site/elements/input.overrides b/assets/less/site/elements/input.overrides new file mode 100644 index 0000000..3d7538a --- /dev/null +++ b/assets/less/site/elements/input.overrides @@ -0,0 +1,37 @@ +.ui.input, +.ui.input > input { + background-color: @inputColor; + border-radius: 0 !important; + border: 1px solid @whiteSmoke; + i.icon.search { + color: @primaryColor; + } + &:focus, + &:focus-visible, + &:focus-within, + &:hover, + &:active { + outline: @deepSkyBlue; + outline-width: 3px; + outline-offset: 3px; + } +} + +div.ui.search .ui.input input { + background-color: @whiteSmoke; + border: 1px solid @whiteSmoke; + button.ui.button.search { + border-color: @whiteSmoke; + } +} + +.ui.action.input:not(.frontpage-header--search) { + &:focus, + &:focus-visible, + &:focus-within, + &:hover, + &:active { + outline: 3px solid #c71585; + outline-offset: 3px; + } +} diff --git a/assets/less/site/elements/label.variables b/assets/less/site/elements/label.variables new file mode 100644 index 0000000..7b0d73a --- /dev/null +++ b/assets/less/site/elements/label.variables @@ -0,0 +1,48 @@ +/*********************************************** + Invenio Theme Label Variables +***********************************************/ + + +/*--- Primary ---*/ + +@primaryLabelColor: @primaryColor; +@primaryBorderLabelColor: @primaryColor; +@primaryTextLabelColor: @invertedTextColor; + + +/*--- Neutral ---*/ + +@neutralLabelColor: @neutralColor; +@neutralBorderLabelColor: @neutralColor; +@neutralTextLabelColor: @invertedTextColor; + +/*--- Positive ---*/ + +@positiveLabelColor: @positiveColor; +@positiveBorderLabelColor: @positiveColor; +@positiveTextLabelColor: @invertedTextColor; + + +/*--- Warning ---*/ + +@warningLabelColor: @warningColor; +@warningBorderLabelColor: @warningColor; +@warningTextLabelColor: @invertedTextColor; + + +/*--- Expired ---*/ + +@expiredLabelColor: @orange; +@expiredBorderLabelColor: @orange; +@expiredTextLabelColor: @orangeTextColor; + + +/*--- Negative ---*/ + +@negativeLabelColor: @negativeColor; +@negativeBorderLabelColor: @negativeColor; +@negativeTextLabelColor: @invertedTextColor; + +/*--- ------------ ---*/ +@borderRadius: @defaultBorderRadius; +@fontWeight: @fontRegular; diff --git a/assets/less/site/elements/segment.overrides b/assets/less/site/elements/segment.overrides new file mode 100644 index 0000000..5dcfea0 --- /dev/null +++ b/assets/less/site/elements/segment.overrides @@ -0,0 +1,3 @@ +.ui.segment.file-upload-area { + background-color: @whiteSmoke; +} diff --git a/assets/less/site/elements/segment.variables b/assets/less/site/elements/segment.variables new file mode 100644 index 0000000..720afe7 --- /dev/null +++ b/assets/less/site/elements/segment.variables @@ -0,0 +1,2 @@ +@background: @white; +@placeholderBackground: @whiteSmoke; diff --git a/assets/less/site/fonts/ImperialSansDisplay-Bold.ttf b/assets/less/site/fonts/ImperialSansDisplay-Bold.ttf new file mode 100644 index 0000000..414aee4 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Bold.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Extrabold.ttf b/assets/less/site/fonts/ImperialSansDisplay-Extrabold.ttf new file mode 100644 index 0000000..a9a2c2b Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Extrabold.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Extralight.ttf b/assets/less/site/fonts/ImperialSansDisplay-Extralight.ttf new file mode 100644 index 0000000..fffbeef Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Extralight.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Light.ttf b/assets/less/site/fonts/ImperialSansDisplay-Light.ttf new file mode 100644 index 0000000..ce5cb3e Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Light.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Medium.ttf b/assets/less/site/fonts/ImperialSansDisplay-Medium.ttf new file mode 100644 index 0000000..beaba78 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Medium.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Regular.ttf b/assets/less/site/fonts/ImperialSansDisplay-Regular.ttf new file mode 100644 index 0000000..2d7778c Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Regular.ttf differ diff --git a/assets/less/site/fonts/ImperialSansDisplay-Semibold.ttf b/assets/less/site/fonts/ImperialSansDisplay-Semibold.ttf new file mode 100644 index 0000000..2453deb Binary files /dev/null and b/assets/less/site/fonts/ImperialSansDisplay-Semibold.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Bold.ttf b/assets/less/site/fonts/ImperialSansText-Bold.ttf new file mode 100644 index 0000000..8550c63 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Bold.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Extrabold.ttf b/assets/less/site/fonts/ImperialSansText-Extrabold.ttf new file mode 100644 index 0000000..13a457f Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Extrabold.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Extralight.ttf b/assets/less/site/fonts/ImperialSansText-Extralight.ttf new file mode 100644 index 0000000..d2975b3 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Extralight.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Light.ttf b/assets/less/site/fonts/ImperialSansText-Light.ttf new file mode 100644 index 0000000..f0dc6d4 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Light.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Medium.ttf b/assets/less/site/fonts/ImperialSansText-Medium.ttf new file mode 100644 index 0000000..c67ca1a Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Medium.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Regular.ttf b/assets/less/site/fonts/ImperialSansText-Regular.ttf new file mode 100644 index 0000000..2bd2889 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Regular.ttf differ diff --git a/assets/less/site/fonts/ImperialSansText-Semibold.ttf b/assets/less/site/fonts/ImperialSansText-Semibold.ttf new file mode 100644 index 0000000..9a08037 Binary files /dev/null and b/assets/less/site/fonts/ImperialSansText-Semibold.ttf differ diff --git a/assets/less/site/globals/site.overrides b/assets/less/site/globals/site.overrides index e69de29..45da2b5 100644 --- a/assets/less/site/globals/site.overrides +++ b/assets/less/site/globals/site.overrides @@ -0,0 +1,343 @@ +/*------------------- + Fonts definitions +--------------------*/ + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 400; + src: url("../fonts/ImperialSansDisplay-Regular.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 300; + src: url("../fonts/ImperialSansDisplay-Light.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 600; + src: url("../fonts/ImperialSansDisplay-Semibold.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 500; + src: url("../fonts/ImperialSansDisplay-Medium.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 200; + src: url("../fonts/ImperialSansDisplay-Extralight.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 700; + src: url("../fonts/ImperialSansDisplay-Bold.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansDisplay"; + font-style: normal; + font-weight: 800; + src: url("../fonts/ImperialSansDisplay-Extrabold.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 400; + src: url("../fonts/ImperialSansText-Regular.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 300; + src: url("../fonts/ImperialSansText-Light.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 600; + src: url("../fonts/ImperialSansText-Semibold.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 500; + src: url("../fonts/ImperialSansText-Medium.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 200; + src: url("../fonts/ImperialSansText-Extralight.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 700; + src: url("../fonts/ImperialSansText-Bold.ttf") format("truetype"); +} + +@font-face { + font-family: "ImperialSansText"; + font-style: normal; + font-weight: 800; + src: url("../fonts/ImperialSansText-Extrabold.ttf") format("truetype"); +} + +html { + font-family: @ImperialSansText; + font-weight: @fontRegular; + font-size: @fontSizeBase; + line-height: 1; +} + +h1 { + font-family: @ImperialSansDisplay; + font-weight: @fontSemibold; + font-size: @fontSizeHeadline; + line-height: 1; +} + +h2 { + font-family: @ImperialSansDisplay; + font-weight: @fontSemibold; + font-size: @fontSizeSubheadline; + line-height: 1; +} + +h3 { + font-family: @ImperialSansDisplay; + font-weight: @fontSemibold; + font-size: @fontSizeBodyHeader; + line-height: 1.2; +} + +p { + font-family: @ImperialSansText; + font-weight: @fontRegular; + font-size: @fontSizeBody; + line-height: 1.2; +} + +a { + font-family: @ImperialSansText; + font-weight: @fontRegular; + font-size: @fontSizeBody; + line-height: 1.2; + color: @primaryColor; + text-decoration: underline; +} + +.small { + font-family: @ImperialSansText; + font-size: @fontSizeCaption; + line-height: 1.25; +} + +html.cover-page { + background-color: @white; +} + +.outer-navbar { + background-image: None; + background-color: transparent; + border-color: transparent; + + #invenio-nav { + background: @white; + border-top: 2px solid @brandColor; + border-bottom: 2px solid @brandColor; + margin: 1rem 0; + } + + a { + color: @primaryColor; + } + + #rdm-burger-menu-icon { + @headerOverlayOpenColor: @primaryColor; + + .header__inner--inverse & { + @headerOverlayOpenColor: @white; + } + background-color: transparent !important; + border: none !important; + color: none; + + span { + top: 1px; + + &::before { + top: clamp(0.4375rem, 0.4016rem + 0.1795vw, 0.5625rem); // 7px -> 9px + transition: transform 0.2s; + } + + &::after { + top: clamp(0.875rem, 0.8032rem + 0.3591vw, 1.125rem); // 14px -> 18px + transition: none; + } + } + + span, + span::before, + span::after { + background-color: var(@headerOverlayOpenColor); + } + + &:hover { + background-color: transparent !important; + border: none !important; + transform: rotate(90deg); + span::before { + width: clamp(0.875rem, 0.8032rem + 0.3591vw, 1.125rem); // 14px -> 18px + } + } + } +} + +.theme.header { + box-shadow: None; +} + +#rdm-footer-element { + color: @footerTextLightColor; + font-weight: 500; + margin-top: auto; + font-size: @fontSizeBase; + padding-top: 0; + + a { + color: @footerTextLightColor; + + &:hover, &:focus { + color: @footerTextDarkColor; + } + } + + p { + margin-bottom: 0; + } +} + +.footer-top { + background-color: @footerDarkColor; + padding: 2rem; + height: 100%; + .row { + margin: 0 !important; + padding: 0! important; + } + .app-rdm-footer { + color: @footerTextLightColor; + margin-top: auto; + font-size: @fontSizeBase; + font-weight: @fontMedium; + padding-top: 0; + height: 100%; + + .footer__common { + border-top: 2px solid @white; + border-bottom: 2px solid @white; + margin-top: 0.5rem; + height: 100%; + + .row { + height: 100% !important; + .footer__contact { + display: flex; + flex-direction: column; + justify-content: space-around; + height: 100%; + padding-block: 2rem; + padding-inline-end: 1.75rem; + border-right: 2px solid @white; + + .footer__brand { + flex: 1; + svg { + height: 100%; + max-height: 1.75rem; + max-width: 100%; + width: auto; + } + } + .address { + flex: 2; + } + } + .footer__info { + display: flex; + flex-direction: column; + justify-content: space-between; + height: 100%; + padding-block: 2rem; + .footer__copyright { + display: flex; + align-items: flex-end; + opacity: .5; + } + a { + color: @footerTextLightColor; + text-decoration: underline; + text-decoration-color: @springGreen; + text-decoration-thickness: 1px; + + &:hover, &:focus { + color: @footerTextDarkColor; + text-decoration: underline; + text-decoration-color: @white; + text-decoration-thickness: 2px; + } + } + p { + margin-bottom: 0; + align-self: flex-end; + } + } + } + } + } +} + +a.with-arrow { + display: inline-flex; + align-items: center; + text-decoration: none; + color: @primaryColor; + svg { + fill: @primaryColor; + width: 1rem; + height: 1rem; + margin-right: .5rem; + } + &:hover { + color: @black; + svg { + fill: @black; + } + } +} + +::placeholder { + color: @darkGray; + opacity: .5; +} +::-ms-input-placeholder { /* Edge 12 -18 */ + color: @darkGray; +} diff --git a/assets/less/site/globals/site.variables b/assets/less/site/globals/site.variables index 86be537..b68e85f 100644 --- a/assets/less/site/globals/site.variables +++ b/assets/less/site/globals/site.variables @@ -1,12 +1,129 @@ -@primaryColor: #003E74; -@secondaryColor: #002147; -@navbarBackgroundColor: @primaryColor; -@navbarBackgroundImage: false; -@primaryDarkenColor: #373A36; +/*********************************************** + Invenio App RDM Site Variables +***********************************************/ +/*------------------- + Site Colors +--------------------*/ +@imperialBlue: #0000cd; +@black: #161a1d; +@white: #ffffff; -@footerLightColor: @primaryColor; -@footerDarkColor: @secondaryColor; +@slateGray: #708090; +@darkGray: @slateGray; +@green: #006400; +@red: #ff0000; +@yellow: #ffff00; +@teal: #008080; +@orange: #ffa500; +@darkOrange: #ff8c00; +@deepSkyBlue: #00bfff; +@navyBlue: #000080; +@whiteSmoke: #f5f5f5; +@lavender: #e6e6fa; +@springGreen: #00ff7f; +@brown: #8b4513; +@lightCyan: #dff8f8; + +@orangeBackground: rgba(255,140,0,0.05); +@redBackground: rgba(255,0,0,0.05); +@greenBackground: rgba(0,255,0,0.05); + +/*------------------- + Brand Colors +--------------------*/ + +@brandColor: @imperialBlue; +@primaryColor: @imperialBlue; +@secondaryColor: @orange; + +@featuredListBackgroundColor: @imperialBlue; +@primaryDarkenColor: @navyBlue; + +@signupColor: @green; + +@accessRightOpen: @green; +@accessRightRestricted: @red; +@accessRightEmbargoed: @yellow; +@accessRightMetadataOnly: @teal; + +/*-OLD------------------ +@restricted-components-background-color_old: #feeaea; +@restricted-components-border-color_old: #e0b4b4; +@embargoed-components-background-color_old: #fbf8ee; +@embargoed-components-border-color_old: #c9ba9b; +--------------------*/ + +@footerDarkColor: @black; @subFooterColor: @footerDarkColor; -@footerTextLightColor: #ffffff; -@footerTextDarkColor: #ffffff; +@footerTextLightColor: @white; + +@darkTextColor: @black; +@invertedTextColor: @white; +@errorTextColor: @red; + +@highlightHeaderColor: @lavender; +@highlightBackgroundColor: @highlightHeaderColor; +@highlightBackgroundColorHover: darken(saturate(@highlightHeaderColor, 20), 15, relative); +@highlightLandingPageBackgroundColor: @lavender; +@selectedColor: @lavender; +@subheaderColor: @lightCyan; + +@navbarBackgroundColor: @white; +@navbarBackgroundImage: none; +@frontpageSearchBarBackgroundColor: @navyBlue; +@versionActiveColor: @lavender; + +@inputColor: @white; +@inputBorderColor: @whiteSmoke; + +@mutedAccordionHeaderColor: @whiteSmoke; +@defaultBrandColor: @imperialBlue; + +@itemVerticalPadding: 1rem; +@itemHorizontalPadding: 1rem; + + +/*------------------- + Links +--------------------*/ + +@linkColor: @primaryColor; +@linkUnderline: none; +@linkHoverColor: darken(saturate(@linkColor, 20), 15, relative); +@linkHoverUnderline: underline; + +/*------------------- + Fonts +--------------------*/ + +@fontName: "ImperialSansText", Arial, sans-serif; +@ImperialSansText: @fontName; +@ImperialSansDisplay: "ImperialSansDisplay", Arial, sans-serif; + +@fontExtralight: 200; +@fontLight: 300; +@fontRegular: 400; +@fontMedium: 500; +@fontSemibold: 600; +@fontBold: 700; +@fontExtrabold: 800; + +/*--- 1rem ---*/ +@fontSizeBase: 16px; + +@fontSizeHeadline: 5rem; +@fontSizeSubheadline: 2rem; +@fontSizeItemHeadline: 1.25rem; +@fontSizeBodyHeader: 1rem; +@fontSizeBody: 1rem; +@fontSizeCaption: .5rem; + +@font-size-small: @fontSizeCaption; +@font-size-tiny: @fontSizeCaption; + +@defaultBorderRadius: 0; + +@adminSideNavColor: @whiteSmoke; + +@darkBrandCover: @navyBlue; diff --git a/assets/less/site/modules/accordion.overrides b/assets/less/site/modules/accordion.overrides new file mode 100644 index 0000000..1774404 --- /dev/null +++ b/assets/less/site/modules/accordion.overrides @@ -0,0 +1,6 @@ +.ui.accordion.invenio-accordion-field .title:not(.ui), +.ui.accordion.invenio-accordion-field.error.secondary.inverted .title { + background-color: @lavender; + color: black; + font-weight: bold; +} diff --git a/assets/less/site/modules/dropdown.overrides b/assets/less/site/modules/dropdown.overrides new file mode 100644 index 0000000..0687504 --- /dev/null +++ b/assets/less/site/modules/dropdown.overrides @@ -0,0 +1,3 @@ +.ui.dropdown .menu .selected.item { + font-weight: @fontMedium; +} diff --git a/assets/less/site/modules/modal.overrides b/assets/less/site/modules/modal.overrides new file mode 100644 index 0000000..0b9c956 --- /dev/null +++ b/assets/less/site/modules/modal.overrides @@ -0,0 +1,5 @@ +.ui.modal { + .header { + background-color: @lavender; + } +} diff --git a/assets/less/site/views/card.overrides b/assets/less/site/views/card.overrides new file mode 100644 index 0000000..f60eae9 --- /dev/null +++ b/assets/less/site/views/card.overrides @@ -0,0 +1,28 @@ +.ui.card.borderless.facet { + padding: 1rem; +} + +.ui.card.borderless.facet > .content h2.header:not(.ui) { + font-size: @fontSizeItemHeadline; + line-height: 1.2; + font-weight: @fontSemibold; + font-family: @ImperialSansDisplay; + text-decoration: none; +} + +.ui.card:not(:has(.facet-container)):has(a) { + background-color: @lightCyan; + .content > h2.header { + color: @black; + } + a { + color: @navyBlue; + text-decoration: none; + &:hover { + color: @black; + text-decoration: underline; + text-decoration-color: @springGreen; + text-decoration-thickness: 2px; + } + } +} diff --git a/assets/less/site/views/item.overrides b/assets/less/site/views/item.overrides new file mode 100644 index 0000000..deafa49 --- /dev/null +++ b/assets/less/site/views/item.overrides @@ -0,0 +1,27 @@ +.ui.items > .item > .content > .header { + background-color: inherit; + font-weight: @fontRegular; + a { + font-size: @fontSizeItemHeadline; + line-height: 1.2; + font-weight: @fontMedium; + font-family: @ImperialSansDisplay; + text-decoration: none; + } + &:hover { + a { + color: @black; + text-decoration: underline; + } + } +} + +a.creatibutor-link { + text-decoration: none; + &:hover { + span { + color: @black; + text-decoration: none; + } + } +} diff --git a/assets/less/site/views/item.variables b/assets/less/site/views/item.variables new file mode 100644 index 0000000..e69de29 diff --git a/site/ic_data_repo/config/settings.py b/site/ic_data_repo/config/settings.py index 70265ae..6e3d1c9 100644 --- a/site/ic_data_repo/config/settings.py +++ b/site/ic_data_repo/config/settings.py @@ -73,7 +73,8 @@ # Frontpage title THEME_FRONTPAGE_TITLE = "Imperial Fair Data Repository" # Header logo -THEME_LOGO = "images/imperial_logo_white.svg" +THEME_LOGO = "images/imperial_logo_blue.svg" +INVERTED_THEME_LOGO = "images/imperial_white_blue.svg" # Invenio-App-RDM diff --git a/static/icons/arrow-right.svg b/static/icons/arrow-right.svg new file mode 100644 index 0000000..a8c6955 --- /dev/null +++ b/static/icons/arrow-right.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/static/icons/icon-search-blue.svg b/static/icons/icon-search-blue.svg new file mode 100644 index 0000000..02b3bb2 --- /dev/null +++ b/static/icons/icon-search-blue.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/icons/icon-search-white.svg b/static/icons/icon-search-white.svg new file mode 100644 index 0000000..b8a02fc --- /dev/null +++ b/static/icons/icon-search-white.svg @@ -0,0 +1,4 @@ + + + + diff --git a/static/images/imperial_logo_black.svg b/static/images/imperial_logo_black.svg index 521de94..302d973 100644 --- a/static/images/imperial_logo_black.svg +++ b/static/images/imperial_logo_black.svg @@ -1,48 +1,27 @@ - + - - - - - - - - - - - - - - - - - - - - - + viewBox="0 0 1548 170" style="enable-background:new 0 0 1548 170;" xml:space="preserve"> + + + + + + + + + + + + + + diff --git a/static/images/imperial_logo_blue.svg b/static/images/imperial_logo_blue.svg index a2c5b02..e092528 100644 --- a/static/images/imperial_logo_blue.svg +++ b/static/images/imperial_logo_blue.svg @@ -1,56 +1,30 @@ - + + viewBox="0 0 1548 170" style="enable-background:new 0 0 1548 170;" xml:space="preserve"> - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + diff --git a/static/images/imperial_logo_white.svg b/static/images/imperial_logo_white.svg index 9292751..d0bd159 100644 --- a/static/images/imperial_logo_white.svg +++ b/static/images/imperial_logo_white.svg @@ -1,57 +1,30 @@ - + + viewBox="0 0 1548 170" style="enable-background:new 0 0 1548 170;" xml:space="preserve"> - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + diff --git a/templates/semantic-ui/invenio_accounts/send_confirmation.html b/templates/semantic-ui/invenio_accounts/send_confirmation.html new file mode 100644 index 0000000..55c7486 --- /dev/null +++ b/templates/semantic-ui/invenio_accounts/send_confirmation.html @@ -0,0 +1,39 @@ +{# -*- coding: utf-8 -*- + + This file is part of Invenio. + Copyright (C) 2015-2020 CERN. + + Invenio is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} +{%- extends config.ACCOUNTS_COVER_TEMPLATE %} + +{% from "invenio_accounts/_macros.html" import render_field, form_errors %} + +{% block page_body %} + +
+
+ + {%- block form_header %} +

{{ _('Resend confirmation email') }}

+ {%- endblock form_header %} + + {%- block form_outer %} + {%- with form = send_confirmation_form %} +
+ {{ form.hidden_tag() }} + {{ render_field(form.email, icon="icon user", autofocus=True, errormsg='email' in form.errors) }} + +
+ {%- endwith %} + {%- endblock form_outer %} + +
+ +
+ +{% endblock page_body %} diff --git a/templates/semantic-ui/invenio_administration/base.html b/templates/semantic-ui/invenio_administration/base.html new file mode 100644 index 0000000..700585c --- /dev/null +++ b/templates/semantic-ui/invenio_administration/base.html @@ -0,0 +1,62 @@ +{# +Copyright (C) 2020 CERN. + +Invenio App RDM is free software; you can redistribute it and/or modify it +under the terms of the MIT License; see LICENSE file for more details. +#} + + +{%- extends config.ADMINISTRATION_THEME_BASE_TEMPLATE %} + +{% block bypasslinks %} +{% endblock %} + +{% block body_inner %} +
+ +
+ {% block admin_topnav %} + {% include "invenio_administration/header/header.html" %} + {% endblock admin_topnav %} +
+ + {% block admin_side_column %} + {% block admin_sidenav %} + + + + {% endblock admin_sidenav %} + {% endblock %} + + {% block admin_main_column %} +
+ +
+ {% block page_title %} + {% if title or name %} +

{{ title or name }}

+ + {% endif %} + {% endblock page_title %} + + {% block admin_page_content %} + + {% endblock admin_page_content %} + +
+
+ {% endblock %} + +
+{% block javascript %} +{{ super() }} +{{ webpack['base-admin-theme.js'] }} +{% endblock %} + +{% endblock %} diff --git a/templates/semantic-ui/invenio_administration/header/header.html b/templates/semantic-ui/invenio_administration/header/header.html new file mode 100644 index 0000000..173b42f --- /dev/null +++ b/templates/semantic-ui/invenio_administration/header/header.html @@ -0,0 +1,82 @@ +{# + -*- coding: utf-8 -*- + Copyright (C) 2022 CERN. + + Invenio App RDM is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + +{% set menu = current_menu.submenu('admin_navigation').children %} +{% set active_item_name = namespace(value=None) %} + +
+ {%- block navbar %} +
+ + + +
+ +
+ +
+ {%- endblock navbar %} +
diff --git a/templates/semantic-ui/invenio_administration/header/header_login.html b/templates/semantic-ui/invenio_administration/header/header_login.html new file mode 100644 index 0000000..321b860 --- /dev/null +++ b/templates/semantic-ui/invenio_administration/header/header_login.html @@ -0,0 +1,109 @@ +{# -*- coding: utf-8 -*- + + This file is part of Invenio. + Copyright (C) 2015-2021 CERN. + + Invenio is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + + +{%- if config.ACCOUNTS %} + {%- if not current_user.is_authenticated %} +
+ + + {{ _('Log in') }} + {% if security.registerable %} + + + {{ _('Sign up') }} + + {% endif %} +
+ {%- else %} + + {%- if config.USERPROFILES %} + + +
+

{{ _("My account") }}

+ + {%- for item in current_menu.submenu('settings').children if item.visible %} + + {{ item.text|safe }} + + {%- endfor %} + +
+ + {% set ns = namespace(admin_menu=False) %} + {%- for item in current_menu.submenu('profile-admin').children if item.visible %} + {% set ns.admin_menu = True %} + + {{ item.text|safe }} + + {%- endfor %} + {% if ns.admin_menu %} + + {% endif %} + + + + {{ _('Log out') }} + +
+ + {%- else %} + + + {{ _('Log out') }} + + {%- endif %} + {%- endif %} +{%- endif %} diff --git a/templates/semantic-ui/invenio_administration/header/side_bar_toggle.html b/templates/semantic-ui/invenio_administration/header/side_bar_toggle.html new file mode 100644 index 0000000..edad584 --- /dev/null +++ b/templates/semantic-ui/invenio_administration/header/side_bar_toggle.html @@ -0,0 +1,4 @@ + diff --git a/templates/semantic-ui/invenio_app_rdm/footer.html b/templates/semantic-ui/invenio_app_rdm/footer.html new file mode 100644 index 0000000..041e149 --- /dev/null +++ b/templates/semantic-ui/invenio_app_rdm/footer.html @@ -0,0 +1,66 @@ +{# + +Copyright (C) 2019-2020 CERN. +Copyright (C) 2019-2020 Northwestern University. +Copyright (C) 2021 Graz University of Technology. + +Invenio App RDM is free software; you can redistribute it and/or modify it +under the terms of the MIT License; see LICENSE file for more details. +#} +{%- block footer_top %} + +
+
+
+
+
+
+ + Imperial College London + + + + + + + + + + + +
+

Address

+

+ Imperial College London
+ South Kensington Campus
+ London + SW7 2AZ, UK
+ tel: +44 (0)20 7589 5111 +

+
+
+
+
+
+ +

© 2024 Imperial College London

+
+
+
+
+
+
+{%- endblock footer_top %} diff --git a/templates/semantic-ui/invenio_app_rdm/header.html b/templates/semantic-ui/invenio_app_rdm/header.html new file mode 100644 index 0000000..a5bb6eb --- /dev/null +++ b/templates/semantic-ui/invenio_app_rdm/header.html @@ -0,0 +1,145 @@ +{# + -*- coding: utf-8 -*- + Copyright (C) 2019-2020 CERN. + Copyright (C) 2019-2020 Northwestern University. + Copyright (C) 2021 New York University. + + Invenio App RDM is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + +
+
+ {%- block user_impersonation %} + {%- if '_impersonator_id' in session %} +
+
+
+ Impersonated session +
+ You must logout after you finish with you inquiry! +
+
+ {%- endif %} + {%- endblock user_impersonation %} + +
+ {%- block navbar %} +
+ + {%- endblock navbar %} +
+ + {%- block site_banner %} + {% from 'invenio_banners/banner.html' import banner %} + {{ banner() }} + {%- endblock site_banner %} + + {%- block flashmessages %} + {%- from "invenio_theme/macros/messages.html" import flashed_messages with context -%} + {{ flashed_messages() }} + {%- endblock %} +
+ + {%- block breadcrumbs %} + {%- endblock breadcrumbs %} +
diff --git a/templates/semantic-ui/invenio_app_rdm/header_frontpage.html b/templates/semantic-ui/invenio_app_rdm/header_frontpage.html new file mode 100644 index 0000000..4d808e1 --- /dev/null +++ b/templates/semantic-ui/invenio_app_rdm/header_frontpage.html @@ -0,0 +1,50 @@ +{# -*- coding: utf-8 -*- + Copyright (C) 2020 CERN. + Copyright (C) 2020 Northwestern University. + Copyright (C) 2021 New York University. + + Invenio App RDM is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + +{%- extends config.THEME_HEADER_TEMPLATE %} + +{#- Remove search field from top bar on frontpage #} +{%- block navbar_search %}{% endblock %} + +{%- block navbar %} +{{ super() }} + +{%- block frontpage_search %} + +{%- endblock frontpage_search %} + +{% endblock %} diff --git a/templates/semantic-ui/invenio_app_rdm/header_login.html b/templates/semantic-ui/invenio_app_rdm/header_login.html new file mode 100644 index 0000000..ea49387 --- /dev/null +++ b/templates/semantic-ui/invenio_app_rdm/header_login.html @@ -0,0 +1,157 @@ +{# -*- coding: utf-8 -*- + + This file is part of Invenio. + Copyright (C) 2015-2021 CERN. + + Invenio is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + + +{%- if config.ACCOUNTS %} + {%- if not current_user.is_authenticated %} +
+ + + {{ _('Log in') }} + {% if security.registerable %} + + + {{ _('Sign up') }} + + {% endif %} +
+ {%- else %} + + {# Desktop Quick-create ("plus") menu #} + {%- set plus_menu_items = current_menu.submenu('plus').children %} + {%- if plus_menu_items %} + + + {# Mobile/Tablet Quick create ("plus") menu #} +
+

{{ _("Actions") }}

+
+ {%- for item in plus_menu_items if item.visible %} + + + {{ item.text|safe }} + + {%- endfor %} +
+
+ {% endif %} + + {# Desktop Account dropdown menu #} + {%- if config.USERPROFILES %} + + + {# Mobile/Tablet Account menu #} +
+

{{ _("My account") }}

+ +
+ {%- for item in current_menu.submenu('settings').children if item.visible %} + + {{ item.text|safe }} + + {%- endfor %} + +
+ + {% set ns = namespace(admin_menu=False) %} + {%- for item in current_menu.submenu('profile-admin').children if item.visible %} + {% set ns.admin_menu = True %} + + {{ item.text|safe }} + + {%- endfor %} + + {% if ns.admin_menu %} +
+ {% endif %} + + + + {{ _('Log out') }} + +
+
+ + {%- else %} + + + {{ _('Log out') }} + + {%- endif %} + {%- endif %} +{%- endif %} diff --git a/templates/semantic-ui/invenio_app_rdm/page.html b/templates/semantic-ui/invenio_app_rdm/page.html new file mode 100644 index 0000000..ff3b627 --- /dev/null +++ b/templates/semantic-ui/invenio_app_rdm/page.html @@ -0,0 +1,36 @@ +{# -*- coding: utf-8 -*- + + This file is part of Invenio. + Copyright (C) 2015-2024 CERN. + Copyright (C) 2021 New York University. + + Invenio is free software; you can redistribute it and/or modify it + under the terms of the MIT License; see LICENSE file for more details. +#} + +{%- extends "invenio_theme/page.html" -%} + +{%- block body_inner %} + + {%- block page_header %} + {% include config.THEME_HEADER_TEMPLATE %} + {%- endblock page_header %} + +
+
+ {%- block page_body %} + {% include "invenio_theme/body.html" %} + {%- endblock page_body %} +
+
+ + {%- block page_footer %} + + {%- endblock page_footer %} + +{%- endblock body_inner %} diff --git a/templates/semantic-ui/invenio_communities/frontpage.html b/templates/semantic-ui/invenio_communities/frontpage.html new file mode 100644 index 0000000..1182bf2 --- /dev/null +++ b/templates/semantic-ui/invenio_communities/frontpage.html @@ -0,0 +1,128 @@ +{# -*- coding: utf-8 -*- + +This file is part of Invenio. +Copyright (C) 2016-2020 CERN. +Copyright (C) 2023 Northwestern University. + +Invenio is free software; you can redistribute it and/or modify it +under the terms of the MIT License; see LICENSE file for more details. +#} + +{% extends "invenio_communities/base.html" %} + +{%- set title = _("Communities") -%} + +{%- block javascript %} +{{ super() }} +{{ webpack['invenio-communities-frontpage.js'] }} +{%- endblock %} + +{%- block page_body %} +
+
+
+

+ {{_('Communities')}} +

+
+
+
+

+ {{_('Organize, curate and collaborate on records for your institution, project, topic or event.')}} +

+
+
+
+
+
+
+ + +
+
+
+ {% if permissions.can_create %} +
+ + + {{_('New community')}} + +
+ {% endif %} +
+ +
+
+
+ {% if current_user.is_authenticated %} +
+

{{_('My communities')}}

+ + + + + + + + + + + + + {{ _('See all')}} + +
+ +
+ {% endif %} +
+
+

{{ _('New communities') }}

+ + + + + + + + + + + + + {{ _('See all')}} + +
+ +
+
+{%- endblock page_body %}