Qortal/qortal-ui
1
0
Fork 0
mirror of https://github.com/Qortal/qortal-ui.git synced 2025-03-27 15:55:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix Lit

Browse Source
This commit is contained in:
AlphaX-Projects 2022-03-08 00:20:55 -08:00 committed by GitHub
parent 3d8151ceb1
commit 026fe3d674
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 2 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
qortal-ui-core/src/styles/app-styles.js
View File

@ -1,19 +1,9 @@
import { LitElement, html } from 'lit-element' import { LitElement, html } from 'lit'
// import '../styles/styles.scss'
import './styles.scss' import './styles.scss'
import './app-theme.js' import './app-theme.js'
class AppStyles extends LitElement { class AppStyles extends LitElement {
// static get styles () {
// return [
// css`
// html, * {
// color: var(--color, green);
// }
// `
// ]
// }
/* Disable shadow DOM, so that the styles DO bleed */ /* Disable shadow DOM, so that the styles DO bleed */
createRenderRoot () { createRenderRoot () {
@ -23,12 +13,6 @@ class AppStyles extends LitElement {
render () { render () {
return html` return html`
<style> <style>
/* NOT THE IDEAL SOLUTION. Would be better to compile sass and inline it here...
someone can do this for me at some point...or I could */
/* https://material.io/develop/web/components/layout-grid/ */
/* @import url('/'); */
* { * {
/* from https://codepen.io/sdthornton/pen/wBZdXq/ */ /* from https://codepen.io/sdthornton/pen/wBZdXq/ */
--shadow-1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); --shadow-1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
@ -36,7 +20,6 @@ class AppStyles extends LitElement {
--shadow-3: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); --shadow-3: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
--shadow-4: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); --shadow-4: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
--shadow-5: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22); --shadow-5: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
--paper-input-container-focus-color: var(--mdc-theme-secondary); --paper-input-container-focus-color: var(--mdc-theme-secondary);
font-family: "Roboto", sans-serif; font-family: "Roboto", sans-serif;
@ -65,20 +48,15 @@ class AppStyles extends LitElement {
_windowResized () { _windowResized () {
const ua = navigator.userAgent const ua = navigator.userAgent
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua) const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(ua)
// console.log(isMobile, 'MOBILE')
const isChrome = /Chrome/i.test(ua) const isChrome = /Chrome/i.test(ua)
const isSafari = /Version\/[\d\.]+.*Safari/.test(ua) const isSafari = /Version\/[\d\.]+.*Safari/.test(ua)
if (isMobile && isChrome) { if (isMobile && isChrome) {
this.windowHeight = html`calc(100vh - 56px)` this.windowHeight = html`calc(100vh - 56px)`
// document.body.style.setProperty('--window-height', 'calc(100vh - 56px)')
// console.log('not same')
} else if (isMobile && isSafari) { } else if (isMobile && isSafari) {
this.windowHeight = html`calc(100vh - 72px)` this.windowHeight = html`calc(100vh - 72px)`
} else { } else {
this.windowHeight = html`100vh` this.windowHeight = html`100vh`
// document.body.style.setProperty('--window-height', '100vh')
// console.log('same')
} }
} }
} }

11
qortal-ui-core/src/styles/app-theme.js
View File

@ -1,17 +1,8 @@
import { LitElement, html } from 'lit-element' import { LitElement, html } from 'lit'
import { connect } from 'pwa-helpers' import { connect } from 'pwa-helpers'
import { store } from '../store.js' import { store } from '../store.js'
class AppTheme extends connect(store)(LitElement) { class AppTheme extends connect(store)(LitElement) {
// static get styles () {
// return [
// css`
// html, * {
// color: var(--color, green);
// }
// `
// ]
// }
static get properties () { static get properties () {
return { return {