Skip to content

Commit

Permalink
export custom theme styles
Browse files Browse the repository at this point in the history
including smui theme -- since bundling @smui/select results in it not being picked up by smui-theme in consuming module
  • Loading branch information
Sean Wilson committed Oct 27, 2023
1 parent fc6e8f2 commit 9e77555
Show file tree
Hide file tree
Showing 5 changed files with 79 additions and 5 deletions.
5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
"scripts": {
"dev": "vite dev",
"build": "vite build && npm run package",
"build:theme": "smui-theme compile static/smui.css -i src/theme",
"build:theme": "smui-theme compile static/smui.css -i src/theme && sass --no-source-map src/theme/_custom.scss:static/custom.css",
"build:static": "npm run build --static && npm run build:theme",
"preview": "vite preview",
"package": "svelte-kit sync && svelte-package && publint",
Expand All @@ -29,7 +29,8 @@
"types": "./dist/index.d.ts",
"main": "./dist/index.js",
"svelte": "./dist/index.js"
}
},
"./theme/default": "./static/theme.scss"
},
"files": [
"dist",
Expand Down
4 changes: 2 additions & 2 deletions src/app.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<!-- SMUI Styles -->
<link rel="stylesheet" href="smui.css" />
<!-- SMUI Styles & custom theming -->
<link rel="stylesheet" href="theme.css" />
<!-- Material Icons -->
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
<!-- Roboto -->
Expand Down
1 change: 0 additions & 1 deletion src/routes/+page.svelte
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
<script lang="ts">
import "../theme/_custom.scss"
import { tick } from 'svelte';
import TabBar from "@smui/tab-bar"
import Tab, { Label } from "@smui/tab"
Expand Down
72 changes: 72 additions & 0 deletions static/custom.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
.jsonschema-form-control.smui-paper {
padding: 0;
}

.control-object.smui-accordion > .smui-paper > .smui-accordion__header,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header {
background-color: #E4E4E4;
color: #6B6B6B;
border-radius: 6px;
align-items: center;
min-height: 36px;
}
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title {
display: inline-flex;
align-items: center;
padding-left: 2px;
}
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-object-title,
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-array-title,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-object-title,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-array-title {
padding-left: 8px;
text-transform: uppercase;
}
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description {
font-style: italic;
opacity: 1;
}
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description {
padding-top: 1px;
padding-bottom: 1px;
}
.control-object.smui-accordion > .smui-paper > .smui-accordion__header .mdc-icon-button,
.control-array.smui-accordion > .smui-paper > .smui-accordion__header .mdc-icon-button {
display: inline-flex;
height: 34px;
justify-content: center;
}
.jsonschema-form > .smui-paper > .smui-paper__content > .control-object.smui-accordion > .smui-paper > .smui-accordion__header,
.jsonschema-form > .smui-paper > .smui-paper__content > .control-array.smui-accordion > .smui-paper > .smui-accordion__header {
background-color: #6B6B6B;
color: #FFFFFF;
}
.control-object.smui-accordion > .smui-paper.no-disable > .smui-accordion__header,
.control-array.smui-accordion > .smui-paper.no-disable > .smui-accordion__header {
padding-left: 18px;
}

.control-array .control-array-items > li {
border-bottom: #707070 solid 1px;
padding: 0.5rem 0;
}

.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__title.smui-accordion__header__title--with-description {
flex: 1;
max-width: unset;
}
.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__description {
min-width: 60%;
}
.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__description:empty {
display: none;
}

.control-anyof .smui-paper__title {
margin-bottom: 1rem;
}
2 changes: 2 additions & 0 deletions static/theme.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
@import url("smui.css");
@import url("custom.css");

0 comments on commit 9e77555

Please sign in to comment.