Browse Source

added vars

master
rdrew 8 months ago
parent
commit
d85d6fbe2b
  1. 103
      css/base.css
  2. 11
      css/block.css
  3. 26
      css/components.css
  4. 88
      css/fonts.css
  5. 118
      css/header.css
  6. 23
      css/sidebar.css
  7. 78
      css/site-variables.css
  8. 1
      vre2024.libraries.yml

103
css/base.css

@ -37,18 +37,18 @@ body {
body { body {
color: var(--color-text); color: var(--color-text);
background-color: var(--body-bg-color); background-color: var(--body-bg-color);
font-family: font-family: var(--body-font);
system-ui, /*system-ui,*/
-apple-system, /*-apple-system,*/
BlinkMacSystemFont, /*BlinkMacSystemFont,*/
'Segoe UI', /*'Segoe UI',*/
Roboto, /*Roboto,*/
Oxygen, /*Oxygen,*/
Ubuntu, /*Ubuntu,*/
Cantarell, /*Cantarell,*/
'Open Sans', /*'Open Sans',*/
'Helvetica Neue', /*'Helvetica Neue',*/
sans-serif; /*sans-serif;*/
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
min-height: 100vh; min-height: 100vh;
@ -99,6 +99,7 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: var(--heading-font);
color: var(--color-heading); color: var(--color-heading);
font-weight: 700; font-weight: 700;
font-style: normal; font-style: normal;
@ -295,27 +296,29 @@ select {
} }
.button, .button,
button, button,
[type='button'], [type="button"],
[type='reset'], [type="reset"],
[type='submit'] { [type="submit"] {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
border: 0; border: 0;
padding: 8px 10px; padding: 8px 10px;
line-height: 1.6; line-height: 1.6;
-webkit-appearance: button; -webkit-appearance: button;
background: var(--upei-green);
color: #fff;
} }
button::-moz-focus-inner, button::-moz-focus-inner,
[type='button']::-moz-focus-inner, [type="button"]::-moz-focus-inner,
[type='reset']::-moz-focus-inner, [type="reset"]::-moz-focus-inner,
[type='submit']::-moz-focus-inner { [type="submit"]::-moz-focus-inner {
border-style: none; border-style: none;
padding: 0; padding: 0;
} }
button:-moz-focusring, button:-moz-focusring,
[type='button']:-moz-focusring, [type="button"]:-moz-focusring,
[type='reset']:-moz-focusring, [type="reset"]:-moz-focusring,
[type='submit']:-moz-focusring { [type="submit"]:-moz-focusring {
outline: 0; outline: 0;
} }
button[disabled], button[disabled],
@ -340,19 +343,19 @@ input,
textarea { textarea {
max-width: 100%; max-width: 100%;
} }
input[type='text'], input[type="text"],
input[type='email'], input[type="email"],
input[type='url'], input[type="url"],
input[type='password'], input[type="password"],
input[type='search'], input[type="search"],
textarea { textarea {
padding: 10px; padding: 10px;
} }
input[type='text']:focus, input[type="text"]:focus,
input[type='email']:focus, input[type="email"]:focus,
input[type='url']:focus, input[type="url"]:focus,
input[type='password']:focus, input[type="password"]:focus,
input[type='search']:focus, input[type="search"]:focus,
textarea:focus { textarea:focus {
outline: 0; outline: 0;
} }
@ -360,28 +363,28 @@ textarea {
width: 100%; width: 100%;
overflow: auto; overflow: auto;
} }
[type='checkbox'], [type="checkbox"],
[type='radio'] { [type="radio"] {
padding: 0; padding: 0;
cursor: pointer; cursor: pointer;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
[type='number']::-webkit-inner-spin-button, [type="number"]::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button { [type="number"]::-webkit-outer-spin-button {
height: auto; height: auto;
} }
[type='search'] { [type="search"] {
-webkit-appearance: textfield; -webkit-appearance: textfield;
outline-offset: -2px; outline-offset: -2px;
-webkit-appearance: textfield; -webkit-appearance: textfield;
-moz-appearance: textfield; -moz-appearance: textfield;
} }
[type='search']::-webkit-search-decoration { [type="search"]::-webkit-search-decoration {
-webkit-appearance: none; -webkit-appearance: none;
} }
[type='file'] { [type="file"] {
cursor: pointer; cursor: pointer;
} }
fieldset { fieldset {
@ -414,7 +417,7 @@ label[for] {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.form-required:after { .form-required:after {
content: '*'; content: "*";
display: inline-block; display: inline-block;
padding-left: 4px; padding-left: 4px;
color: red; color: red;
@ -439,11 +442,11 @@ label.option {
:-ms-input-placeholder { :-ms-input-placeholder {
color: var(--border); color: var(--border);
} }
.field--name-body input[type='text'], .field--name-body input[type="text"],
.field--name-body input[type='email'], .field--name-body input[type="email"],
.field--name-body input[type='url'], .field--name-body input[type="url"],
.field--name-body input[type='password'], .field--name-body input[type="password"],
.field--name-body input[type='search'], .field--name-body input[type="search"],
.field--name-body textarea { .field--name-body textarea {
display: block; display: block;
margin-bottom: 0.8rem; margin-bottom: 0.8rem;
@ -489,8 +492,8 @@ ol {
margin: 0; margin: 0;
padding: 0 0 0.25rem 1rem; padding: 0 0 0.25rem 1rem;
} }
[dir='rtl'] ul, [dir="rtl"] ul,
[dir='rtl'] ol { [dir="rtl"] ol {
padding: 0 1rem 0.25rem 0; padding: 0 1rem 0.25rem 0;
} }
ol ol, ol ol,
@ -498,8 +501,8 @@ ul ul {
margin: 0; margin: 0;
padding: 0 0 0.25rem 1rem; padding: 0 0 0.25rem 1rem;
} }
[dir='rtl'] ol ol, [dir="rtl"] ol ol,
[dir='rtl'] ul ul { [dir="rtl"] ul ul {
padding: 0 1rem 0.25rem 0; padding: 0 1rem 0.25rem 0;
} }
ul { ul {
@ -509,8 +512,8 @@ li > ul,
li > ol { li > ol {
margin-bottom: 0; margin-bottom: 0;
} }
[dir='rtl'] ul, [dir="rtl"] ul,
[dir='rtl'] ol { [dir="rtl"] ol {
padding: 0 1rem 0.25rem 0; padding: 0 1rem 0.25rem 0;
} }
li { li {

11
css/block.css

@ -4,3 +4,14 @@
.block-content { .block-content {
position: relative; position: relative;
} }
.block-title {
/*font-size: var(--sidebar-block-title-font-size);*/
/*font-family: var(--sidebar-block-title-font-family);*/
/*color: var(--sidebar-block-title-font-color);*/
}
.block-content {
/*font-size: var(--sidebar-block-font-size);*/
/*font-family: var(--sidebar-block-font-family);*/
/*color: var(--sidebar-block-font-color);*/
}

26
css/components.css

@ -1,4 +1,3 @@
/* Admin Toolbar */ /* Admin Toolbar */
button.toolbar-item, button.toolbar-item,
button.toolbar-icon { button.toolbar-icon {
@ -54,11 +53,11 @@ button.toolbar-icon {
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-flex-pack: center; -ms-flex-pack: center;
justify-content: center; justify-content: center;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
line-height: 0; line-height: 0;
} }
@ -80,6 +79,12 @@ ul.page-tabs {
} }
.page-tabs li a { .page-tabs li a {
font-family: var(--tabs-font);
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:
"wdth" 75;
background-color: var(--page-tab-bg-color); background-color: var(--page-tab-bg-color);
color: var(--page-tab-text-color); color: var(--page-tab-text-color);
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
@ -103,7 +108,8 @@ ul.page-tabs {
flex: 1 1 auto; flex: 1 1 auto;
} }
/* Entity reference */ /* Entity reference */
.node-taxonomy-container, .node-links-container { .node-taxonomy-container,
.node-links-container {
position: relative; position: relative;
display: block; display: block;
width: 100%; width: 100%;
@ -207,11 +213,11 @@ ul.inline li a {
text-align: center; text-align: center;
padding: 4px; padding: 4px;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-flex-pack: center; -ms-flex-pack: center;
justify-content: center; justify-content: center;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
} }
.scrolltop:hover { .scrolltop:hover {
background: var(--secondary); background: var(--secondary);

88
css/fonts.css

@ -0,0 +1,88 @@
/*@format*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wdth,wght@0,62.5..100,100..900;1,62.5..100,100..900&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
.roboto-condensed-normal {
font-family: 'Roboto Condensed', sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.roboto-condensed-thin {
font-family: 'Roboto Condensed', sans-serif;
font-optical-sizing: auto;
font-weight: 200;
font-style: normal;
}
.roboto-thin {
font-family: 'Roboto', sans-serif;
font-weight: 100;
font-style: normal;
}
.roboto-light {
font-family: 'Roboto', sans-serif;
font-weight: 300;
font-style: normal;
}
.roboto-regular {
font-family: 'Roboto', sans-serif;
font-weight: 400;
font-style: normal;
}
.roboto-medium {
font-family: 'Roboto', sans-serif;
font-weight: 500;
font-style: normal;
}
.roboto-bold {
font-family: 'Roboto', sans-serif;
font-weight: 700;
font-style: normal;
}
.roboto-black {
font-family: 'Roboto', sans-serif;
font-weight: 900;
font-style: normal;
}
.roboto-thin-italic {
font-family: 'Roboto', sans-serif;
font-weight: 100;
font-style: italic;
}
.roboto-light-italic {
font-family: 'Roboto', sans-serif;
font-weight: 300;
font-style: italic;
}
.roboto-regular-italic {
font-family: 'Roboto', sans-serif;
font-weight: 400;
font-style: italic;
}
.roboto-medium-italic {
font-family: 'Roboto', sans-serif;
font-weight: 500;
font-style: italic;
}
.roboto-bold-italic {
font-family: 'Roboto', sans-serif;
font-weight: 700;
font-style: italic;
}
.roboto-black-italic {
font-family: 'Roboto', sans-serif;
font-weight: 900;
font-style: italic;
}

118
css/header.css

@ -7,7 +7,17 @@
position: relative; position: relative;
width: 100%; width: 100%;
margin: 0; margin: 0;
padding: 0.5rem 0; padding: 0.5rem 0;
}
.header-top,
.header-top a {
font-weight: 300;
font-variation-settings: "wdth" 75;
background: var(--header-top-bg-color);
color: var(--header-top-text-color);
font-size: .8rem;
}
.header {
background: var(--header-bg-color); background: var(--header-bg-color);
color: var(--header-text-color); color: var(--header-text-color);
} }
@ -18,16 +28,16 @@
display: flex; display: flex;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
-webkit-box-pack: justify; -webkit-box-pack: justify;
-ms-flex-pack: justify; -ms-flex-pack: justify;
justify-content: space-between; justify-content: space-between;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
flex-wrap: wrap; flex-wrap: wrap;
} }
.region-header-top-left, .region-header-top-left,
.region-header-top-right { .region-header-top-right {
@ -63,11 +73,11 @@
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-pack: justify; -webkit-box-pack: justify;
-ms-flex-pack: justify; -ms-flex-pack: justify;
justify-content: space-between; justify-content: space-between;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
} }
/* Header -> Site branding */ /* Header -> Site branding */
@ -77,13 +87,15 @@
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
padding-right: 1rem; padding-right: 1rem;
} }
.site-logo { .site-logo {
padding-right: 5px; padding-right: var(--branding-separator-padding);
margin-right: var(--branding-separator-padding);
width: var(--logo-width); width: var(--logo-width);
border-right: var(--branding-separator);
} }
.site-logo img { .site-logo img {
display: block; display: block;
@ -94,18 +106,24 @@
display: flex; display: flex;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-flex-pack: center; -ms-flex-pack: center;
justify-content: center; justify-content: center;
} }
.site-name, .site-name,
.site-slogan { .site-slogan {
line-height: 1.1; line-height: 1.1;
} }
.site-slogan {
font-family: var(--site-slogan-font-family);
font-size: var(--site-slogan-font-size);
color: var(--site-slogan-font-color);
}
.site-name { .site-name {
a { a {
font-family: var(--heading-font);
font-size: var(--site-name-font-size); font-size: var(--site-name-font-size);
color: var(--site-name-font-color); color: var(--site-name-font-color);
} }
@ -118,8 +136,8 @@
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
gap: 0.5rem; gap: 0.5rem;
} }
.menu-wrap { .menu-wrap {
@ -135,8 +153,8 @@
box-shadow: none; box-shadow: none;
z-index: 25; z-index: 25;
-webkit-transform: translateX(-100%); -webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%); -ms-transform: translateX(-100%);
transform: translateX(-100%); transform: translateX(-100%);
-webkit-transition: all 0.4s linear; -webkit-transition: all 0.4s linear;
-o-transition: all 0.4s linear; -o-transition: all 0.4s linear;
transition: all 0.4s linear; transition: all 0.4s linear;
@ -163,6 +181,7 @@
display: block; display: block;
color: #ffffff; color: #ffffff;
padding: 0.5rem 0; padding: 0.5rem 0;
font-variation-settings: "wdth" var(--header-menu-font-width);
} }
.menu-wrap .menu > li a::after { .menu-wrap .menu > li a::after {
content: none; content: none;
@ -204,8 +223,8 @@
display: flex; display: flex;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
width: 36px; width: 36px;
height: 28px; height: 28px;
@ -248,13 +267,13 @@
.active-menu .menu-wrap { .active-menu .menu-wrap {
overflow-y: scroll; overflow-y: scroll;
-webkit-transform: translateX(0); -webkit-transform: translateX(0);
-ms-transform: translateX(0); -ms-transform: translateX(0);
transform: translateX(0); transform: translateX(0);
-webkit-transition: all 0.4s linear; -webkit-transition: all 0.4s linear;
-o-transition: all 0.4s linear; -o-transition: all 0.4s linear;
transition: all 0.4s linear; transition: all 0.4s linear;
padding: 1rem; padding: 1rem;
box-shadow: 6px 0 1rem #111111; box-shadow: 6px 0 1rem #111111;
} }
.active-menu .menu { .active-menu .menu {
display: block; display: block;
@ -263,24 +282,24 @@
@-webkit-keyframes slideUp { @-webkit-keyframes slideUp {
0% { 0% {
-webkit-transform: translateY(20px); -webkit-transform: translateY(20px);
transform: translateY(20px); transform: translateY(20px);
opacity: 0; opacity: 0;
} }
100% { 100% {
-webkit-transform: translateY(0px); -webkit-transform: translateY(0px);
transform: translateY(0px); transform: translateY(0px);
opacity: 1; opacity: 1;
} }
} }
@keyframes slideUp { @keyframes slideUp {
0% { 0% {
-webkit-transform: translateY(20px); -webkit-transform: translateY(20px);
transform: translateY(20px); transform: translateY(20px);
opacity: 0; opacity: 0;
} }
100% { 100% {
-webkit-transform: translateY(0px); -webkit-transform: translateY(0px);
transform: translateY(0px); transform: translateY(0px);
opacity: 1; opacity: 1;
} }
} }
@ -296,11 +315,11 @@
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-flex-pack: center; -ms-flex-pack: center;
justify-content: center; justify-content: center;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
width: 34px; width: 34px;
height: 34px; height: 34px;
@ -310,6 +329,7 @@
font-size: 24px; font-size: 24px;
} }
.search-box { .search-box {
box-shadow: -1px 0 3px 1px rgba(0, 0, 0, 0.3333);
position: fixed; position: fixed;
background-color: var(--light); background-color: var(--light);
top: 0; top: 0;
@ -318,18 +338,20 @@
width: 100%; width: 100%;
z-index: 50; z-index: 50;
-webkit-transform: translate(0, -100%); -webkit-transform: translate(0, -100%);
-ms-transform: translate(0, -100%); -ms-transform: translate(0, -100%);
transform: translate(0, -100%); transform: translate(0, -100%);
-webkit-transition: -webkit-transform 0.5s; -webkit-transition: -webkit-transform 0.5s;
transition: -webkit-transform 0.5s; transition: -webkit-transform 0.5s;
-o-transition: transform 0.5s; -o-transition: transform 0.5s;
transition: transform 0.5s; transition: transform 0.5s;
transition: transform 0.5s, -webkit-transform 0.5s; transition:
transform 0.5s,
-webkit-transform 0.5s;
} }
.search-box.open { .search-box.open {
-webkit-transform: translate(0, 0); -webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0); -ms-transform: translate(0, 0);
transform: translate(0, 0); transform: translate(0, 0);
} }
.search-box-content { .search-box-content {
position: relative; position: relative;
@ -350,11 +372,11 @@
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-flex-pack: center; -ms-flex-pack: center;
justify-content: center; justify-content: center;
-webkit-box-align: center; -webkit-box-align: center;
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
color: var(--dark); color: var(--dark);
border: 3px solid var(--dark); border: 3px solid var(--dark);
border-radius: 50%; border-radius: 50%;
@ -403,8 +425,8 @@
display: flex; display: flex;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
} }
/* Header -> Page Header-> breadcrumb */ /* Header -> Page Header-> breadcrumb */
.breadcrumb { .breadcrumb {

23
css/sidebar.css

@ -11,8 +11,27 @@
gap: 2rem; gap: 2rem;
} }
.sidebar .block { .sidebar .block {
background-color: var(--light); background-color: var(--sidebar-block-background);
padding: 1rem; padding: 1rem;
border: var(--sidebar-block-border);
}
.sidebar .block-title {
background: var(--sidebar-block-title-background);
font-size: var(--sidebar-block-title-font-size);
font-family: var(--sidebar-block-title-font-family);
color: var(--sidebar-block-title-font-color);
}
.sidebar .block-content {
font-variation-settings: "wdth" 75;
font-size: var(--sidebar-block-font-size);
font-family: var(--sidebar-block-font-family);
color: var(--sidebar-block-font-color);
}
.sidebar .block a {
color: var(--sidebar-block-link-color);
}
.sidebar .block a:hover {
color: var(--sidebar-block-link-color-hover);
} }
.sidebar ul, .sidebar ul,
.sidebar ol { .sidebar ol {
@ -25,7 +44,7 @@
} }
.sidebar li { .sidebar li {
padding: 6px 0; padding: 6px 0;
border-bottom: 1px solid var(--border); border-bottom: var(--sidebar-ul-separator-line);
} }
.sidebar .block p:last-of-type { .sidebar .block p:last-of-type {
margin: 0; margin: 0;

78
css/site-variables.css

@ -4,6 +4,10 @@
/* Variables /* Variables
---------------------------------------- */ ---------------------------------------- */
:root { :root {
/*
*colors
*/
--upei-red: #8c2004; --upei-red: #8c2004;
--upei-green: #5c8727; --upei-green: #5c8727;
--upei-yellow: #fbb040; --upei-yellow: #fbb040;
@ -11,35 +15,83 @@
--primary: #365ab5; --primary: #365ab5;
--primary: var(--upei-red); --primary: var(--upei-red);
--secondary: #d05700; --secondary: #d05700;
--dark: #232742; --dark: #333;
--light: #ccc; --light: #eee;
--border: #a8a6a6; --border: #a8a6a6;
--color-text: #444444; --color-text: #444444;
--color-heading: #111111; --color-heading: #333;
--body-bg-color: #fff;
--font-family-serif: 'Noto Serif', sans-serif;
--font-family-sans-serif: 'Noto Sans', sans-serif;
/*
*body
*/
--body-bg-color: #fff;
--page-container-width: 1440px;
--body-font: var(--font-family-sans-serif);
--heading-font: var(--font-family-serif);
/*
*branding
*/
/*--header-bg-color: #333;*/
--header-top-bg-color: var(--dark);
--header-top-text-color: #fff;
--header-bg-color: none;
--header-text-color: var(--color-text);
--logo-width: 160px;
--site-name-font-family: var(--font-family-serif);
--site-name-font-size: 2em;
--site-name-font-color: var(--header-text-color);
--site-slogan-font-family: var(--font-family-sans-serif);
--site-slogan-font-size: inherit;
--site-slogan-font-color: var(--header-text-color);
--branding-separator: 2px solid #333;
--branding-separator-padding: .5rem;
--header-menu-font-width: 75 /*65-100*/;
/*
*tabs
*/
--tabs-font: var(--font-family-sans-serif);
--page-tab-bg-color: var(--light); --page-tab-bg-color: var(--light);
--page-tab-text-color: #333; --page-tab-text-color: #333;
--page-tab-text-color-active: var(--primary); --page-tab-text-color-active: var(--primary);
--page-tab-border-color: var(--border); --page-tab-border-color: var(--border);
/*
*search button
*/
--search-button-color: var(--upei-green);
--search-button-text-color: #fff;
/*
*headings
*/
--h1-size: 2.2rem; --h1-size: 2.2rem;
--h2-size: 1.9rem; --h2-size: 1.9rem;
--h3-size: 1.6rem; --h3-size: 1.6rem;
--h4-size: 1.3rem; --h4-size: 1.3rem;
--h5-size: 1.1rem; --h5-size: 1.1rem;
--h6-size: 1.1rem; --h6-size: 1.1rem;
/*
*block styles
*/
--sidebar-block-title-font-size: var(--h3-size);
--sidebar-block-title-font-family: var(--font-family-serif);
--sidebar-block-title-font-color: var(--color-text);
--sidebar-block-title-background: inherit;
--sidebar-block-background: var(--light);
--sidebar-block-font-size: inherit;
--sidebar-block-font-family: var(--font-family-sans-serif);
--sidebar-block-font-color: var(--color-text);
--sidebar-block-border: 1px solid var(--light);
--sidebar-block-link-color: var(--color-text);
--sidebar-block-link-color-hover: var(--primary);
--sidebar-ul-separator-line: 2px solid var(--primary);
--page-container-width: 1440px;
--header-bg-color: #333;
--header-text-color: #fff;
--logo-width: 100px;
--site-name-font-size: 2em;
--site-name-font-color: var(--header-text-color);
/*footer*/ /*
*footer
*/
--footer-bg-color: #ccc; --footer-bg-color: #ccc;
--footer-text-color: initial; --footer-text-color: initial;
--footer-link-color: var(--upei-red); --footer-link-color: var(--upei-red);

1
vre2024.libraries.yml

@ -2,6 +2,7 @@ global-styling:
version: VERSION version: VERSION
css: css:
base: base:
css/fonts.css: {}
css/site-variables.css: {} css/site-variables.css: {}
css/base.css: {} css/base.css: {}
layout: layout:

Loading…
Cancel
Save