From: Michael Tremer Date: Sun, 29 May 2022 13:21:18 +0000 (+0000) Subject: foundation: Add basic stuff for CSS & JS X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=ee08328ef9705afb6bc9b850d61dd80b0e6cc047;p=pbs.git foundation: Add basic stuff for CSS & JS Signed-off-by: Michael Tremer --- diff --git a/Makefile.am b/Makefile.am index 0affc3b5..2087c377 100644 --- a/Makefile.am +++ b/Makefile.am @@ -341,13 +341,18 @@ dist_static_DATA = \ staticdir = $(datadir)/static -dist_static_css_DATA = \ - src/static/css/bootstrap-responsive.min.css \ - src/static/css/bootstrap.min.css \ - src/static/css/style.css +static_css_DATA = \ + src/static/css/site.css static_cssdir = $(staticdir)/css +EXTRA_DIST += \ + src/static/css/_fonts.scss \ + src/static/css/site.scss + +CLEANFILES += \ + src/static/css/site.css + dist_static_font_DATA = \ src/static/font/fontawesome-webfont.eot \ src/static/font/fontawesome-webfont.svg \ @@ -375,15 +380,17 @@ dist_static_images_DATA = \ static_imagesdir = $(staticdir)/images -dist_static_js_DATA = \ - src/static/js/bootstrap.min.js \ +static_js_DATA = \ + src/static/js/foundation.min.js \ src/static/js/jquery.js \ src/static/js/pbs.js \ - src/static/js/popper.min.js \ src/static/js/prettify.js static_jsdir = $(staticdir)/js +CLEANFILES += \ + src/static/js/foundation.min.js + # ------------------------------------------------------------------------------ if HAVE_SYSTEMD @@ -445,3 +452,6 @@ UGLIFYJS_PROCESS = \ %.min.js: %.js $(UGLIFYJS_PROCESS) + +src/static/js/foundation.min.js: src/third-party/foundation-sites/dist/js/foundation.js + $(UGLIFYJS_PROCESS) diff --git a/src/static/css/.gitignore b/src/static/css/.gitignore new file mode 100644 index 00000000..b3a52671 --- /dev/null +++ b/src/static/css/.gitignore @@ -0,0 +1 @@ +*.css diff --git a/src/static/css/_fonts.scss b/src/static/css/_fonts.scss new file mode 100644 index 00000000..107f9d04 --- /dev/null +++ b/src/static/css/_fonts.scss @@ -0,0 +1,53 @@ +/* latin-ext */ +@font-face { + font-family: "Prompt"; + font-style: normal; + font-weight: 400; + src: local("Prompt Regular"), local("Prompt-Regular"), url(../fonts/Prompt-Regular.ttf) format("truetype"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} + +/* latin */ +@font-face { + font-family: "Prompt"; + font-style: normal; + font-weight: 400; + src: local("Prompt Regular"), local("Prompt-Regular"), url(../fonts/Prompt-Regular.ttf) format("truetype"); + 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; +} + +/* latin-ext */ +@font-face { + font-family: 'Prompt'; + font-style: normal; + font-weight: 500; + src: local('Prompt Medium'), local('Prompt-Medium'), url(../fonts/Prompt-Medium.ttf) format("truetype"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} + +/* latin */ +@font-face { + font-family: 'Prompt'; + font-style: normal; + font-weight: 500; + src: local('Prompt Medium'), local('Prompt-Medium'), url(../fonts/Prompt-Medium.ttf) format("truetype"); + 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; +} + +/* latin-ext */ +@font-face { + font-family: "Prompt"; + font-style: normal; + font-weight: 700; + src: local("Prompt Bold"), local("Prompt-Bold"), url(../fonts/Prompt-Bold.ttf) format("truetype"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} + +/* latin */ +@font-face { + font-family: "Prompt"; + font-style: normal; + font-weight: 700; + src: local("Prompt Bold"), local("Prompt-Bold"), url(../fonts/Prompt-Bold.ttf) format("truetype"); + 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; +} diff --git a/src/static/css/site.scss b/src/static/css/site.scss new file mode 100644 index 00000000..8c514eff --- /dev/null +++ b/src/static/css/site.scss @@ -0,0 +1,84 @@ +/* + Global Settings +*/ +$body-font-family: Prompt, sans-serif; + +// Colour Palette +$foundation-palette: ( + primary: #ff2e53, + secondary: #767676, + success: #3adb76, + warning: #e7e247, + alert: #cc4b37, +); + +// Import fonts +@import "fonts"; + +/* + Import Foundation Sites +*/ +@import "../../third-party/foundation-sites/scss/foundation"; + +// Global styles +@include foundation-global-styles; +@include foundation-forms; +@include foundation-typography; + +// Enable the XY Grid +@include foundation-xy-grid-classes; + +// Generic components +@include foundation-button; +@include foundation-button-group; +@include foundation-close-button; +@include foundation-label; +@include foundation-progress-bar; +@include foundation-slider; +@include foundation-switch; +@include foundation-table; + +// Basic components +@include foundation-badge; +@include foundation-breadcrumbs; +@include foundation-callout; +@include foundation-card; +@include foundation-dropdown; +@include foundation-pagination; +@include foundation-tooltip; + +// Containers +@include foundation-accordion; +@include foundation-media-object; +@include foundation-orbit; +@include foundation-responsive-embed; +@include foundation-tabs; +@include foundation-thumbnail; + +// Menu-based containers +@include foundation-menu; +@include foundation-menu-icon; +@include foundation-accordion-menu; +@include foundation-drilldown-menu; +@include foundation-dropdown-menu; + +// Layout components +@include foundation-off-canvas; +@include foundation-reveal; +@include foundation-sticky; +@include foundation-title-bar; +@include foundation-top-bar; + +// Helpers +@include foundation-float-classes; +// @include foundation-flex-classes; +@include foundation-visibility-classes; +// @include foundation-prototype-classes; + +/* + Custom CSS +*/ + +.top-bar { + margin-bottom: 1rem; +} diff --git a/src/static/js/.gitignore b/src/static/js/.gitignore new file mode 100644 index 00000000..121531af --- /dev/null +++ b/src/static/js/.gitignore @@ -0,0 +1 @@ +*.min.js diff --git a/src/templates/base.html b/src/templates/base.html index 500cf35a..7ebae46c 100644 --- a/src/templates/base.html +++ b/src/templates/base.html @@ -1,16 +1,15 @@ - + - {{ hostname }} - {% block title %}{{ _("No title given") }}{% end block %} - + + + - - - - + {{ hostname }} - {% block title %}{{ _("No title given") }}{% end block %} - + + @@ -116,8 +115,7 @@ - - +