Style Refresh (part 1): Fonts, colors

This commit is contained in:
mDuo13
2019-04-25 17:25:57 -07:00
parent 9d3644df4c
commit 2d2062a11d
8 changed files with 1703 additions and 836 deletions

View File

@@ -1,14 +1,5 @@
/* Generic styles and colors not in the bootstrap files --------------------- */
body {
font-family: Roboto, sans-serif;
}
code,
pre {
font-family: "Roboto Mono", monospace;
}
td {
border: 1px solid #dbdde2;
padding: 0.2em;
@@ -206,10 +197,7 @@ th {
/* Footer ------------------------------------------------------------------- */
.ripple-footer {
z-index: 2;
color: #999999;
font-size: 14px;
background: #28282a url(../img/ripple_footer_v2.jpg) repeat-x center center;
background-position-y: -60px;
}
@@ -250,6 +238,18 @@ th {
font-size: 14px;
}
.foot-nav-col {
border-left: 1px solid #eae7e6;
border-right: 1px solid #eae7e6;
}
.foot-nav-col:first-of-type {
border-left: 0;
}
.foot-nav-col:last-of-type {
border-right: 0;
}
/* Callouts ----------------------------------------------------------------- */
.devportal-callout {
@@ -943,8 +943,7 @@ a.current {
}
.splash-head {
background-color: #102b3e;
background-image: url("../img/splash-map.svg");
background-color: transparent;
background-size: cover;
background-position: center center;
color: white;

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

File diff suppressed because it is too large Load Diff

View File

@@ -4,51 +4,58 @@
// source files.
// Override some Bootstrap variables
$primary: #1db4ff; // "Ripple Blue" (aka "Blue-1")
$secondary: #0A93EB; // "Blue-2"
$light: #e1e4e8; // "Black-20"
$dark: #2b3e51; // "Background Navy"
// Set theme colors used by Bootstrap styles
$theme-colors: (
"primary": #1B1818, // XRP Black
"secondary": #676463, // Gray
"light": #EBE8E7, // light tan?
"dark": #1B1818, // XRP Black again
"success": #2BCB96, // light green
"caution": #D0DB60, // yellowish
//"info": todo // currently bluish
"warning": #AA4949, // wine red
);
$code-color: #3B4147; // "Black-80"
$navbar-padding-y: 0;
$navbar-nav-link-padding-x: 1rem;
// Font face stuff from Google
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: url("../font/Roboto-Light.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: url("../font/Roboto-Regular.woff2") format('woff2');
src: url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2'), url("../font/Roboto-Regular.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
src: url("../font/Roboto-Bold.woff2") format('woff2');
src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format('woff2'), url("../font/Roboto-Bold.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Roboto Mono';
font-family: 'Space Mono';
font-style: normal;
font-weight: 400;
src: url("../font/Roboto-Mono.woff2") format('woff2');
src: local('Space Mono'), local('SpaceMono-Regular'), url(https://fonts.gstatic.com/s/spacemono/v4/i7dPIFZifjKcF5UAWdDRYEF8RQ.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Space Mono';
font-style: normal;
font-weight: 700;
src: local('Space Mono Bold'), local('SpaceMono-Bold'), url(https://fonts.gstatic.com/s/spacemono/v4/i7dMIFZifjKcF5UAWdDRaPpZUFWaHg.woff2) format('woff2'), url("../font/Roboto-Regular.woff2") format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
$font-family-monospace: 'Space Mono', monospace;
$font-family-sans-serif: 'Roboto', sans-serif;
// Bootstrap v4
@import "node_modules/bootstrap/scss/bootstrap";
@import "node_modules/bootstrap/scss/bootstrap.scss";
// CSS overrides
:root {
--font-family-sans-serif: 'Roboto', sans-serif;
--font-family-monospace: 'Roboto Mono', monospace;
h1, h2, h3, h4, h5 {
font-family: 'Space Mono', monospace;
font-weight: 700;
}

View File

@@ -21,13 +21,12 @@
<link rel="shortcut icon" href="favicon.ico">
<meta name="msapplication-TileColor" content="#1db4ff">
<meta name="msapplication-config" content="assets/favicons/browserconfig.xml">
<meta name="theme-color" content="#1db4ff">
<meta name="theme-color" content="#1db4ff"><!-- TODO: replace. Black? -->
<!-- jQuery -->
<script src="assets/vendor/jquery-1.11.1.min.js"></script>
<!-- Custom Stylesheets. ripple.css includes bootstrap, font stuff -->
<!-- <link href="assets/css/ripple.css" rel="stylesheet" /> -->
<!-- Custom Stylesheets. -->
<link href="assets/vendor/bootstrap.css" rel="stylesheet" />
<link href="assets/css/devportal.css" rel="stylesheet" />