Public/automatic
1
0
Fork 0
mirror of https://github.com/vladmandic/automatic synced 2026-09-19 17:24:32 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2440 from iDeNoh/mobile-css-fix

Browse Source 
mobile css fixes
This commit is contained in:
Vladimir Mandic
2023-11-06 10:13:22 -05:00
committed by GitHub
parent 152f45925e 7190a62995
commit 7d5a07ad45
7 changed files with 29 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
javascript/amethyst-nightfall.css
+1 -2
View File
@@ -2,7 +2,6 @@
:root {
--font: "Source Sans Pro", 'ui-sans-serif', 'system-ui', sans-serif;
--font-size: 16px;
--left-column: 500px;
--highlight-color: #8a3df6; /* Purple color */
--inactive-color: #404040; /* Darker shade of gray */
--background-color: #000000; /* Black */
@@ -288,7 +287,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
--prose-header-text-weight: 600;
--slider-color: ;
--table-radius: var(--radius-lg);
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/black-orange.css
+1 -2
View File
@@ -4,7 +4,6 @@
--font: 'NotoSans';
--font-mono: 'ui-monospace', 'Consolas', monospace;
--font-size: 16px;
--left-column: 500px;
--highlight-color: #ce6400;
--inactive-color: #4e1400;
--background-color: #000000;
@@ -298,7 +297,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
--prose-header-text-weight: 600;
--slider-color: ;
--table-radius: var(--radius-lg);
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/black-teal.css
+2 -3
View File
@@ -4,7 +4,6 @@
--font: 'NotoSans';
--font-mono: 'ui-monospace', 'Consolas', monospace;
--font-size: 16px;
--left-column: 500px;
--primary-50: #7dffff;
--primary-100: #72e8e8;
--primary-200: #67d2d2;
@@ -39,7 +38,7 @@ html { font-size: var(--font-size); font-family: var(--font); }
body, button, input, select, textarea { font-family: var(--font); }
button { font-size: 1.2rem; max-width: 400px; }
img { background-color: var(--background-color); }
input[type=range] { height: var(--line-sm) !important; appearance: none !important; margin-top: 0 !important; min-width: 160px !important;
input[type=range] { height: var(--line-sm) !important; appearance: none !important; margin-top: 0 !important; min-width: 100% !important;
background-color: var(--background-color) !important; width: 100% !important; background: transparent !important; }
input[type=range]::-webkit-slider-runnable-track { width: 100% !important; height: var(--line-sm) !important; cursor: pointer !important; box-shadow: 2px 2px 3px #111111 !important;
background: var(--input-background-fill) !important; border-radius: var(--radius-lg) !important; border: 0px solid #222222 !important; }
@@ -290,7 +289,7 @@ textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8p
--prose-header-text-weight: 400;
--slider-color: ;
--table-radius: var(--radius-lg);
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/invoked.css
+1 -2
View File
@@ -3,7 +3,6 @@
--font: 'system-ui', 'ui-sans-serif', 'system-ui', "Roboto", sans-serif;
--font-mono: 'ui-monospace', 'Consolas', monospace;
--font-size: 16px;
--left-column: 500px;
--primary-100: #2b303b;
--primary-200: #15181e;
--primary-300: #0a0c0e;
@@ -282,7 +281,7 @@ button.selected {background: var(--button-primary-background-fill);}
--prose-header-text-weight: 600;
--slider-color: ;
--table-radius: var(--radius-lg);
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/light-teal.css
+1 -2
View File
@@ -4,7 +4,6 @@
--font: 'NotoSans';
--font-mono: 'ui-monospace', 'Consolas', monospace;
--font-size: 16px;
--left-column: 500px;
--primary-50: #7dffff;
--primary-100: #72e8e8;
--primary-200: #67d2d2;
@@ -174,7 +173,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
--button-cancel-border-color: #dc2626;
--button-cancel-text-color-hover: var(--button-cancel-text-color);
--button-cancel-text-color: white;
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/midnight-barbie.css
+1 -2
View File
@@ -3,7 +3,6 @@
--font: "Source Sans Pro", 'ui-sans-serif', 'system-ui', "Roboto", sans-serif;
--font-mono: 'IBM Plex Mono', 'ui-monospace', 'Consolas', monospace;
--font-size: 14px;
--left-column: 500px;
--highlight-color: #ff00f2;
--inactive-color: #005485;
--background-color: #000000;
@@ -287,7 +286,7 @@ svg.feather.feather-image, .feather .feather-image { display: none }
--prose-header-text-weight: 600;
--slider-color: ;
--table-radius: var(--radius-lg);
--button-large-padding: 2px 10px;
--button-large-padding: 2px 6px;
--button-large-radius: var(--radius-lg);
--button-large-text-size: var(--text-lg);
--button-large-text-weight: 400;
javascript/sdnext.css
+22 -1
View File
@@ -277,5 +277,26 @@ table.settings-value-table td { padding: 0.4em; border: 1px solid #ccc; max-widt
--spacing-sm: 3px;
--spacing-lg: 4px;
--spacing-xl: 5px;
--spacing-xxl: 6px;
--spacing-xxl: 6px;
}
/* Apply different styles for devices with coarse pointers */
@media (hover: none) and (pointer: coarse) {
/* Screens 400px and smaller */
@media (max-width: 425px) {
:root, .light, .dark { --left-column: 100%; }
#settings {display: flex;gap: var(--layout-gap);flex-wrap: wrap;flex-direction: row;}
.gradio-slider input[type="number"] { width: 4em; font-size: 0.8rem; height: 16px; text-align: center; }
}
/* Screens 400px and larger up to 1080px */
@media (max-width: 1080px) and (min-width:425px) {
:root, .light, .dark { --left-column: 39%; }
#scripts_alwayson_txt2img div { max-width: 99%; }
#settings {display: flex;gap: var(--layout-gap);flex-wrap: wrap;flex-direction: row;}
.gradio-slider input[type="number"] { width: 4em; font-size: 0.8rem; height: 16px; text-align: center; }
}
}