From b7a77797f6c112362b64085741b2e891ccbd9152 Mon Sep 17 00:00:00 2001 From: Lars Jung Date: Sun, 26 Apr 2015 00:33:36 +0200 Subject: [PATCH] Refactor styles. --- src/_h5ai/client/css/inc/colors.less | 58 ++++++ src/_h5ai/client/css/inc/core/content.less | 5 + .../client/css/inc/{ => core}/fallback.less | 10 +- src/_h5ai/client/css/inc/core/mainrow.less | 13 ++ .../client/css/inc/{ => core}/notify.less | 0 .../{h5ai-info.less => core/root-info.less} | 6 +- src/_h5ai/client/css/inc/core/root.less | 20 ++ .../client/css/inc/{ => core}/sidebar.less | 0 .../client/css/inc/{ => core}/topbar.less | 0 .../css/inc/{ => core}/view-details.less | 0 .../client/css/inc/{ => core}/view-grid.less | 0 .../client/css/inc/{ => core}/view-icons.less | 0 src/_h5ai/client/css/inc/{ => core}/view.less | 23 +-- .../client/css/inc/{ => ext}/contextmenu.less | 0 src/_h5ai/client/css/inc/{ => ext}/crumb.less | 0 .../css/inc/{content.less => ext/custom.less} | 9 - .../client/css/inc/{ => ext}/download.less | 0 .../client/css/inc/{ => ext}/filter.less | 0 src/_h5ai/client/css/inc/{ => ext}/info.less | 0 .../client/css/inc/{ => ext}/preview-aud.less | 0 .../client/css/inc/{ => ext}/preview-img.less | 0 .../client/css/inc/{ => ext}/preview-txt.less | 0 .../client/css/inc/{ => ext}/preview-vid.less | 0 .../client/css/inc/{ => ext}/preview.less | 0 src/_h5ai/client/css/inc/ext/select.less | 20 ++ src/_h5ai/client/css/inc/{ => ext}/tree.less | 0 src/_h5ai/client/css/inc/fonts.less | 6 + src/_h5ai/client/css/inc/general.less | 179 ------------------ src/_h5ai/client/css/inc/misc.less | 12 ++ src/_h5ai/client/css/inc/mixins.less | 44 +++++ src/_h5ai/client/css/styles.less | 39 +--- src/_h5ai/index.html.jade | 2 +- src/_h5ai/server/php/inc/page.php.jade | 2 +- 33 files changed, 204 insertions(+), 244 deletions(-) create mode 100644 src/_h5ai/client/css/inc/colors.less create mode 100644 src/_h5ai/client/css/inc/core/content.less rename src/_h5ai/client/css/inc/{ => core}/fallback.less (94%) create mode 100644 src/_h5ai/client/css/inc/core/mainrow.less rename src/_h5ai/client/css/inc/{ => core}/notify.less (100%) rename src/_h5ai/client/css/inc/{h5ai-info.less => core/root-info.less} (96%) create mode 100644 src/_h5ai/client/css/inc/core/root.less rename src/_h5ai/client/css/inc/{ => core}/sidebar.less (100%) rename src/_h5ai/client/css/inc/{ => core}/topbar.less (100%) rename src/_h5ai/client/css/inc/{ => core}/view-details.less (100%) rename src/_h5ai/client/css/inc/{ => core}/view-grid.less (100%) rename src/_h5ai/client/css/inc/{ => core}/view-icons.less (100%) rename src/_h5ai/client/css/inc/{ => core}/view.less (84%) rename src/_h5ai/client/css/inc/{ => ext}/contextmenu.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/crumb.less (100%) rename src/_h5ai/client/css/inc/{content.less => ext/custom.less} (69%) rename src/_h5ai/client/css/inc/{ => ext}/download.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/filter.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/info.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/preview-aud.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/preview-img.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/preview-txt.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/preview-vid.less (100%) rename src/_h5ai/client/css/inc/{ => ext}/preview.less (100%) create mode 100644 src/_h5ai/client/css/inc/ext/select.less rename src/_h5ai/client/css/inc/{ => ext}/tree.less (100%) create mode 100644 src/_h5ai/client/css/inc/fonts.less delete mode 100644 src/_h5ai/client/css/inc/general.less create mode 100644 src/_h5ai/client/css/inc/misc.less create mode 100644 src/_h5ai/client/css/inc/mixins.less diff --git a/src/_h5ai/client/css/inc/colors.less b/src/_h5ai/client/css/inc/colors.less new file mode 100644 index 00000000..25c75c5a --- /dev/null +++ b/src/_h5ai/client/css/inc/colors.less @@ -0,0 +1,58 @@ +@col-blue-200: #90caf9; +@col-blue-400: #42a5f5; +@col-blue-500: #2196F3; +@col-blue-700: #1976D2; +@col-blue-900: #0D47A1; +@col-green: #4caf50; +@col-red: #f44336; +@col-pink-a200: #ff4081; + +@col-light: #ffffff; +@col-lightgray: #fafafa; +// @col-darkgray: #eeeeee; +@col-darkgray: #f3f3f3; +// @col-dark: #333; +@col-dark: #212121; + +@col-text-primary-black: rgba(0,0,0,0.87); +@col-text-secondary-black: rgba(0,0,0,0.54); +@col-text-disabled-black: rgba(0,0,0,0.26); +@col-divider-black: rgba(0,0,0,0.12); + +@col-text-primary-white: rgba(255,255,255,1.0); +@col-text-secondary-white: rgba(255,255,255,0.7); +@col-text-disabled-white: rgba(255,255,255,0.3); +@col-divider-white: rgba(255,255,255,0.12); + +@col-text-selected: @col-text-primary-white; +@col-back-selected: @col-blue-400; + +@col-text-highlight: #111111; + +@col-font-light: @col-light; +@col-font-dark: @col-dark; + +@col-back-light: @col-lightgray; +@col-back-dark: @col-darkgray; + +@col: @col-text-primary-black; +@col-back: @col-back-dark; +@col-hover: @col-blue-400; +@col-border: rgba(0,0,0,0.05); +@col-border-strong: rgba(0,0,0,0.15); +@col-border-stronger: rgba(0,0,0,0.3); + +@col-okay: @col-green; +@col-error: @col-red; + +@col-link: @col-blue-400; +@col-link-hover: @col-blue-400; + +@col-widget-back: rgb(245,245,245); +@col-widget-back-highlight: rgba(255,255,255,0.8); +@col-widget-back-hover: rgba(255,255,255,0.8); +@col-widget-back-sel: rgba(255,255,255,0.8); +@col-widget-sep: @col-border; + +@col-range-back: rgb(224,224,224); +@col-range-thumb: #555; diff --git a/src/_h5ai/client/css/inc/core/content.less b/src/_h5ai/client/css/inc/core/content.less new file mode 100644 index 00000000..47b4194c --- /dev/null +++ b/src/_h5ai/client/css/inc/core/content.less @@ -0,0 +1,5 @@ +#content { + overflow: auto; + flex: 1 1 auto; + order: 50; +} diff --git a/src/_h5ai/client/css/inc/fallback.less b/src/_h5ai/client/css/inc/core/fallback.less similarity index 94% rename from src/_h5ai/client/css/inc/fallback.less rename to src/_h5ai/client/css/inc/core/fallback.less index 90cd03ce..3d7ab5c3 100644 --- a/src/_h5ai/client/css/inc/fallback.less +++ b/src/_h5ai/client/css/inc/core/fallback.less @@ -90,7 +90,7 @@ html.no-js, html.no-browser { - body { + #root { position: static; background: #fff; } @@ -99,3 +99,11 @@ html.no-js, html.no-browser { display: block; } } + +html.js .noJsMsg { + display: none; +} + +html.browser .noBrowserMsg { + display: none; +} diff --git a/src/_h5ai/client/css/inc/core/mainrow.less b/src/_h5ai/client/css/inc/core/mainrow.less new file mode 100644 index 00000000..cb906781 --- /dev/null +++ b/src/_h5ai/client/css/inc/core/mainrow.less @@ -0,0 +1,13 @@ +#main-row { + flex: 1 1 auto; + order: 50; + + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: flex-start; + align-content: flex-start; + align-items: stretch; + + height: 0; // non-webkit fix; +} diff --git a/src/_h5ai/client/css/inc/notify.less b/src/_h5ai/client/css/inc/core/notify.less similarity index 100% rename from src/_h5ai/client/css/inc/notify.less rename to src/_h5ai/client/css/inc/core/notify.less diff --git a/src/_h5ai/client/css/inc/h5ai-info.less b/src/_h5ai/client/css/inc/core/root-info.less similarity index 96% rename from src/_h5ai/client/css/inc/h5ai-info.less rename to src/_h5ai/client/css/inc/core/root-info.less index 0dbed8a6..47442765 100644 --- a/src/_h5ai/client/css/inc/h5ai-info.less +++ b/src/_h5ai/client/css/inc/core/root-info.less @@ -1,4 +1,4 @@ -#h5ai-info { +#root.info { #content { flex: 1 1 auto; @@ -14,7 +14,7 @@ font-family: @font-family-mono; letter-spacing: 0.05em; background-color: @col-widget-back; - border: @border-widget; + border: 1px solid @col-border; font-size: 0.9em; } @@ -36,7 +36,7 @@ padding: 6px 18px; width: 210px; background: #fafafa; - border: @border-widget; + border: 1px solid @col-border; border-radius: 4px; .paypal { diff --git a/src/_h5ai/client/css/inc/core/root.less b/src/_h5ai/client/css/inc/core/root.less new file mode 100644 index 00000000..588bd2e1 --- /dev/null +++ b/src/_h5ai/client/css/inc/core/root.less @@ -0,0 +1,20 @@ +#root { + position: absolute; + left: 0; + top: 0; + right: 0; + bottom: 0; + + font-family: @font-family; + font-size: @font-size; + font-weight: @font-weight; + color: @col-text-primary-black; + background: @col-back; + + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: flex-start; + align-content: flex-start; + align-items: stretch; +} diff --git a/src/_h5ai/client/css/inc/sidebar.less b/src/_h5ai/client/css/inc/core/sidebar.less similarity index 100% rename from src/_h5ai/client/css/inc/sidebar.less rename to src/_h5ai/client/css/inc/core/sidebar.less diff --git a/src/_h5ai/client/css/inc/topbar.less b/src/_h5ai/client/css/inc/core/topbar.less similarity index 100% rename from src/_h5ai/client/css/inc/topbar.less rename to src/_h5ai/client/css/inc/core/topbar.less diff --git a/src/_h5ai/client/css/inc/view-details.less b/src/_h5ai/client/css/inc/core/view-details.less similarity index 100% rename from src/_h5ai/client/css/inc/view-details.less rename to src/_h5ai/client/css/inc/core/view-details.less diff --git a/src/_h5ai/client/css/inc/view-grid.less b/src/_h5ai/client/css/inc/core/view-grid.less similarity index 100% rename from src/_h5ai/client/css/inc/view-grid.less rename to src/_h5ai/client/css/inc/core/view-grid.less diff --git a/src/_h5ai/client/css/inc/view-icons.less b/src/_h5ai/client/css/inc/core/view-icons.less similarity index 100% rename from src/_h5ai/client/css/inc/view-icons.less rename to src/_h5ai/client/css/inc/core/view-icons.less diff --git a/src/_h5ai/client/css/inc/view.less b/src/_h5ai/client/css/inc/core/view.less similarity index 84% rename from src/_h5ai/client/css/inc/view.less rename to src/_h5ai/client/css/inc/core/view.less index 4b71f832..0d93b841 100644 --- a/src/_h5ai/client/css/inc/view.less +++ b/src/_h5ai/client/css/inc/core/view.less @@ -1,25 +1,6 @@ -html.drag-select, html.drag-select * { - cursor: move !important; - - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -#selection-rect { - display: none; - position: absolute; - left: 0; - top: 0; - z-index: 2; - border: 1px dashed @col-border-strong; - background: rgba(0,0,0,0.1); -} - #view { + @max-icon-size: 32px; + display: none; a, a:active, a:visited { diff --git a/src/_h5ai/client/css/inc/contextmenu.less b/src/_h5ai/client/css/inc/ext/contextmenu.less similarity index 100% rename from src/_h5ai/client/css/inc/contextmenu.less rename to src/_h5ai/client/css/inc/ext/contextmenu.less diff --git a/src/_h5ai/client/css/inc/crumb.less b/src/_h5ai/client/css/inc/ext/crumb.less similarity index 100% rename from src/_h5ai/client/css/inc/crumb.less rename to src/_h5ai/client/css/inc/ext/crumb.less diff --git a/src/_h5ai/client/css/inc/content.less b/src/_h5ai/client/css/inc/ext/custom.less similarity index 69% rename from src/_h5ai/client/css/inc/content.less rename to src/_h5ai/client/css/inc/ext/custom.less index 6e4214ed..7f35e1d2 100644 --- a/src/_h5ai/client/css/inc/content.less +++ b/src/_h5ai/client/css/inc/ext/custom.less @@ -1,15 +1,6 @@ -#content { - overflow: auto; - flex: 1 1 auto; - order: 50; -} - #content-header, #content-footer { margin: 16px; color: @col; - // box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); - // background: #fafafa; - // padding: 16px; padding: 8px; a, a:active, a:visited { diff --git a/src/_h5ai/client/css/inc/download.less b/src/_h5ai/client/css/inc/ext/download.less similarity index 100% rename from src/_h5ai/client/css/inc/download.less rename to src/_h5ai/client/css/inc/ext/download.less diff --git a/src/_h5ai/client/css/inc/filter.less b/src/_h5ai/client/css/inc/ext/filter.less similarity index 100% rename from src/_h5ai/client/css/inc/filter.less rename to src/_h5ai/client/css/inc/ext/filter.less diff --git a/src/_h5ai/client/css/inc/info.less b/src/_h5ai/client/css/inc/ext/info.less similarity index 100% rename from src/_h5ai/client/css/inc/info.less rename to src/_h5ai/client/css/inc/ext/info.less diff --git a/src/_h5ai/client/css/inc/preview-aud.less b/src/_h5ai/client/css/inc/ext/preview-aud.less similarity index 100% rename from src/_h5ai/client/css/inc/preview-aud.less rename to src/_h5ai/client/css/inc/ext/preview-aud.less diff --git a/src/_h5ai/client/css/inc/preview-img.less b/src/_h5ai/client/css/inc/ext/preview-img.less similarity index 100% rename from src/_h5ai/client/css/inc/preview-img.less rename to src/_h5ai/client/css/inc/ext/preview-img.less diff --git a/src/_h5ai/client/css/inc/preview-txt.less b/src/_h5ai/client/css/inc/ext/preview-txt.less similarity index 100% rename from src/_h5ai/client/css/inc/preview-txt.less rename to src/_h5ai/client/css/inc/ext/preview-txt.less diff --git a/src/_h5ai/client/css/inc/preview-vid.less b/src/_h5ai/client/css/inc/ext/preview-vid.less similarity index 100% rename from src/_h5ai/client/css/inc/preview-vid.less rename to src/_h5ai/client/css/inc/ext/preview-vid.less diff --git a/src/_h5ai/client/css/inc/preview.less b/src/_h5ai/client/css/inc/ext/preview.less similarity index 100% rename from src/_h5ai/client/css/inc/preview.less rename to src/_h5ai/client/css/inc/ext/preview.less diff --git a/src/_h5ai/client/css/inc/ext/select.less b/src/_h5ai/client/css/inc/ext/select.less new file mode 100644 index 00000000..3d0400be --- /dev/null +++ b/src/_h5ai/client/css/inc/ext/select.less @@ -0,0 +1,20 @@ +#selection-rect { + display: none; + position: absolute; + left: 0; + top: 0; + z-index: 2; + border: 1px dashed @col-border-strong; + background: rgba(0,0,0,0.1); +} + +html.drag-select, html.drag-select * { + cursor: move !important; + + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} diff --git a/src/_h5ai/client/css/inc/tree.less b/src/_h5ai/client/css/inc/ext/tree.less similarity index 100% rename from src/_h5ai/client/css/inc/tree.less rename to src/_h5ai/client/css/inc/ext/tree.less diff --git a/src/_h5ai/client/css/inc/fonts.less b/src/_h5ai/client/css/inc/fonts.less new file mode 100644 index 00000000..52b52590 --- /dev/null +++ b/src/_h5ai/client/css/inc/fonts.less @@ -0,0 +1,6 @@ +@import url(//fonts.googleapis.com/css?family=Roboto:300,400,700); + +@font-family: Roboto, Helvetica, Arial, sans-serif; +@font-weight: normal; +@font-size: 13px; +@font-family-mono: monospace; diff --git a/src/_h5ai/client/css/inc/general.less b/src/_h5ai/client/css/inc/general.less deleted file mode 100644 index c0b250d3..00000000 --- a/src/_h5ai/client/css/inc/general.less +++ /dev/null @@ -1,179 +0,0 @@ -@col-blue-200: #90caf9; -@col-blue-400: #42a5f5; -@col-blue-500: #2196F3; -@col-blue-700: #1976D2; -@col-blue-900: #0D47A1; -@col-green: #4caf50; -@col-red: #f44336; -@col-pink-a200: #ff4081; - -@col-light: #ffffff; -@col-lightgray: #fafafa; -// @col-darkgray: #eeeeee; -@col-darkgray: #f3f3f3; -// @col-dark: #333; -@col-dark: #212121; - -@col-text-primary-black: rgba(0,0,0,0.87); -@col-text-secondary-black: rgba(0,0,0,0.54); -@col-text-disabled-black: rgba(0,0,0,0.26); -@col-divider-black: rgba(0,0,0,0.12); - -@col-text-primary-white: rgba(255,255,255,1.0); -@col-text-secondary-white: rgba(255,255,255,0.7); -@col-text-disabled-white: rgba(255,255,255,0.3); -@col-divider-white: rgba(255,255,255,0.12); - -@col-text-selected: @col-text-primary-white; -@col-back-selected: @col-blue-400; - -@col-text-highlight: #111111; - -@col-font-light: @col-light; -@col-font-dark: @col-dark; - -@col-back-light: @col-lightgray; -@col-back-dark: @col-darkgray; - -@col: @col-text-primary-black; -@col-back: @col-back-dark; -@col-hover: @col-blue-400; -@col-border: rgba(0,0,0,0.05); -@col-border-strong: rgba(0,0,0,0.15); -@col-border-stronger: rgba(0,0,0,0.3); - -@col-okay: @col-green; -@col-error: @col-red; - -@col-link: @col-blue-400; -@col-link-hover: @col-blue-400; - -@col-widget-back: rgb(245,245,245); -@col-widget-back-highlight: rgba(255,255,255,0.8); -@col-widget-back-hover: rgba(255,255,255,0.8); -@col-widget-back-sel: rgba(255,255,255,0.8); -@col-widget-sep: @col-border; - -@col-sb-back: rgba(0,0,0,0.08); -@col-sb-thumb: rgba(0,0,0,0.15); -@col-sb-thumb-active: rgba(0,0,0,0.25); - -@col-range-back: rgb(224,224,224); -@col-range-thumb: #555; - -@border-widget: 1px solid @col-border; -@border-widget-sep: 1px solid @col-widget-sep; - -@font-family: Roboto, Helvetica, Arial, sans-serif; -@font-weight: normal; -@font-size: 13px; -@font-family-mono: monospace; - -// @max-icon-size: 24px; -@max-icon-size: 32px; -// @max-icon-size: 48px; - - -::-moz-selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; } -::selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; } - - -.card() { - box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); -} - -.raised() { - box-shadow: 0 1px 10px 0 rgba(0,0,0,0.5); -} - -.popup() { - box-shadow: 0 1px 20px 0 rgba(0,0,0,0.5); -} - -.rounded() { - // overflow: hidden; - border-radius: 2px; -} - -.el-button() { - .card(); - .rounded(); - transition: all 0.2s ease-in-out; - color: @col-text-primary-white; - background: @col-blue-400; - border-radius: 2px; - cursor: pointer; - text-decoration: none; - - &:hover { - .raised(); - } -} - -.el-input() { - .card(); - .rounded(); - -moz-appearance: none; - -ms-appearance: none; - -webkit-appearance: none; - font-family: @font-family; - font-weight: @font-weight; - color: @col-text-primary-black; - background: @col-light; - border: none; - outline: none; -} - - -html { - min-height: 100%; - overflow: auto; - - &.js .noJsMsg { - display: none; - } - &.browser .noBrowserMsg { - display: none; - } -} - -body { - position: absolute; - left: 0; - top: 0; - right: 0; - bottom: 0; - - font-family: @font-family; - font-size: @font-size; - font-weight: @font-weight; - color: @col-text-primary-black; - background: @col-back; - - display: flex; - flex-direction: column; - flex-wrap: nowrap; - justify-content: flex-start; - align-content: flex-start; - align-items: stretch; -} - -#main-row { - flex: 1 1 auto; - order: 50; - - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - align-content: flex-start; - align-items: stretch; - - // non-webkit fix; - height: 0; -} - -*:focus { - // outline: 1px solid @col-pink-a200; - outline: none; -} diff --git a/src/_h5ai/client/css/inc/misc.less b/src/_h5ai/client/css/inc/misc.less new file mode 100644 index 00000000..b017320c --- /dev/null +++ b/src/_h5ai/client/css/inc/misc.less @@ -0,0 +1,12 @@ +html { + min-height: 100%; + overflow: auto; +} + +::-moz-selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; } +::selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; } + +*:focus { + // outline: 1px solid @col-pink-a200; + outline: none; +} diff --git a/src/_h5ai/client/css/inc/mixins.less b/src/_h5ai/client/css/inc/mixins.less new file mode 100644 index 00000000..3ab1e9c2 --- /dev/null +++ b/src/_h5ai/client/css/inc/mixins.less @@ -0,0 +1,44 @@ +.card() { + box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); +} + +.raised() { + box-shadow: 0 1px 10px 0 rgba(0,0,0,0.5); +} + +.popup() { + box-shadow: 0 1px 20px 0 rgba(0,0,0,0.5); +} + +.rounded() { + border-radius: 2px; +} + +.el-button() { + .card(); + .rounded(); + transition: all 0.2s ease-in-out; + color: @col-text-primary-white; + background: @col-blue-400; + border-radius: 2px; + cursor: pointer; + text-decoration: none; + + &:hover { + .raised(); + } +} + +.el-input() { + .card(); + .rounded(); + -moz-appearance: none; + -ms-appearance: none; + -webkit-appearance: none; + font-family: @font-family; + font-weight: @font-weight; + color: @col-text-primary-black; + background: @col-light; + border: none; + outline: none; +} diff --git a/src/_h5ai/client/css/styles.less b/src/_h5ai/client/css/styles.less index e9615f22..385b429f 100644 --- a/src/_h5ai/client/css/styles.less +++ b/src/_h5ai/client/css/styles.less @@ -1,33 +1,14 @@ -@import "lib/h5bp-normalize"; -@import "lib/h5bp-main-header"; +// @include "lib/h5bp-normalize.less" +// @include "lib/h5bp-main-header.less" -@import "inc/general"; -@import "inc/topbar"; -@import "inc/crumb"; -@import "inc/sidebar"; -@import "inc/download"; -@import "inc/filter"; -@import "inc/tree"; -@import "inc/info"; -@import "inc/preview"; -@import "inc/preview-aud"; -@import "inc/preview-img"; -@import "inc/preview-txt"; -@import "inc/preview-vid"; -@import "inc/notify"; +// @include "inc/colors.less" +// @include "inc/fonts.less" +// @include "inc/misc.less" +// @include "inc/mixins.less" -@import "inc/content"; -@import "inc/view"; -@import "inc/view-details"; -@import "inc/view-icons"; -@import "inc/view-grid"; -@import "inc/contextmenu"; -@import "inc/fallback"; +// @include "inc/core/*.less" +// @include "inc/ext/*.less" -@import "inc/responsive"; +// @include "inc/responsive.less" -@import "inc/h5ai-info"; - -@import "lib/h5bp-main-footer"; - -@import url(//fonts.googleapis.com/css?family=Roboto:300,400,700); +// @include "lib/h5bp-main-footer.less" diff --git a/src/_h5ai/index.html.jade b/src/_h5ai/index.html.jade index 4c79a96b..36dd17d7 100644 --- a/src/_h5ai/index.html.jade +++ b/src/_h5ai/index.html.jade @@ -13,7 +13,7 @@ head link( rel="stylesheet", href="client/css/styles.css" ) script( src="client/js/scripts.js", data-module="info" ) -body#h5ai-info +body#root.info div#fallback-hints span.noJsMsg diff --git a/src/_h5ai/server/php/inc/page.php.jade b/src/_h5ai/server/php/inc/page.php.jade index 30abbfd8..f9487f4a 100644 --- a/src/_h5ai/server/php/inc/page.php.jade +++ b/src/_h5ai/server/php/inc/page.php.jade @@ -18,7 +18,7 @@ head link( rel="stylesheet", href!="#{app_href}client/css/styles.css" ) script( src!="#{app_href}client/js/scripts.js", data-module="index" ) -body +body#root div#fallback-hints span.noJsMsg