Merge pull request #1034 from sul-dlss/static-css

Gemfile

@@ -84,6 +84,4 @@ gem 'connection_pool'
 
 group :production do
   gem 'newrelic_rpm'
-end
-
-gem "cssbundling-rails", "~> 1.1"
+end

Procfile.dev

@@ -1,2 +1 @@
 web: unset PORT && bin/rails server
-css: yarn build:css --watch

app/assets/stylesheets/application.css

@@ -0,0 +1,246 @@
+:root {
+  --bs-link-color-rgb: 0,0,0;
+  --bs-link-hover-color-rgb: 0,0,0;
+  --bs-body-bg: #fbfbf9;
+}
+
+h1, h2 {
+  font-weight: 300;
+}
+
+a.disabled {
+  color: #ccc;
+  cursor: not-allowed;
+  text-decoration: none;
+}
+
+body {
+  font-family: "Source Sans Pro", "Arial Unicode MS", Helvetica, sans-serif;
+  font-size: 0.9375rem;
+  line-height: 1.428571429;
+}
+
+a, a:hover, a:focus {
+  text-decoration: none;
+  border-bottom: 1px dotted #b6b1a9;
+}
+
+h1 {
+  font-family: "dejavu_sansextralight";
+  color: #3f3c30;
+  padding: 10px 0;
+  letter-spacing: -0.05em;
+}
+
+h2 {
+  letter-spacing: 0;
+  line-height: 1.2em;
+  margin: 0.5em 0;
+  color: #8c1515;
+  border-bottom: 1px solid #e3dfd5;
+}
+
+h3 {
+  font-weight: 400;
+  line-height: 1.3em;
+  margin: 0 0 0.4em 0;
+}
+
+dl {
+  margin-bottom: 15px;
+}
+
+dt {
+  color: #696969;
+  font-weight: normal;
+  font-size: 0.9em;
+  text-transform: uppercase !important;
+  padding-right: 1em;
+  padding-top: 0.15em;
+  width: 12em;
+}
+
+dd {
+  margin-left: 2em;
+  margin-bottom: 0.5em;
+  max-width: 45em;
+}
+
+label {
+  font-weight: normal;
+}
+
+.section p, .section li {
+  max-width: 45em;
+}
+
+#search-navbar {
+  border: none !important;
+  background: none;
+  padding: 0 0;
+}
+
+#outer-container, #topnav-container, #search-navbar-container, #sul-footer-container {
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  border: none;
+}
+
+#topnav, #search-navbar, #main-container, #sul-footer, #masthead-container {
+  margin: 0 auto;
+  text-align: left;
+}
+
+#main-container #main-flashes {
+  min-height: 0;
+}
+
+#search-navbar {
+  padding: 0;
+}
+
+a#sul-logo {
+  float: left;
+  border-bottom: none;
+}
+
+@media (min-width: 768px) {
+  #topnav, #search-navbar, #main-container, #sul-footer, #masthead-container {
+    width: 750px;
+  }
+}
+@media (min-width: 980px) {
+  #topnav, #search-navbar, #main-container, #sul-footer, #masthead-container {
+    width: 970px;
+  }
+}
+@media (min-width: 1200px) {
+  #topnav, #search-navbar, #main-container, #sul-footer, #masthead-container {
+    width: 1170px;
+  }
+}
+@media only screen and (max-width: 768px) {
+  #main-container, #search-navbar {
+    padding: 0 15px;
+  }
+  #search-navbar-container .search-form {
+    padding: 0;
+  }
+  #search-navbar .navbar-toggle {
+    margin-right: 0;
+  }
+}
+#su-content {
+  padding-bottom: 330px !important;
+}
+@media (min-width: 768px) {
+  #su-content {
+    padding-bottom: 220px !important;
+  }
+}
+
+#sul-footer-container {
+  background-color: #f2f1eb;
+  box-shadow: inset 0 4px 8px -8px rgba(0, 0, 0, 0.2);
+  clear: both;
+  margin-top: -330px;
+  min-height: 330px;
+  padding: 0;
+  position: relative;
+}
+@media (min-width: 768px) {
+  #sul-footer-container {
+    margin-top: -220px;
+    min-height: 220px;
+  }
+}
+
+#sul-footer {
+  display: table;
+  height: 80px;
+  padding: 0;
+}
+
+#sul-footer-img {
+  display: table-cell;
+  vertical-align: middle;
+  width: 162px;
+}
+
+#sul-footer-links {
+  display: table-cell;
+  vertical-align: middle;
+  text-align: left;
+  padding-left: 15px;
+  font-size: small;
+}
+
+#sul-footer {
+  display: table;
+  height: 80px;
+  padding: 0;
+}
+#sul-footer ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+#sul-footer ul li {
+  display: inline;
+  margin: 0 13px 3px 0;
+  padding: 0;
+}
+#sul-footer ul li a {
+  white-space: nowrap;
+}
+#sul-footer #sul-footer-img {
+  display: table-cell;
+  vertical-align: middle;
+  width: 162px;
+}
+#sul-footer #sul-footer-img a,
+#sul-footer #sul-footer-img a:hover,
+#sul-footer #sul-footer-img a:focus {
+  border-bottom: 0;
+}
+#sul-footer #sul-footer-links {
+  display: table-cell;
+  font-size: small;
+  padding-left: 15px;
+  text-align: left;
+  vertical-align: middle;
+}
+
+#global-footer {
+  max-width: 100%;
+}
+
+#global-footer p {
+  max-width: 100%;
+  width: auto;
+}
+
+#global-footer #bottom-text {
+  margin-right: 6px;
+}
+
+#global-footer .vcard {
+  margin-left: 2rem;
+}
+
+#topnav-container {
+  padding: 2px 0;
+  position: relative;
+}
+
+#topnav {
+  border: none;
+  background: none;
+  margin-bottom: 0;
+  padding: 2px 10px;
+  width: 100%;
+}
+#topnav > a {
+  border: none;
+}