center image, format code

LeChn · Mar 12, 2021 · 90b3661 · 90b3661
1 parent c876be0
commit 90b3661
Show file tree

Hide file tree

Showing 2 changed files with 413 additions and 521 deletions.
diff --git a/css/resume.css b/css/resume.css
@@ -4,119 +4,180 @@
  * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-resume/blob/master/LICENSE)
  */
 body {
-  font-family: 'Open Sans', serif;
-  padding-top: 54px;
-  color: #868e96; }
+	font-family: 'Open Sans', serif;
+	padding-top: 54px;
+	color: #868e96;
+}
 
 @media (min-width: 992px) {
-  body {
-    padding-top: 0;
-    padding-left: 17rem; } }
+	body {
+		padding-top: 0;
+		padding-left: 17rem;
+	}
+}
 
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
-  font-family: 'Saira Extra Condensed', serif;
-  font-weight: 700;
-  text-transform: uppercase;
-  color: #343a40; }
+	font-family: 'Saira Extra Condensed', serif;
+	font-weight: 700;
+	text-transform: uppercase;
+	color: #343a40;
+}
 
 h1 {
-  font-size: 6rem;
-  line-height: 5.5rem; }
+	font-size: 6rem;
+	line-height: 5.5rem;
+}
 
 h2 {
-  font-size: 3.5rem; }
+	font-size: 3.5rem;
+}
 
 .subheading {
-  text-transform: uppercase;
-  font-weight: 500;
-  font-family: 'Saira Extra Condensed', serif;
-  font-size: 1.35rem; }
+	text-transform: uppercase;
+	font-weight: 500;
+	font-family: 'Saira Extra Condensed', serif;
+	font-size: 1.35rem;
+}
 
 .list-social-icons a {
-  color: #495057; }
-  .list-social-icons a:hover {
-    color: #8484EE; }
-  .list-social-icons a .fa-lg {
-    font-size: 1.75rem; }
+	color: #495057;
+}
+.list-social-icons a:hover {
+	color: #8484ee;
+}
+.list-social-icons a .fa-lg {
+	font-size: 1.75rem;
+}
 
 .list-icons {
-  font-size: 3rem; }
-  .list-icons .list-inline-item i:hover {
-    color: #8484EE; }
+	font-size: 3rem;
+}
+.list-icons .list-inline-item i:hover {
+	color: #8484ee;
+}
 
 #sideNav .navbar-nav .nav-item .nav-link {
-  font-weight: 600;
-  text-transform: uppercase; }
+	font-weight: 600;
+	text-transform: uppercase;
+}
 
 @media (min-width: 992px) {
-  #sideNav {
-    text-align: center;
-    position: fixed;
-    top: 0;
-    left: 0;
-    display: flex;
-    flex-direction: column;
-    width: 17rem;
-    height: 100vh; }
-    #sideNav .navbar-brand {
-      display: flex;
-      margin: auto auto 0;
-      padding: 0.5rem; }
-      #sideNav .navbar-brand .img-profile {
-        max-width: 10rem;
-        max-height: 10rem;
-        border: 0.5rem solid rgba(255, 255, 255, 0.2); }
-    #sideNav .navbar-collapse {
-      display: flex;
-      align-items: flex-start;
-      flex-grow: 0;
-      width: 100%;
-      margin-bottom: auto; }
-      #sideNav .navbar-collapse .navbar-nav {
-        flex-direction: column;
-        width: 100%; }
-        #sideNav .navbar-collapse .navbar-nav .nav-item {
-          display: block; }
-          #sideNav .navbar-collapse .navbar-nav .nav-item .nav-link {
-            display: block; } }
+	#sideNav {
+		text-align: center;
+		position: fixed;
+		top: 0;
+		left: 0;
+		display: flex;
+		flex-direction: column;
+		width: 17rem;
+		height: 100vh;
+	}
+	#sideNav .navbar-brand {
+		display: flex;
+		margin: auto auto 0;
+		padding: 0.5rem;
+	}
+	#sideNav .navbar-brand .img-profile {
+		max-width: 10rem;
+		max-height: 10rem;
+		border: 0.5rem solid rgba(255, 255, 255, 0.2);
+	}
+	#sideNav .navbar-collapse {
+		display: flex;
+		align-items: flex-start;
+		flex-grow: 0;
+		width: 100%;
+		margin-bottom: auto;
+	}
+	#sideNav .navbar-collapse .navbar-nav {
+		flex-direction: column;
+		width: 100%;
+	}
+	#sideNav .navbar-collapse .navbar-nav .nav-item {
+		display: block;
+	}
+	#sideNav .navbar-collapse .navbar-nav .nav-item .nav-link {
+		display: block;
+	}
+}
 
 section.resume-section {
-  border-bottom: 1px solid #dee2e6;
-  padding-top: 5rem !important;
-  padding-bottom: 5rem !important; }
-  section.resume-section .resume-item .resume-date {
-    min-width: none; }
+	border-bottom: 1px solid #dee2e6;
+	padding-top: 5rem !important;
+	padding-bottom: 5rem !important;
+}
+section.resume-section .resume-item .resume-date {
+	min-width: none;
+}
 
 @media (min-width: 768px) {
-  section.resume-section {
-    min-height: 100vh; }
-    section.resume-section .resume-item .resume-date {
-      min-width: 18rem; } }
+	section.resume-section {
+		min-height: 100vh;
+	}
+	section.resume-section .resume-item .resume-date {
+		min-width: 18rem;
+	}
+}
 
 @media (min-width: 992px) {
-  section.resume-section {
-    padding-top: 3rem !important;
-    padding-bottom: 3rem !important; } }
+	section.resume-section {
+		padding-top: 3rem !important;
+		padding-bottom: 3rem !important;
+	}
+}
 
 .bg-primary {
-  background-color: #8484EE !important; }
+	background-color: #8484ee !important;
+}
 
 .text-primary {
-  color: #8484EE !important; }
+	color: #8484ee !important;
+}
 
 a {
-  color: #8484EE; }
-  a:hover, a:focus, a:active {
-    color: #824027; }
+	color: #8484ee;
+}
+a:hover,
+a:focus,
+a:active {
+	color: #824027;
+}
 
 .center {
-  display: block;
-  margin-left: auto;
-  margin-right: auto;
-  width: 50%;
-}
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+	width: 50%;
+}
+
+.card-img-helper {
+	width: 100%;
+	height: 180px;
+	position: relative;
+}
+
+.center-card-img {
+	max-height: 100%;
+	max-width: 100%;
+	width: auto;
+	height: auto;
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	margin: auto;
+}
+
+.sink-button {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	margin: auto;
+}