diff --git a/resume_manager_core/static/resume_manager_core/css/sass/base.scss b/resume_manager_core/static/resume_manager_core/css/sass/base.scss
index ef1dddbe459d23a549d0049782fae90044c43c89..5efe5ed6f594b0dbf5f308c8ade64e6c1214b107 100644
--- a/resume_manager_core/static/resume_manager_core/css/sass/base.scss
+++ b/resume_manager_core/static/resume_manager_core/css/sass/base.scss
@@ -10,4 +10,5 @@
//================================ Core CSS Logic ================================//
//================================================================================//
+@use './src/_general_styles';
@use './src/_resume_blocky';
diff --git a/resume_manager_core/static/resume_manager_core/css/sass/src/_general_styles.scss b/resume_manager_core/static/resume_manager_core/css/sass/src/_general_styles.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a9f09e57e29280159443fbf2894824ef0066929e
--- /dev/null
+++ b/resume_manager_core/static/resume_manager_core/css/sass/src/_general_styles.scss
@@ -0,0 +1,204 @@
+
+//================================//
+//==== Generalized Resume CSS ====//
+//================================//
+
+// Generalized CSS for resume views.
+
+
+//================================================================================//
+//==================================== Imports ===================================//
+//================================================================================//
+
+// Import variables.
+@use '../../../../../../../../core/static/core/css/sass/src/variables/init' as var;
+
+
+//================================================================================//
+//==================================== Styles ====================================//
+//================================================================================//
+
+//========================================//
+//==== START Generalized Resume Block ====//
+//========================================//
+
+
+* {
+ box-sizing: border-box;
+}
+
+
+html, body {
+ max-width: 8.5in;
+// max-height: 11in;
+ margin: 0;
+ padding: 0;
+}
+
+
+html {
+
+ .page {
+ width: 100%;
+ max-width: 8.5in;
+ height: 10.8in;
+ max-height: 10.8in;
+ margin: 0.75cm;
+ padding: 0;
+
+ page-break-after: always;
+ }
+
+ // General Styles.
+ .page {
+
+ position: relative;
+
+ @include var.mixin-display-flex;
+ @include var.mixin-flex-direction(column);
+ @include var.mixin-flex-wrap(wrap);
+ @include var.mixin-justify-content(space-evenly);
+ @include var.mixin-align-items(center);
+ @include var.mixin-flex(1);
+
+ width: 100%;
+ max-width: 8.5in;
+// height: 100%;
+ max-height: 11in;
+ margin: 0;
+ padding: 0;
+
+ div, ul, li {
+ position: relative;
+
+ @include var.mixin-display-flex;
+ @include var.mixin-flex-wrap(wrap);
+ @include var.mixin-justify-content(space-evenly);
+ @include var.mixin-align-items(center);
+ @include var.mixin-flex(1);
+
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ }
+
+ div {
+ padding: 5px;
+ }
+
+ p {
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ }
+
+ h2, h3, h4 {
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ }
+
+ .flex {
+ display: flex;
+ }
+
+ .flex-horizontal {
+ flex-direction: row;
+
+ hr {
+ height: 95%;
+ margin-top: 20px;
+ margin-right: 15px;
+ margin-bottom: 20px;
+ margin-left: 15px;
+ }
+ }
+
+ .flex-vertical {
+ flex-direction: column;
+
+ hr {
+ width: 95%;
+ margin-top: 15px;
+ margin-right: 20px;
+ margin-bottom: 15px;
+ margin-left: 20px;
+ }
+ }
+
+ li.no-bullet {
+ list-style-type: none;
+ }
+
+ span.bold {
+ font-weight: bold;
+ }
+
+ .align-left {
+ text-align: left;
+ }
+
+ .align-center {
+ text-align: center;
+ }
+
+ .align-right {
+ text-align: right;
+ }
+
+ .flex-ratio-05 {
+ flex: 5;
+ }
+
+ .flex-ratio-08 {
+ flex: 8;
+ }
+
+ .flex-ratio-10 {
+ flex: 10;
+ }
+
+ .flex-ratio-20 {
+ flex: 20;
+ }
+
+ .flex-ratio-30 {
+ flex: 30;
+ }
+
+ .flex-ratio-40 {
+ flex: 40;
+ }
+
+ .flex-ratio-50 {
+ flex: 50;
+ }
+
+ .flex-ratio-60 {
+ flex: 60;
+ }
+
+ .flex-ratio-70 {
+ flex: 70;
+ }
+
+ .flex-ratio-80 {
+ flex: 80;
+ }
+
+ .flex-ratio-90 {
+ flex: 90;
+ }
+
+ .flex-ratio-100 {
+ flex: 100;
+ }
+ }
+
+}
+
+//======================================//
+//==== END Generalized Resume Block ====//
+//======================================//
diff --git a/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky.scss b/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky.scss
index 603213f197e1896ad069e23fec36bfe943547ee2..dda248d9d5963d00704a94404920c7c21c7b1a48 100644
--- a/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky.scss
+++ b/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky.scss
@@ -1,9 +1,9 @@
-//=============================//
-//==== Dev-Tools Color CSS ====//
-//=============================//
+//===================================//
+//==== Resume (Blocky Theme) CSS ====//
+//===================================//
-// CSS for DevTools "color test" views.
+// CSS for resume (blocky theme) views.
//================================================================================//
@@ -22,139 +22,19 @@
//==== START Resume Theme "Blocky" Block ====//
//===========================================//
-.color_section {
- @include var.mixin-display-flex;
- @include var.mixin-flex-direction(column);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
-
- width: 100%;
- padding-top: 5px;
- padding-bottom: 5px;
-}
-
-
-* {
- box-sizing: border-box;
-}
-
-
-html, body {
- max-width: 8.5in;
-// max-height: 11in;
- margin: 0;
- padding: 0;
-}
-
html {
- .page {
- width: 100%;
- max-width: 8.5in;
- height: 10.8in;
- max-height: 10.8in;
- margin: 0.75cm;
- padding: 0;
-
- page-break-after: always;
- }
-
- // General Styles.
.page {
- position: relative;
-
- @include var.mixin-display-flex;
- @include var.mixin-flex-direction(column);
- @include var.mixin-flex-wrap(wrap);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
- @include var.mixin-flex(1);
-
- width: 100%;
- max-width: 8.5in;
-// height: 100%;
- max-height: 11in;
- margin: 0;
- padding: 0;
-
border: 1px solid black;
- div, ul, li {
- position: relative;
-
- @include var.mixin-display-flex;
- @include var.mixin-flex-wrap(wrap);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
- @include var.mixin-flex(1);
-
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
- }
-
- div {
- padding: 5px;
- }
-
- p {
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
- }
-
- h2, h3, h4 {
- width: 100%;
- margin: 0;
- padding: 0;
- }
-
- .flex {
- display: flex;
- }
-
- .flex-horizontal {
- flex-direction: row;
-
- hr {
- height: 95%;
- margin-top: 20px;
- margin-right: 15px;
- margin-bottom: 20px;
- margin-left: 15px;
- }
- }
-
- .flex-vertical {
- flex-direction: column;
-
- hr {
- width: 95%;
- margin-top: 15px;
- margin-right: 20px;
- margin-bottom: 15px;
- margin-left: 20px;
- }
- }
-
hr {
color: black;
background-color: black;
border-color: black;
}
- li.no-bullet {
- list-style-type: none;
- }
-
- span.bold {
- font-weight: bold;
- }
-
.full-border {
border: 1px solid black;
}
@@ -179,57 +59,6 @@ html {
background-color: grey;
}
- .align-left {
- text-align: left;
- }
-
- .align-center {
- text-align: center;
- }
-
- .align-right {
- text-align: right;
- }
-
- .flex-ratio-10 {
- flex: 10;
- }
-
- .flex-ratio-20 {
- flex: 20;
- }
-
- .flex-ratio-30 {
- flex: 30;
- }
-
- .flex-ratio-40 {
- flex: 40;
- }
-
- .flex-ratio-50 {
- flex: 50;
- }
-
- .flex-ratio-60 {
- flex: 60;
- }
-
- .flex-ratio-70 {
- flex: 70;
- }
-
- .flex-ratio-80 {
- flex: 80;
- }
-
- .flex-ratio-90 {
- flex: 90;
- }
-
- .flex-ratio-100 {
- flex: 100;
- }
}
// Purple blocky theme styles.
@@ -252,3 +81,7 @@ html {
}
}
}
+
+//=========================================//
+//==== END Resume Theme "Blocky" Block ====//
+//=========================================//
diff --git a/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky_old.scss b/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky_old.scss
deleted file mode 100644
index 45a7fa96c3dbf1cbd088bf55498fcb2640f3ff86..0000000000000000000000000000000000000000
--- a/resume_manager_core/static/resume_manager_core/css/sass/src/_resume_blocky_old.scss
+++ /dev/null
@@ -1,165 +0,0 @@
-
-//=============================//
-//==== Dev-Tools Color CSS ====//
-//=============================//
-
-// CSS for DevTools "color test" views.
-
-
-//================================================================================//
-//==================================== Imports ===================================//
-//================================================================================//
-
-// Import variables.
-@use '../../../../../../../../core/static/core/css/sass/src/variables/init' as var;
-
-
-//================================================================================//
-//==================================== Styles ====================================//
-//================================================================================//
-
-//===========================================//
-//==== START Resume Theme "Blocky" Block ====//
-//===========================================//
-
-.color_section {
- @include var.mixin-display-flex;
- @include var.mixin-flex-direction(column);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
-
- width: 100%;
- padding-top: 5px;
- padding-bottom: 5px;
-}
-
-
-html, body {
- margin: 0;
- padding: 0;
-}
-
-
-html {
-
- .resume-page.full-size {
- width: 8.5in;
- height: 11in;
- margin: 1.5cm;
- }
-
- // General Styles.
- .resume-page {
-
- position: relative;
-
- @include var.mixin-display-flex;
- @include var.mixin-flex-direction(column);
- @include var.mixin-flex-wrap(wrap);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
- @include var.mixin-flex(1);
-
- width: 100%;
-// height: 100%;
- margin: 0;
- padding: 0;
-
- border: 1px solid black;
-
- box-sizing: border-box;
-
- div, ul, li {
- position: relative;
-
- @include var.mixin-display-flex;
- @include var.mixin-flex-wrap(wrap);
- @include var.mixin-justify-content(space-evenly);
- @include var.mixin-align-items(center);
- @include var.mixin-flex(1);
-
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
-
- box-sizing: border-box;
- }
-
- p {
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
- }
-
- h2, h3, h4 {
- width: 100%;
-// height: 100%;
- margin: 0;
- padding: 0;
- }
-
- .resume-section-row,
- .resume-section-row > ul,
- .resume-section-row > ul > li {
- @include var.mixin-flex-direction(row);
- }
-
- .resume-section-row.minimal {
- @include var.mixin-flex(0);
- height: auto;
- }
-
- .resume-section-column,
- .resume-section-column > ul,
- .resume-section-column > ul > li{
- @include var.mixin-flex-direction(column);
- }
-
- .resume-section-column.minimal {
- @include var.mixin-flex(0);
-
- width: auto;
- }
-
- li.no-bullet {
- list-style-type: none;
- }
-
- span.bold {
- font-weight: bold;
- }
-
- .resume-section-style.full-color {
- border: 1px solid black;
- background-color: grey;
- }
-
- .align-left {
- text-align: left;
- }
-
- .align-center {
- text-align: center;
- }
-
- .align-right {
- text-align: right;
- }
- }
-
- // Purple blocky theme styles.
- .theme-blocky.purple .resume-page .resume-section-style.full-color {
- border-color: #27212e;
- background-color: #27212e;
-
- h2, h3, h4 {
- color: #fff;
- }
-
- span.bold {
- color: #233d74;
- }
- }
-}