@rdlabo/ionic-theme-ios26 0.0.1 → 0.0.2

package/README.md

@@ -2,6 +2,8 @@
 
 A CSS theme library that applies iOS26 design system to Ionic applications.
 
+DEMO is here: https://ionic-theme-ios26.netlify.app/
+
 ## Overview
 
 This library provides CSS files to apply the iOS26 design system used in real projects to Ionic applications. It customizes the appearance and behavior of Ionic components based on the latest iOS26 design guidelines.
@@ -25,6 +27,7 @@ Import the theme in your project's main CSS file (e.g., `src/styles.scss`) and s
 
 ```scss
 @import '@rdlabo/ionic-theme-ios26/css/ionic-theme-ios26.css';
+@import '@rdlabo/ionic-theme-ios26/css/ion-list-inset.css';
 
 /* Required: Safe area configuration */
 :root {
@@ -43,7 +46,8 @@ Add CSS file to `angular.json`:
 ```json
 {
   "styles": [
-    "node_modules/@rdlabo/ionic-theme-ios26/css/ionic-theme-ios26.css"
+    "node_modules/@rdlabo/ionic-theme-ios26/css/ionic-theme-ios26.css",
+    "node_modules/@rdlabo/ionic-theme-ios26/css/ion-list-inset.css"
   ]
 }
 ```
@@ -62,6 +66,7 @@ Import CSS file in `index.js` or `App.js`:
 
 ```javascript
 import '@rdlabo/ionic-theme-ios26/css/ionic-theme-ios26.css';
+import '@rdlabo/ionic-theme-ios26/css/ion-list-inset.css';
 ```
 
 **Required**: Set `--max-safe-area` in main CSS file:
@@ -78,6 +83,7 @@ Import CSS file in `main.js`:
 
 ```javascript
 import '@rdlabo/ionic-theme-ios26/css/ionic-theme-ios26.css';
+import '@rdlabo/ionic-theme-ios26/css/ion-list-inset.css';
 ```
 
 **Required**: Set `--max-safe-area` in main CSS file:

package/css/ion-list-inset.css

@@ -0,0 +1,247 @@
+ion-content[color=light] ion-list:not(.list-inset),
+.ion-list-inset ion-list:not(.list-inset),
+ion-accordion ion-list:not(.list-inset) {
+  margin: 16px 0;
+  padding: 0;
+}
+ion-content[color=light] ion-list:not(.list-inset) ion-item:last-child,
+.ion-list-inset ion-list:not(.list-inset) ion-item:last-child,
+ion-accordion ion-list:not(.list-inset) ion-item:last-child {
+  --border-width: 0px;
+  --show-full-highlight: 0;
+  --inner-border-width: 0px;
+  --show-inset-highlight: 0;
+}
+ion-content[color=light] ion-list.list-inset ion-item > ion-button[slot=end] > ion-icon[slot=icon-only],
+.ion-list-inset ion-list.list-inset ion-item > ion-button[slot=end] > ion-icon[slot=icon-only],
+ion-accordion ion-list.list-inset ion-item > ion-button[slot=end] > ion-icon[slot=icon-only] {
+  font-size: 1.2rem !important;
+  transform: translateY(4px);
+}
+ion-content[color=light] ion-list.list-inset ion-item ion-text[slot=end],
+.ion-list-inset ion-list.list-inset ion-item ion-text[slot=end],
+ion-accordion ion-list.list-inset ion-item ion-text[slot=end] {
+  padding-left: 8px;
+}
+ion-content[color=light] ion-list.list-inset ion-item.item-disabled,
+.ion-list-inset ion-list.list-inset ion-item.item-disabled,
+ion-accordion ion-list.list-inset ion-item.item-disabled {
+  opacity: 1;
+}
+ion-content[color=light] ion-list.list-inset ion-item.item-disabled > *,
+.ion-list-inset ion-list.list-inset ion-item.item-disabled > *,
+ion-accordion ion-list.list-inset ion-item.item-disabled > * {
+  opacity: 0.4;
+}
+ion-content[color=light] ion-list.list-inset ion-item.item-disabled::part(detail-icon),
+.ion-list-inset ion-list.list-inset ion-item.item-disabled::part(detail-icon),
+ion-accordion ion-list.list-inset ion-item.item-disabled::part(detail-icon) {
+  opacity: 0.1;
+}
+ion-content[color=light] ion-list.list-inset.ios ion-list-header ion-label,
+.ion-list-inset ion-list.list-inset.ios ion-list-header ion-label,
+ion-accordion ion-list.list-inset.ios ion-list-header ion-label {
+  font-size: 1.1rem;
+}
+ion-content[color=light] ion-list.list-inset.md ion-list-header,
+.ion-list-inset ion-list.list-inset.md ion-list-header,
+ion-accordion ion-list.list-inset.md ion-list-header {
+  font-weight: bold;
+  margin-top: 16px;
+}
+ion-content[color=light] ion-list.list-inset.md ion-list-header ion-label,
+.ion-list-inset ion-list.list-inset.md ion-list-header ion-label,
+ion-accordion ion-list.list-inset.md ion-list-header ion-label {
+  font-size: 1.1rem;
+}
+ion-content[color=light] ion-list.list-inset.list-inset,
+.ion-list-inset ion-list.list-inset.list-inset,
+ion-accordion ion-list.list-inset.list-inset {
+  background: transparent;
+}
+ion-content[color=light] ion-list.list-inset.list-inset.md:not(:last-child),
+.ion-list-inset ion-list.list-inset.list-inset.md:not(:last-child),
+ion-accordion ion-list.list-inset.list-inset.md:not(:last-child) {
+  margin-bottom: 0;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-list-header,
+.ion-list-inset ion-list.list-inset.list-inset ion-list-header,
+ion-accordion ion-list.list-inset.list-inset ion-list-header {
+  display: flex;
+  align-items: center;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-list-header.md,
+.ion-list-inset ion-list.list-inset.list-inset ion-list-header.md,
+ion-accordion ion-list.list-inset.list-inset ion-list-header.md {
+  margin-top: 0;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-list-header ion-label,
+.ion-list-inset ion-list.list-inset.list-inset ion-list-header ion-label,
+ion-accordion ion-list.list-inset.list-inset ion-list-header ion-label {
+  font-size: 0.9rem;
+  margin: 8px 4px 4px;
+  color: var(--ion-color-medium-tint);
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-list-header ion-button,
+.ion-list-inset ion-list.list-inset.list-inset ion-list-header ion-button,
+ion-accordion ion-list.list-inset.list-inset ion-list-header ion-button {
+  margin-top: 8px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-list-header ion-note,
+.ion-list-inset ion-list.list-inset.list-inset ion-list-header ion-note,
+ion-accordion ion-list.list-inset.list-inset ion-list-header ion-note {
+  font-size: 0.9rem;
+  margin: 8px 16px 4px 0;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group.ios,
+ion-content[color=light] ion-list.list-inset.list-inset ion-reorder-group.ios,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group.ios,
+.ion-list-inset ion-list.list-inset.list-inset ion-reorder-group.ios,
+ion-accordion ion-list.list-inset.list-inset ion-item-group.ios,
+ion-accordion ion-list.list-inset.list-inset ion-reorder-group.ios {
+  border-radius: 24px;
+  overflow: hidden;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group.ios ion-item:first-child,
+ion-content[color=light] ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:first-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group.ios ion-item:first-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:first-child,
+ion-accordion ion-list.list-inset.list-inset ion-item-group.ios ion-item:first-child,
+ion-accordion ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:first-child {
+  --padding-top: 4px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group.ios ion-item:last-child,
+ion-content[color=light] ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:last-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group.ios ion-item:last-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:last-child,
+ion-accordion ion-list.list-inset.list-inset ion-item-group.ios ion-item:last-child,
+ion-accordion ion-list.list-inset.list-inset ion-reorder-group.ios ion-item:last-child {
+  --padding-bottom: 4px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > :is(ion-item, section.autocomplete):last-child,
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item-sliding:last-child ion-item,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > :is(ion-item, section.autocomplete):last-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item-sliding:last-child ion-item,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > :is(ion-item, section.autocomplete):last-child,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item-sliding:last-child ion-item {
+  --border-width: 0 !important;
+  --show-full-highlight: 0 !important;
+  --inner-border-width: 0 !important;
+  --show-inset-highlight: 0 !important;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group.not-first-child,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group.not-first-child,
+ion-accordion ion-list.list-inset.list-inset ion-item-group.not-first-child {
+  margin: 16px 0;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper {
+  width: 100%;
+  text-align: center;
+  padding: 32px 16px 16px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-icon,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-icon,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-icon {
+  font-size: 2.8rem;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper h2,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper h2,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper h2 {
+  font-size: 1rem;
+  font-weight: bold;
+  margin-top: 8px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-text,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-text,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > div.item-title-wrapper ion-text {
+  font-size: 0.9rem;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item.ios,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item.ios,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item.ios {
+  --inner-padding-end: 0;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item.ios::part(native),
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item.ios::part(native),
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item.ios::part(native) {
+  padding-right: 16px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating],
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating],
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating] {
+  transition: transform 0.2s ease;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating]:not(.label-floating),
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating]:not(.label-floating),
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating]:not(.label-floating) {
+  transform: translateY(-7px);
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating].label-floating,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating].label-floating,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.md[labelplacement=floating].label-floating {
+  transform: translateY(-4px);
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating],
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating],
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating] {
+  transition: transform 0.2s ease;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating]:not(.label-floating),
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating]:not(.label-floating),
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item > ion-input.ios[labelplacement=floating]:not(.label-floating) {
+  transform: translateY(-2px);
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-item-group > ion-item ion-button[slot=end].ion-align-self-end,
+.ion-list-inset ion-list.list-inset.list-inset ion-item-group > ion-item ion-button[slot=end].ion-align-self-end,
+ion-accordion ion-list.list-inset.list-inset ion-item-group > ion-item ion-button[slot=end].ion-align-self-end {
+  transform: translateY(-7px);
+}
+ion-content[color=light] ion-list.list-inset.list-inset > ion-note,
+ion-content[color=light] ion-list.list-inset.list-inset ion-note.note,
+.ion-list-inset ion-list.list-inset.list-inset > ion-note,
+.ion-list-inset ion-list.list-inset.list-inset ion-note.note,
+ion-accordion ion-list.list-inset.list-inset > ion-note,
+ion-accordion ion-list.list-inset.list-inset ion-note.note {
+  color: var(--ion-color-medium-tint);
+  font-size: 0.9rem;
+  display: block;
+  margin: 8px 16px;
+}
+ion-content[color=light] ion-list.list-inset.list-inset ion-note.note,
+.ion-list-inset ion-list.list-inset.list-inset ion-note.note,
+ion-accordion ion-list.list-inset.list-inset ion-note.note {
+  margin: 8px 0;
+}
+
+ion-content:not([color=light]) ion-list :not(ion-item-group) ion-item.ios:last-child {
+  --border-width: 0px 0px 0.55px 0px;
+  --inner-border-width: 0px;
+  --show-inset-highlight: 0;
+  --show-full-highlight: 1;
+}
+ion-content:not([color=light]) ion-list :not(ion-item-group) ion-item.md:last-child {
+  --border-width: 0px 0px 1px 0px;
+  --inner-border-width: 0;
+  --show-full-highlight: 1;
+  --show-inset-highlight: 0;
+}
+ion-content:not([color=light]) ion-list ion-item-group ion-item:last-child {
+  --border-width: 0px;
+  --show-full-highlight: 0;
+  --inner-border-width: 0px;
+  --show-inset-highlight: 0;
+}
+ion-content:not([color=light]) ion-list[slot=content] {
+  padding: 0;
+  margin: 0;
+}
+ion-content:not([color=light]) ion-list[slot=content] ion-item.ios:last-child {
+  --border-width: 0;
+  --inner-border-width: 0px;
+  --show-inset-highlight: 0;
+  --show-full-highlight: 0;
+}
+
+/*# sourceMappingURL=ion-list-inset.css.map */

package/css/ion-list-inset.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/assets/ion-list-inset.scss"],"names":[],"mappings":"AAGE;AAAA;AAAA;EACE;EACA;;AAIA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAIF;AAAA;AAAA;EACE;EACA;;AAIA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;;AAKN;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;EACE;EACA;;AACA;AAAA;AAAA;EACE;;AAIJ;AAAA;AAAA;EACE;;AAEA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;EACE;EACA;;AACA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;EACA;EACA;;AAEF;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;EACA;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;EACE;;AAQA;AAAA;AAAA;EACE;EACA;EACA;;AACA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;EACA;EACA;;AAEF;AAAA;AAAA;EACE;;AAGJ;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;;AAGJ;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;;AAGJ;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;;AAGJ;AAAA;AAAA;EACE;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;EACE;;;AAQJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA","file":"ion-list-inset.css"}

package/css/ionic-theme-ios26.css

@@ -1,4 +1,3 @@
-@charset "UTF-8";
 :root {
   --system-dark-rgb: 0, 0, 0;
   --system-light-rgb: 255, 255, 255;
@@ -14,7 +13,7 @@
   --system-tab-active-rgb: 255, 255, 255;
   --system-shadow-rgb: translarent;
   --system-background-rgb: 0, 0, 0;
-  --system-edge-rgb: 80, 80, 80;
+  --system-edge-rgb: 120, 120, 120;
 }
 
 .ios ion-popover {
@@ -46,6 +45,9 @@
 .ios ion-modal ion-searchbar:not(.area-searchbar) .searchbar-input-container {
   margin: 0 6px;
 }
+.ios ion-modal ion-searchbar:not(.area-searchbar) .searchbar-input-container input.searchbar-input {
+  backdrop-filter: none;
+}
 .ios ion-searchbar:not(.area-searchbar) {
   min-height: 60px;
   padding: 0;
@@ -68,7 +70,6 @@
   border-bottom: 0.5px solid rgba(var(--system-edge-rgb), 1);
   border-left: 0.5px solid rgba(var(--system-edge-rgb), 0.6);
   transition: box-shadow 0.1s ease;
-  backdrop-filter: none;
   border-radius: 20px;
   padding-inline-start: 2.4rem !important;
 }
@@ -76,61 +77,6 @@
   padding-inline-end: 2rem !important;
 }
 
-.ios app-talk-room .talk-system-message {
-  transform: translateY(-80px);
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar {
-  --border-width: 0;
-  --background: transparent;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.toolbar-blockquote {
-  position: absolute;
-  top: -56px;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.toolbar-blockquote ion-item {
-  padding: 8px 12px;
-  --inner-padding-end: 4px;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.toolbar-blockquote ion-item ion-avatar {
-  transform: translateX(-10px);
-  margin-right: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.toolbar-blockquote ion-item ion-avatar ion-icon {
-  font-size: 1.6rem;
-  color: var(--ion-color-medium-tint);
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.toolbar-blockquote ion-item::part(native) {
-  background: rgba(var(--system-light-rgb), 0.4);
-  backdrop-filter: saturate(240%) blur(6px);
-  box-shadow: inset 0 0 8px 0 rgba(var(--system-shadow-rgb), 0.2), 0 0 12px 0 rgba(var(--system-shadow-rgb), 0.8);
-  border-top: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-right: 0.5px solid rgba(var(--system-edge-rgb), 0.8);
-  border-bottom: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-left: 0.5px solid rgba(var(--system-edge-rgb), 0.6);
-  transition: box-shadow 0.1s ease;
-  border-radius: 20px;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.send-message ion-textarea.input-field {
-  transition: width 0.5s ease;
-  --padding-start: 16px;
-  --padding-end: 16px;
-}
-.ios app-talk-room ion-footer#talk-footer ion-toolbar.send-message ion-textarea.input-field label.textarea-wrapper {
-  background: rgba(var(--system-light-rgb), 0.4);
-  backdrop-filter: saturate(240%) blur(6px);
-  box-shadow: inset 0 0 8px 0 rgba(var(--system-shadow-rgb), 0.2), 0 0 12px 0 rgba(var(--system-shadow-rgb), 0.8);
-  border-top: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-right: 0.5px solid rgba(var(--system-edge-rgb), 0.8);
-  border-bottom: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-left: 0.5px solid rgba(var(--system-edge-rgb), 0.6);
-  transition: box-shadow 0.1s ease;
-  margin: 8px 8px;
-  border-radius: 32px;
-}
-
 .ios ion-fab.inner-tab-bar {
   right: calc(16px + var(--ion-safe-area-right, 0px));
   bottom: var(--max-safe-area);
@@ -193,15 +139,6 @@
   background: rgba(var(--system-shadow-rgb), 0.02);
 }
 
-.ios {
-  /**
-   * パフォーマンス対策。必ず背景が単色である限りは不要
-   */
-}
-.ios .ion-page ion-header > ion-toolbar > ion-buttons ion-button:not(.link-setting)::part(native),
-.ios .ion-page ion-header > ion-toolbar > ion-buttons ion-back-button::part(native) {
-  backdrop-filter: none !important;
-}
 .ios .ion-page ion-header > ion-toolbar > ion-buttons ion-button:not(.link-setting),
 .ios .ion-page ion-header > ion-toolbar > ion-buttons ion-back-button,
 .ios ion-buttons.liquid-glass-buttons ion-button {
@@ -210,11 +147,12 @@
   font-size: 1.05rem !important;
   transition: transform 100ms ease-out;
   will-change: transform;
+  color: var(--ion-text-color, #000);
 }
 .ios .ion-page ion-header > ion-toolbar > ion-buttons ion-button:not(.link-setting)::part(native),
 .ios .ion-page ion-header > ion-toolbar > ion-buttons ion-back-button::part(native),
 .ios ion-buttons.liquid-glass-buttons ion-button::part(native) {
-  background: rgba(var(--system-light-rgb), 0.7);
+  background: rgba(var(--system-light-rgb), 0.4);
   backdrop-filter: saturate(240%) blur(6px);
   box-shadow: inset 0 0 8px 0 rgba(var(--system-shadow-rgb), 0.2), 0 0 12px 0 rgba(var(--system-shadow-rgb), 0.8);
   border-top: 0.5px solid rgba(var(--system-edge-rgb), 1);
@@ -294,6 +232,15 @@
   border-radius: 16px;
 }
 
+ion-toggle.ios {
+  --handle-width: 38px;
+  --handle-height: 28px;
+}
+ion-toggle.ios::part(track) {
+  height: 28px;
+  width: 64px;
+}
+
 .ion-palette-dark.ios .ion-page ion-header > ion-toolbar > ion-buttons *:not(.link-setting),
 .ion-palette-dark.ios .ion-page ion-footer > ion-toolbar > ion-buttons *:not(.link-setting) {
   opacity: 1;
@@ -328,26 +275,6 @@
 .ios ion-action-sheet {
   --button-color: var(--ion-color-medium);
 }
-.ios .thread-fab ion-fab-button {
-  --background-activated: rgba(var(--system-light-rgb), 0.3);
-}
-.ios .thread-fab ion-fab-button::part(native) {
-  background: rgba(var(--system-light-rgb), 0.4);
-  backdrop-filter: saturate(240%) blur(6px);
-  box-shadow: inset 0 0 8px 0 rgba(var(--system-shadow-rgb), 0.2), 0 0 12px 0 rgba(var(--system-shadow-rgb), 0.8);
-  border-top: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-right: 0.5px solid rgba(var(--system-edge-rgb), 0.8);
-  border-bottom: 0.5px solid rgba(var(--system-edge-rgb), 1);
-  border-left: 0.5px solid rgba(var(--system-edge-rgb), 0.6);
-  transition: box-shadow 0.1s ease;
-  color: rgb(var(--system-dark-rgb));
-}
-.ios .thread-fab ion-fab-button ion-icon {
-  color: var(--ion-color-medium-shade);
-}
-.ios ion-item.suggest-seeking {
-  --padding-start: 16px !important;
-}
 .ios .can-go-back ion-header ion-toolbar:not(.md):first-child,
 .ios .enable-back-button ion-header ion-toolbar:not(.md):first-child {
   --border-width: 0;
@@ -362,6 +289,7 @@
 .ios ion-footer.footer-translucent ion-toolbar {
   --border-width: 0;
   --background: transparent;
+  --opacity: 1 !important;
 }
 .ios ion-header ion-toolbar:first-child {
   padding-right: calc(var(--ion-safe-area-right) + 4px);
@@ -396,13 +324,6 @@
 .ios .ion-page ion-header > ion-toolbar.ion-color-primary > ion-buttons *.ion-activated::part(native)::after {
   background: transparent !important;
 }
-.ios app-photo-image.ion-page ion-header > ion-toolbar > ion-buttons *::part(native),
-.ios app-editor-image.ion-page ion-header > ion-toolbar > ion-buttons *::part(native) {
-  box-shadow: none !important;
-  border-radius: 25px;
-  background: transparent !important;
-  border-width: 1px !important;
-}
 .ios .ion-page ion-content:not(.background-transparent)::after,
 .ios ion-footer.footer-translucent::after {
   content: "";
@@ -414,9 +335,15 @@
   pointer-events: none;
   z-index: 1;
 }
-.ios app-editor-image.ion-page ion-content::after,
-.ios app-photo-image.ion-page ion-content::after {
-  box-shadow: none !important;
+.ios ion-header.header-translucent::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  width: 100%;
+  height: calc(66px + var(--ion-safe-area-top));
+  box-shadow: inset 0 0 0 0 rgba(var(--system-background-rgb), 0), inset 0 calc(66px + var(--ion-safe-area-top)) 20px -20px rgba(var(--system-background-rgb), 1);
+  pointer-events: none;
+  z-index: 1;
 }
 
 /*# sourceMappingURL=ionic-theme-ios26.css.map */

package/css/ionic-theme-ios26.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../src/assets/ios-variables.scss","../src/assets/ion-popover.scss","../src/assets/ion-searchbar.scss","../src/assets/ios-talk-room.scss","../src/assets/ion-tabs.scss","../src/assets/ion-button.scss","../src/assets/ion-segment.scss","../src/assets/ios-design-dark.scss","../src/assets/ios-design.scss"],"names":[],"mappings":";AAAA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACZA;EACE;;AAKE;EDUJ;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;ECjBM;EACA;;AAGJ;EACE;;AACA;EACE;;;ACfN;EACE;EACA;;AAKE;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;EFVN;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EEIM;EACA;EACA;;AAEF;EACE;;;ACjCJ;EACE;;AAGA;EACE;EACA;;AAEF;EACE;EACA;;AACA;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AAGJ;EHVR;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EGGU;;AAKJ;EACE;EACA;EACA;;AACA;EHrBR;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EGcU;EACA;;;ACxCV;EACE;EACA;;AACA;EAKE;;AAJA;EJYJ;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EInBM;;AAMN;EJIA;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EIXE;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EACE;;AAGF;EAIE;EACA;;AAJA;EACE;;AAIF;EACE;;AAIA;EACE;EACA;EACA;EACA;;AAGF;EACE;;;ACpDV;AACE;AAAA;AAAA;;AAKE;AAAA;EACE;;AAIJ;AAAA;AAAA;EAGE;EAKA;EAEA;EAEA;EACA;;AATA;AAAA;AAAA;ELEF;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EKTI;;AAQF;AAAA;AAAA;EACE;EACA;;AAMF;AAAA;AAAA;EACE;EACA,YACE;;AAIF;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;EL1BR;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EKmBQ;;AAOJ;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;AAAA;AAAA;EACE;;AAMJ;AAAA;AAAA;EACE;EACA;;;ACtEJ;EACE;EACA;;AAEA;EACE;;;ACFJ;AAAA;EACE;;AACA;AAAA;EACE;;AAKF;AAAA;EPmBJ;EACA;EACA;EACA;EACA;;AOpBI;AAAA;EACE;;AAKF;AAAA;EACE;;;ACZN;EACE;;AAGF;EACE;;AAGF;EACE;;AAIA;EAQE;;AAPA;ERNJ;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EQDM;;AAEF;EACE;;AAON;EACE;;AAGF;AAAA;EAEE;;AAIA;AAAA;AAAA;AAAA;EAEE;;AAEF;AAAA;EACE;EACA;;AAGJ;EACE;EACA;;AAEF;EACE;;AAIA;EACE;EACA;;AAEF;EACE;;AAKA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;AACA;EACE;;AAGA;EACE;;AAQJ;AAAA;EACE;EACA;EACA;EACA;;AAKN;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,YACE;EAEF;EACA;;AAEF;AAAA;EAEE","file":"ionic-theme-ios26.css"}
+{"version":3,"sourceRoot":"","sources":["../src/assets/ios-variables.scss","../src/assets/ios-design/ion-popover.scss","../src/assets/ios-design/ion-searchbar.scss","../src/assets/ios-design/ion-tabs.scss","../src/assets/ios-design/ion-button.scss","../src/assets/ios-design/ion-segment.scss","../src/assets/ios-design/ion-toggle.scss","../src/assets/ios-design/ios-design-dark.scss","../src/assets/ios-design.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;ACZA;EACE;;AAKE;EDUJ;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;ECjBM;EACA;;AAGJ;EACE;;AACA;EACE;;;ACfN;EACE;EACA;;AAKE;EACE;;AACA;EAEE;;AAMR;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AACA;EACE;EFdN;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EEOM;EACA;;AAEF;EACE;;;ACpCN;EACE;EACA;;AACA;EAKE;;AAJA;EHYJ;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EGnBM;;AAMN;EHIA;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EGXE;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EACE;;AAGF;EAIE;EACA;;AAJA;EACE;;AAIF;EACE;;AAIA;EACE;EACA;EACA;EACA;;AAGF;EACE;;;ACnDR;AAAA;AAAA;EAGE;EAKA;EAEA;EAEA;EACA;EACA;;AAVA;AAAA;AAAA;EJYF;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EInBI;;AASF;AAAA;AAAA;EACE;EACA;;AAMF;AAAA;AAAA;EACE;EACA,YACE;;AAIF;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;EACE;EJjBR;EACA;EACA,YACE;EAEF;EACA;EACA;EACA;EACA;EIUQ;;AAOJ;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;EACE;;AACA;AAAA;AAAA;AAAA;AAAA;EACE;;AAMJ;AAAA;AAAA;EACE;EACA;;;AC7DJ;EACE;EACA;;AAEA;EACE;;;ACPR;EACE;EACA;;AACA;EACE;EACA;;;ACAA;AAAA;EACE;;AACA;AAAA;EACE;;AAKF;AAAA;EPmBJ;EACA;EACA;EACA;EACA;;AOpBI;AAAA;EACE;;AAKF;AAAA;EACE;;;ACZN;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;;AAIA;AAAA;AAAA;AAAA;EAEE;;AAEF;AAAA;EACE;EACA;EACA;;AAGJ;EACE;EACA;;AAEF;EACE;;AAIA;EACE;EACA;;AAEF;EACE;;AAKA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;AACA;EACE;;AAGA;EACE;;AAKR;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,YACE;EAEF;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA,YACE;EAEF;EACA","file":"ionic-theme-ios26.css"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rdlabo/ionic-theme-ios26",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "exports": {
     "./css/*": {
       "style": "./css/*"

package/src/assets/ion-list-inset.scss

@@ -0,0 +1,198 @@
+ion-content[color='light'],
+.ion-list-inset,
+ion-accordion {
+  ion-list:not(.list-inset) {
+    margin: 16px 0;
+    padding: 0;
+    //border-top: 1px solid var(--ion-color-light-shade);
+    //border-bottom: 1px solid var(--ion-color-light-shade);
+
+    ion-item:last-child {
+      --border-width: 0px;
+      --show-full-highlight: 0;
+      --inner-border-width: 0px;
+      --show-inset-highlight: 0;
+    }
+  }
+  ion-list.list-inset {
+    ion-item > ion-button[slot='end'] > ion-icon[slot='icon-only'] {
+      font-size: 1.2rem !important;
+      transform: translateY(4px);
+    }
+
+    ion-item {
+      ion-text[slot='end'] {
+        padding-left: 8px;
+      }
+      &.item-disabled {
+        opacity: 1;
+        & > * {
+          opacity: 0.4;
+        }
+        &::part(detail-icon) {
+          opacity: 0.1;
+        }
+      }
+    }
+
+    &.ios ion-list-header ion-label {
+      font-size: 1.1rem;
+    }
+
+    &.md ion-list-header {
+      font-weight: bold;
+      margin-top: 16px;
+      ion-label {
+        font-size: 1.1rem;
+      }
+    }
+
+    &.list-inset {
+      background: transparent;
+
+      &.md:not(:last-child) {
+        margin-bottom: 0;
+      }
+
+      ion-list-header {
+        display: flex;
+        align-items: center;
+        &.md {
+          margin-top: 0;
+        }
+        ion-label {
+          font-size: 0.9rem;
+          margin: 8px 4px 4px;
+          color: var(--ion-color-medium-tint);
+        }
+        ion-button {
+          margin-top: 8px;
+        }
+        ion-note {
+          font-size: 0.9rem;
+          margin: 8px 16px 4px 0;
+        }
+      }
+
+      ion-item-group.ios,
+      ion-reorder-group.ios {
+        border-radius: 24px;
+        overflow: hidden;
+
+        ion-item:first-child {
+          --padding-top: 4px;
+        }
+        ion-item:last-child {
+          --padding-bottom: 4px;
+        }
+      }
+
+      ion-item-group > :is(ion-item, section.autocomplete):last-child,
+      ion-item-group > ion-item-sliding:last-child ion-item {
+        --border-width: 0 !important;
+        --show-full-highlight: 0 !important;
+        --inner-border-width: 0 !important;
+        --show-inset-highlight: 0 !important;
+      }
+
+      ion-item-group.not-first-child {
+        margin: 16px 0;
+      }
+
+      & > ion-item > ion-list > ion-item {
+        // 入れ子にしてるコンテンツ
+      }
+
+      ion-item-group > ion-item {
+        & > div.item-title-wrapper {
+          width: 100%;
+          text-align: center;
+          padding: 32px 16px 16px;
+          ion-icon {
+            font-size: 2.8rem;
+          }
+          h2 {
+            font-size: 1rem;
+            font-weight: bold;
+            margin-top: 8px;
+          }
+          ion-text {
+            font-size: 0.9rem;
+          }
+        }
+        &.ios {
+          --inner-padding-end: 0;
+          &::part(native) {
+            padding-right: 16px;
+          }
+        }
+        & > ion-input.md[labelplacement='floating'] {
+          transition: transform 0.2s ease;
+          &:not(.label-floating) {
+            transform: translateY(-7px);
+          }
+          &.label-floating {
+            transform: translateY(-4px);
+          }
+        }
+        & > ion-input.ios[labelplacement='floating'] {
+          transition: transform 0.2s ease;
+          &:not(.label-floating) {
+            transform: translateY(-2px);
+          }
+        }
+        & ion-button[slot='end'].ion-align-self-end {
+          transform: translateY(-7px);
+        }
+      }
+
+      & > ion-note,
+      ion-note.note {
+        color: var(--ion-color-medium-tint);
+        font-size: 0.9rem;
+        display: block;
+        margin: 8px 16px;
+      }
+
+      ion-note.note {
+        margin: 8px 0;
+      }
+    }
+  }
+}
+
+ion-content:not([color='light']) {
+  ion-list :not(ion-item-group) {
+    ion-item.ios:last-child {
+      --border-width: #{0px 0px 0.55px 0px};
+      --inner-border-width: 0px;
+      --show-inset-highlight: 0;
+      --show-full-highlight: 1;
+    }
+
+    ion-item.md:last-child {
+      --border-width: #{0px 0px 1px 0px};
+      --inner-border-width: 0;
+      --show-full-highlight: 1;
+      --show-inset-highlight: 0;
+    }
+  }
+
+  ion-list ion-item-group ion-item:last-child {
+    --border-width: 0px;
+    --show-full-highlight: 0;
+    --inner-border-width: 0px;
+    --show-inset-highlight: 0;
+  }
+
+  ion-list[slot='content'] {
+    padding: 0;
+    margin: 0;
+    ion-item.ios:last-child {
+      --border-width: 0;
+      --inner-border-width: 0px;
+      --show-inset-highlight: 0;
+      --show-full-highlight: 0;
+    }
+  }
+}

package/src/assets/{ion-button.scss → ios-design/ion-button.scss}

@@ -1,22 +1,12 @@
-@use 'ios-variables';
+@use '../ios-variables';
 
 .ios {
-  /**
-   * パフォーマンス対策。必ず背景が単色である限りは不要
-   */
-  .ion-page ion-header > ion-toolbar > ion-buttons ion-button:not(.link-setting),
-  .ion-page ion-header > ion-toolbar > ion-buttons ion-back-button {
-    &::part(native) {
-      backdrop-filter: none !important;
-    }
-  }
-
   .ion-page ion-header > ion-toolbar > ion-buttons ion-button:not(.link-setting),
   .ion-page ion-header > ion-toolbar > ion-buttons ion-back-button,
   ion-buttons.liquid-glass-buttons ion-button {
     max-height: inherit;
     &::part(native) {
-      @include ios-variables.glass-background(0.7);
+      @include ios-variables.glass-background();
       border-radius: 25px;
     }
     margin: 8px;
@@ -25,6 +15,7 @@
 
     transition: transform 100ms ease-out;
     will-change: transform;
+    color: var(--ion-text-color, #000);
     &.ion-activated {
       transform: scale(1.2);
       box-shadow: none;

package/src/assets/{ion-popover.scss → ios-design/ion-popover.scss}

@@ -1,4 +1,4 @@
-@use 'ios-variables';
+@use '../ios-variables';
 
 .ios {
   ion-popover {

package/src/assets/{ion-searchbar.scss → ios-design/ion-searchbar.scss}

@@ -1,4 +1,4 @@
-@use 'ios-variables';
+@use '../ios-variables';
 
 .ios {
   .toolbar-searchbar::part(container) {
@@ -10,6 +10,10 @@
     ion-searchbar:not(.area-searchbar) {
       .searchbar-input-container {
         margin: 0 6px;
+        input.searchbar-input {
+          // Modal表示でのアイコン非表示の不具合の対応
+          backdrop-filter: none;
+        }
       }
     }
   }
@@ -29,8 +33,6 @@
       input.searchbar-input {
         min-height: 44px;
         @include ios-variables.glass-background;
-        // Modal表示でのアイコン非表示の不具合の対応
-        backdrop-filter: none;
         border-radius: 20px;
         padding-inline-start: 2.4rem !important;
       }

package/src/assets/{ion-tabs.scss → ios-design/ion-tabs.scss}

@@ -1,4 +1,4 @@
-@use 'ios-variables';
+@use '../ios-variables';
 
 .ios {
   ion-fab.inner-tab-bar {

package/src/assets/ios-design/ion-toggle.scss

@@ -0,0 +1,8 @@
+ion-toggle.ios {
+  --handle-width: 38px;
+  --handle-height: 28px;
+  &::part(track) {
+    height: 28px;
+    width: 64px;
+  }
+}

package/src/assets/{ios-design-dark.scss → ios-design/ios-design-dark.scss}

@@ -1,4 +1,4 @@
-@use 'ios-variables';
+@use '../ios-variables';
 
 .ion-palette-dark.ios {
   .ion-page ion-header > ion-toolbar > ion-buttons *,

package/src/assets/ios-design.scss

@@ -1,12 +1,12 @@
 @use 'ios-variables';
 
-@use 'ion-popover';
-@use 'ion-searchbar';
-@use 'ios-talk-room';
-@use 'ion-tabs';
-@use 'ion-button';
-@use 'ion-segment';
-@use 'ios-design-dark';
+@use 'ios-design/ion-popover';
+@use 'ios-design/ion-searchbar';
+@use 'ios-design/ion-tabs';
+@use 'ios-design/ion-button';
+@use 'ios-design/ion-segment';
+@use 'ios-design/ion-toggle';
+@use 'ios-design/ios-design-dark';
 
 .ios {
   ion-toast {
@@ -21,24 +21,6 @@
     --button-color: var(--ion-color-medium);
   }
 
-  .thread-fab {
-    ion-fab-button {
-      &::part(native) {
-        @include ios-variables.glass-background;
-        color: rgb(var(--system-dark-rgb));
-      }
-      ion-icon {
-        color: var(--ion-color-medium-shade);
-      }
-      --background-activated: rgba(var(--system-light-rgb), 0.3);
-    }
-  }
-
-  // tweet action toolbar
-  ion-item.suggest-seeking {
-    --padding-start: 16px !important;
-  }
-
   .can-go-back ion-header ion-toolbar:not(.md):first-child,
   .enable-back-button ion-header ion-toolbar:not(.md):first-child {
     --border-width: 0;
@@ -52,6 +34,7 @@
     ion-toolbar {
       --border-width: 0;
       --background: transparent;
+      --opacity: 1 !important;
     }
   }
   ion-header ion-toolbar:first-child {
@@ -99,18 +82,6 @@
       }
     }
   }
-  app-photo-image,
-  app-editor-image {
-    &.ion-page ion-header > ion-toolbar > ion-buttons * {
-      &::part(native) {
-        box-shadow: none !important;
-        border-radius: 25px;
-        background: transparent !important;
-        border-width: 1px !important;
-      }
-    }
-  }
-
   .ion-page ion-content:not(.background-transparent)::after,
   ion-footer.footer-translucent::after {
     content: '';
@@ -124,8 +95,16 @@
     pointer-events: none;
     z-index: 1;
   }
-  app-editor-image.ion-page ion-content::after,
-  app-photo-image.ion-page ion-content::after {
-    box-shadow: none !important;
+  ion-header.header-translucent::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    width: 100%;
+    height: calc(66px + var(--ion-safe-area-top));
+    box-shadow:
+      inset 0 0 0 0 rgba(var(--system-background-rgb), 0),
+      inset 0 calc(66px + var(--ion-safe-area-top)) 20px -20px rgba(var(--system-background-rgb), 1);
+    pointer-events: none;
+    z-index: 1;
   }
 }

package/src/assets/ios-variables.scss

@@ -13,7 +13,7 @@
   --system-tab-active-rgb: 255, 255, 255;
   --system-shadow-rgb: translarent;
   --system-background-rgb: 0, 0, 0;
-  --system-edge-rgb: 80, 80, 80;
+  --system-edge-rgb: 120, 120, 120;
 }
 
 @mixin glass-background($opacity: 0.4, $blur: 6px) {

package/src/assets/ios-talk-room.scss

@@ -1,50 +0,0 @@
-@use 'ios-variables';
-
-.ios {
-  app-talk-room {
-    .talk-system-message {
-      transform: translateY(-80px);
-    }
-    ion-footer#talk-footer {
-      ion-toolbar {
-        --border-width: 0;
-        --background: transparent;
-      }
-      ion-toolbar.toolbar-blockquote {
-        position: absolute;
-        top: -56px;
-        ion-item {
-          padding: 8px 12px;
-          --inner-padding-end: 4px;
-          ion-avatar {
-            transform: translateX(-10px);
-            margin-right: 4px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            ion-icon {
-              font-size: 1.6rem;
-              color: var(--ion-color-medium-tint);
-            }
-          }
-          &::part(native) {
-            @include ios-variables.glass-background;
-            border-radius: 20px;
-          }
-        }
-      }
-      ion-toolbar.send-message {
-        ion-textarea.input-field {
-          transition: width 0.5s ease;
-          --padding-start: 16px;
-          --padding-end: 16px;
-          label.textarea-wrapper {
-            @include ios-variables.glass-background;
-            margin: 8px 8px;
-            border-radius: 32px;
-          }
-        }
-      }
-    }
-  }
-}