Added new widgets and text styles and fonts to the system; Moved the logo into the project proper so nothing should be in the root Public folder any more (other than generated content).

2021-01-16 15:30:06 -08:00
parent db2a612e2a
commit 6823384b20
19 changed files with 207 additions and 89 deletions
--- a/app.js
+++ b/app.js
@@ -15,6 +15,7 @@ let apos = require('apostrophe')({
 		'two-column-widgets': {extend: 'apostrophe-widgets'},
 		'two-column-1-2-widgets': {},
 		'two-column-2-1-widgets': {},
+		'theme': {},
 		
 		
 		// Apostrophe module configuration
--- a/lib/modules/apostrophe-assets/index.js
+++ b/lib/modules/apostrophe-assets/index.js
@@ -13,8 +13,5 @@ module.exports = {
 	scripts: [
 		{name: 'bootstrap'},
 		{name: 'site'}
-	],
-	images: [
-		{name: 'AvLogo.png'}
 	]
 };
--- a/lib/modules/apostrophe-assets/public/css/main.css
+++ b/lib/modules/apostrophe-assets/public/css/main.css
@@ -1,9 +1,54 @@
+@font-face {
+  font-family: "Merriweather";
+  src: url("/modules/theme/fonts/Merriweather-Regular.ttf") format("truetype");
+}
+@font-face {
+  font-family: "MerriweatherSans";
+  src: url("/modules/theme/fonts/MerriweatherSans-VariableFont_wght.ttf") format("truetype");
+}
+@font-face {
+  font-family: "LibreFranklin";
+  src: url("/modules/theme/fonts/LibreFranklin[wght].ttf") format("truetype");
+}
+@font-face {
+  font-family: "PottaOne";
+  src: url("/modules/theme/fonts/PottaOne-Regular.ttf") format("truetype");
+}
 p {
-  margin-top: 0.3rem;
-  margin-bottom: 0.7rem;
+  text-indent: 0;
+  margin: 0.3rem 0 0.7rem 0 !important;
+  padding: 0 !important;
+  font-family: "Merriweather", "serif";
+  font-size: 1.1rem;
  line-height: 1.4rem;
 }

+p.indent {
+  text-indent: 1rem;
+}
+
+div[data-apos-widget=apostrophe-files] a, .apos-rich-text a {
+  margin: 0.3rem 0 0.7rem 0 !important;
+  font-family: "MerriweatherSans", "sans-serif";
+  font-size: 1.4rem;
+  line-height: 1.6rem;
+  color: #1c1cc4;
+  text-shadow: 0 0 0.6rem #9ef371;
+  transition: text-shadow 0.5s, color 0.5s;
+}
+div[data-apos-widget=apostrophe-files] a:hover, .apos-rich-text a:hover {
+  color: #3d1cd0;
+  text-shadow: 0 0 0.6rem #7beeee;
+}
+div[data-apos-widget=apostrophe-files] a:active, .apos-rich-text a:active {
+  color: #7a29ec;
+}
+
+.apos-rich-text a {
+  font-size: 1.2rem;
+  line-height: 1.5rem;
+}
+
 h5 {
  font-size: 1.2rem;
  font-weight: 900;
@@ -16,11 +61,24 @@ h5 {
 }

 .apos-area-widget a {
-  display: block;
+  display: inline;
  padding-bottom: 0.8rem;
 }

 .apos-rich-text ul {
+  list-style-type: disc;
+  list-style-position: inside;
+  margin: 0.3rem 0 0.7rem 2rem;
+  text-indent: -1.5rem;
+  padding: 0;
+  font-family: "Merriweather", "serif";
+  font-size: 1.1rem;
+  line-height: 1.4rem;
+}
+
+.apos-rich-text ul ul {
+  margin-left: 2.5rem;
+  text-indent: -1.7rem;
  list-style-type: circle;
  list-style-position: inside;
 }
@@ -45,12 +103,6 @@ h5 {
  color: Green;
 }

-ul.bulletLevel2 {
-  text-indent: 1rem;
-  list-style-type: circle;
-  list-style-position: inside;
-}
-
 .apos-login-logo {
  margin-bottom: 0;
 }
--- a/lib/modules/apostrophe-assets/public/css/main.css.map
+++ b/lib/modules/apostrophe-assets/public/css/main.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["main.sass"],"names":[],"mappings":"AACA;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAED;EACC;EACA;EACA;;;AAOD;EACC;;;AACD;EACC;EACA;;;AACD;EACC,kBAPU;;;AASV;EACC;;AACD;EACC;;AACD;EACC;;AACD;EACC;;AACD;EACC,kBAnBQ;;AAoBT;EACC;;;AACF;EACC,kBAvBS;;;AAwBV;EACC;IACC;IACA;IACA;;;AAKF;EACC;IACC;;;AAEF;EACC;IACC;;;AAEF;EACC;IACC;;;AAEF;EACC;IACC","file":"main.css"}
+{"version":3,"sourceRoot":"","sources":["main.sass"],"names":[],"mappings":"AAAA;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;EACA;;AAED;EACC;EAGA;EACA;EACA;EACA;EACA;;;AACD;EACC;;;AAIA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACD;EACC;EACA;;AACD;EACC;;;AAGD;EACC;EACA;;;AAEF;EACC;EACA;EACA;EACA;;;AAED;EACC;;;AAED;EACC;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AACD;EACC;EACA;EACA;EACA;;;AAED;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAQD;EACC;;;AACD;EACC;EACA;;;AACD;EACC,kBAPU;;;AASV;EACC;;AACD;EACC;;AACD;EACC;;AACD;EACC;;AACD;EACC,kBAnBQ;;AAoBT;EACC;;;AACF;EACC,kBAvBS;;;AAwBV;EACC;IACC;IACA;IACA;;;AAKF;EACC;IACC;;;AAEF;EACC;IACC;;;AAEF;EACC;IACC;;;AAEF;EACC;IACC","file":"main.css"}
--- a/lib/modules/apostrophe-assets/public/css/main.sass
+++ b/lib/modules/apostrophe-assets/public/css/main.sass
@@ -1,8 +1,48 @@
+@font-face
+	font-family: 'Merriweather'
+	src: url('/modules/theme/fonts/Merriweather-Regular.ttf') format("truetype")
+@font-face
+	font-family: 'MerriweatherSans'
+	src: url('/modules/theme/fonts/MerriweatherSans-VariableFont_wght.ttf') format("truetype")
+@font-face
+	font-family: "LibreFranklin"
+	src: url('/modules/theme/fonts/LibreFranklin[wght].ttf') format("truetype")
+@font-face
+	font-family: "PottaOne"
+	src: url('/modules/theme/fonts/PottaOne-Regular.ttf') format('truetype')

 p
-	margin-top: 0.3rem
-	margin-bottom: 0.7rem
+	text-indent: 0
+	// The important is necessary here because for some reason CKEditor outputs style="padding: 0; margin: 0" for every <p></p> tag.
+	// Remove !important if we can figure out how to remove the style CKEditor outputs.
+	margin: 0.3rem 0 0.7rem 0 !important
+	padding: 0 !important
+	font-family: "Merriweather", "serif"
+	font-size: 1.1rem
 	line-height: 1.4rem
+p.indent
+	text-indent: 1rem
+
+//Links using Apostrophe Files or Rich Text Widgets
+div[data-apos-widget='apostrophe-files'], .apos-rich-text
+	a
+		margin: 0.3rem 0 0.7rem 0 !important
+		font-family: "MerriweatherSans", 'sans-serif'
+		font-size: 1.4rem
+		line-height: 1.6rem
+		color: #1c1cc4
+		text-shadow: 0 0 0.6rem rgb(158, 243, 113)
+		transition: text-shadow 0.5s, color 0.5s
+	a:hover
+		color: #3d1cd0
+		text-shadow: 0 0 0.6rem rgb(123, 238, 238)
+	a:active
+		color: #7a29ec
+//Links embedded in a rich text widget.
+.apos-rich-text
+	a
+		font-size: 1.2rem
+		line-height: 1.5rem

 h5
 	font-size: 1.2rem
@@ -14,10 +54,21 @@ h5
 	display: none

 .apos-area-widget a
-	display: block
+	display: inline
 	padding-bottom: 0.8rem

 .apos-rich-text ul
+	list-style-type: disc
+	list-style-position: inside
+	margin: 0.3rem 0 0.7rem 2rem
+	text-indent: -1.5rem
+	padding: 0
+	font-family: "Merriweather", "serif"
+	font-size: 1.1rem
+	line-height: 1.4rem
+.apos-rich-text ul ul
+	margin-left: 2.5rem
+	text-indent: -1.7rem
 	list-style-type: circle
 	list-style-position: inside

@@ -39,10 +90,6 @@ h5
 	box-shadow: 0 0 20px 10px rgba(255, 255, 255, 0.61)
 	color: Green

-ul.bulletLevel2
-	text-indent: 1rem
-	list-style-type: circle
-	list-style-position: inside

 //
 // Redefine some of the Apostrophe administrative UI.
--- a/lib/modules/apostrophe-pages/views/pages/aves.html
+++ b/lib/modules/apostrophe-pages/views/pages/aves.html
@@ -11,19 +11,23 @@
    <div class="container" style="margin-top: 3rem">
        {{ apos.area(data.page, "body", {
 	    widgets: {
-                'apostrophe-images': {size: 'one-half'},
+		    'apostrophe-images': {size: 'original'},
 		    'apostrophe-rich-text': {
-                    toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'import'],
+			    toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Indent', 'Outdent', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
 			    styles: [
 				    {name: 'Paragraph', element: 'p'},
+				    {name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 				    {name: 'Heading 2', element: 'h2'},
 				    {name: 'Heading 3', element: 'h3'},
 				    {name: 'Heading 4', element: 'h4'},
-                        {name: 'Heading 5', element: 'h5'}
+				    {name: 'Heading 5', element: 'h5'},
+				    {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
 			    ]
 		    },
 		    'apostrophe-files': {},
-                'two-column': {}
+		    'two-column': {},
+		    'two-column-1-2': {},
+		    'two-column-2-1': {}
 	    }
        }) }}
    </div>
--- a/lib/modules/apostrophe-pages/views/pages/avhs.html
+++ b/lib/modules/apostrophe-pages/views/pages/avhs.html
@@ -11,19 +11,23 @@
    <div class="container" style="margin-top: 3rem">
 	    {{ apos.area(data.page, "body", {
 		    widgets: {
-                'apostrophe-images': {size: 'one-half'},
+			    'apostrophe-images': {size: 'original'},
 			    'apostrophe-rich-text': {
-                    toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'import'],
+				    toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Indent', 'Outdent', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
 				    styles: [
 					    {name: 'Paragraph', element: 'p'},
+					    {name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 					    {name: 'Heading 2', element: 'h2'},
 					    {name: 'Heading 3', element: 'h3'},
 					    {name: 'Heading 4', element: 'h4'},
-                        {name: 'Heading 5', element: 'h5'}
+					    {name: 'Heading 5', element: 'h5'},
+					    {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
 				    ]
 			    },
 			    'apostrophe-files': {},
-                'two-column': {}
+			    'two-column': {},
+			    'two-column-1-2': {},
+			    'two-column-2-1': {}
 		    }
 	    }) }}
    </div>
--- a/lib/modules/apostrophe-pages/views/pages/district.html
+++ b/lib/modules/apostrophe-pages/views/pages/district.html
@@ -8,18 +8,19 @@
            'apostrophe-rich-text': {
                toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Indent', 'Outdent', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
                styles: [
-                    {name: 'Paragraph', element: 'p', attributes: {class: "p"} },
-                    {name: 'Heading 2', element: 'h2', attributes: {class: "h2"} },
-                    {name: 'Heading 3', element: 'h3', attributes: {class: "h3"} },
-                    {name: 'Heading 4', element: 'h4', attributes: {class: "h4"} },
-                    {name: 'Heading 5', element: 'h5', attributes: {class: "h5"} },
-	                {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} },
-	                {name: 'bullet2', element: 'div', attributes: {class: "bulletLevel2"} }
+	                {name: 'Paragraph', element: 'p'},
+	                {name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
+	                {name: 'Heading 2', element: 'h2'},
+	                {name: 'Heading 3', element: 'h3'},
+	                {name: 'Heading 4', element: 'h4'},
+	                {name: 'Heading 5', element: 'h5'},
+	                {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
                ]
            },
            'apostrophe-files': {},
            'two-column': {},
-	        'two-column-1-2': {}
+	        'two-column-1-2': {},
+	        'two-column-2-1': {}
        }
    }) }}
    </div>
--- a/lib/modules/apostrophe-rich-text-widgets/index.js
+++ b/lib/modules/apostrophe-rich-text-widgets/index.js
@@ -11,10 +11,10 @@ module.exports = {
 			'sup', 'sub', 'span'
 		],
 		allowedClasses: {
-			'p': ['highlighted','apos-indent1', 'apos-indent2', 'bulletLevel2'],
-			'ul': ['bulletLevel2'],
-			'div': ['highlighted', "bulletLevel2"],
-			'*': ['highlighted', 'bulletLevel2', 'test', '*']
+			'p': ['highlighted', 'indent', 'bulletLevel2','apos-indent1', 'apos-indent2'],
+			'ul': ['bulletLevel2','apos-indent1', 'apos-indent2'],
+			'div': ['highlighted', "bulletLevel2",'apos-indent1', 'apos-indent2'],
+			'*': ['highlighted', 'bulletLevel2', 'test', '*','apos-indent1', 'apos-indent2']
 		},
 		allowedAttributes: {
 			'*': ['style', 'class'],
--- a/lib/modules/apostrophe-users/index.js
+++ b/lib/modules/apostrophe-users/index.js
@@ -12,19 +12,19 @@ module.exports = {
 		},
 		{
 			title: 'AVES',
-			permissions: []
+			permissions: ["AVES"]
 		},
 		{
 			title: 'AVHS',
-			permissions: []
+			permissions: ["AVHS"]
 		},
 		{
 			title: 'AVAS',
-			permissions: []
+			permissions: ["AVAS"]
 		},
 		{
 			title: 'AVUSD',
-			permissions: []
+			permissions: ['AVUSD']
 		},
 		{
 			title: 'admin',
--- a/lib/modules/theme/index.js
+++ b/lib/modules/theme/index.js
@@ -0,0 +1,5 @@
+// This configures the apostrophe-assets module to push a 'site.less'
+// stylesheet by default, and to use jQuery 3.x
+
+module.exports = {
+};
--- a/lib/modules/theme/public/fonts/LibreFranklin[wght].ttf
+++ b/lib/modules/theme/public/fonts/LibreFranklin[wght].ttf
--- a/lib/modules/theme/public/fonts/Merriweather-Regular.ttf
+++ b/lib/modules/theme/public/fonts/Merriweather-Regular.ttf
--- a/lib/modules/theme/public/fonts/MerriweatherSans-VariableFont_wght.ttf
+++ b/lib/modules/theme/public/fonts/MerriweatherSans-VariableFont_wght.ttf
--- a/lib/modules/theme/public/img/AvLogo.png
+++ b/lib/modules/theme/public/img/AvLogo.png
--- a/lib/modules/two-column-1-2-widgets/views/widget.html
+++ b/lib/modules/two-column-1-2-widgets/views/widget.html
@@ -8,10 +8,12 @@
 					toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
 					styles: [
 						{name: 'Paragraph', element: 'p'},
+						{name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 						{name: 'Heading 2', element: 'h2'},
 						{name: 'Heading 3', element: 'h3'},
 						{name: 'Heading 4', element: 'h4'},
-						{name: 'Heading 5', element: 'h5'}
+						{name: 'Heading 5', element: 'h5'},
+						{name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
 					]
 				},
 				'apostrophe-files': {}
--- a/lib/modules/two-column-2-1-widgets/views/widget.html
+++ b/lib/modules/two-column-2-1-widgets/views/widget.html
@@ -8,10 +8,12 @@
 					toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
 					styles: [
 						{name: 'Paragraph', element: 'p'},
+						{name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 						{name: 'Heading 2', element: 'h2'},
 						{name: 'Heading 3', element: 'h3'},
 						{name: 'Heading 4', element: 'h4'},
-						{name: 'Heading 5', element: 'h5'}
+						{name: 'Heading 5', element: 'h5'},
+						{name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
 					]
 				},
 				'apostrophe-files': {}
@@ -26,10 +28,12 @@
 					toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
 					styles: [
 						{name: 'Paragraph', element: 'p'},
+						{name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 						{name: 'Heading 2', element: 'h2'},
 						{name: 'Heading 3', element: 'h3'},
 						{name: 'Heading 4', element: 'h4'},
-						{name: 'Heading 5', element: 'h5'}
+						{name: 'Heading 5', element: 'h5'},
+						{name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
 					]
 				},
 				'apostrophe-files': {}
--- a/lib/modules/two-column-widgets/views/widget.html
+++ b/lib/modules/two-column-widgets/views/widget.html
@@ -8,10 +8,12 @@
                        toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
                        styles: [
 	                        {name: 'Paragraph', element: 'p'},
+	                        {name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 	                        {name: 'Heading 2', element: 'h2'},
 	                        {name: 'Heading 3', element: 'h3'},
 	                        {name: 'Heading 4', element: 'h4'},
-                            {name: 'Heading 5', element: 'h5'}
+	                        {name: 'Heading 5', element: 'h5'},
+	                        {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
                        ]
                    },
                    'apostrophe-files': {}
@@ -26,10 +28,12 @@
                        toolbar: ['Styles', 'Bold', 'Italic', 'Link', 'Unlink', 'Anchor', 'Table', 'BulletedList', 'Blockquote', 'Strike', 'Subscript', 'Superscript', 'Split'],
                        styles: [
 	                        {name: 'Paragraph', element: 'p'},
+	                        {name: 'Topic Paragraph', element: 'p', attributes: {class: "indent"} },
 	                        {name: 'Heading 2', element: 'h2'},
 	                        {name: 'Heading 3', element: 'h3'},
 	                        {name: 'Heading 4', element: 'h4'},
-                            {name: 'Heading 5', element: 'h5'}
+	                        {name: 'Heading 5', element: 'h5'},
+	                        {name: 'highlighted', element: 'div', attributes: {class: "highlighted"} }
                        ]
                    },
                    'apostrophe-files': {}
--- a/views/layout.html
+++ b/views/layout.html
@@ -13,10 +13,7 @@
 {% endblock %}

 {% block extraHead %}
-{#
-This block outputs its contents in the HTML document's <head>.
-	It is a good place to put extra <script> <link> and <meta> tags.
-		#}
+{# This block outputs its contents in the HTML document's <head>. It is a good place to put extra <script> <link> and <meta> tags. #}
 	<link href="https://fonts.googleapis.com/css2?family=Arima+Madurai&family=Roboto&family=Dancing+Script&family=Open+Sans:ital@0;1&display=swap" rel="stylesheet">
 	{#  <script type="text/javascript" language="JavaScript" src="js/jquery-3.5.1.min.js"></script>  #}
 {% endblock %}
@@ -25,7 +22,7 @@ This block outputs its contents in the HTML document's <head>.
 	{# We recommend you use the beforeMain block for global page components like headers or navigation. #}
 	<div id="topBar" class="text-center" style="margin-bottom: 0">
 		{% block logoImage %}
-		<a href="/" aria-label="AVUSD District Home"><img class="logoImage" src='/images/AvLogo.png' alt="Anderson Valley Logo: Four colored chevrons that look like people facing each other as viewed from above."/></a>
+		<a href="/" aria-label="AVUSD District Home"><img class="logoImage" src='/modules/theme/img/AvLogo.png' alt="Anderson Valley Logo: Four colored chevrons that look like people facing each other as viewed from above."/></a>
 		{% endblock %}
 		<div class="logoText">
 			<p class="logoTitle">Anderson Valley Unified</p>