update text and now panel
This commit is contained in:
156
app/styles.css
156
app/styles.css
@@ -1183,13 +1183,15 @@
|
||||
gap: 12px;
|
||||
align-items: start;
|
||||
}
|
||||
.planet-meta-card {
|
||||
.planet-meta-card,
|
||||
.detail-meta-card {
|
||||
border: 1px solid #3f3f46;
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
background: #111118;
|
||||
}
|
||||
.planet-meta-card strong {
|
||||
.planet-meta-card strong,
|
||||
.detail-meta-card strong {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: #a1a1aa;
|
||||
@@ -3173,9 +3175,36 @@
|
||||
.alpha-text-controls {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
padding: 12px;
|
||||
border-top: 1px solid #27272a;
|
||||
background: #101018;
|
||||
}
|
||||
|
||||
.alpha-text-detail-heading {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
padding-right: 108px;
|
||||
}
|
||||
|
||||
.alpha-text-heading-main {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.alpha-text-heading-tools {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(260px, 420px) minmax(320px, 1fr);
|
||||
gap: 12px;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.alpha-text-controls--heading {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
padding: 14px;
|
||||
border: 1px solid #2f2f39;
|
||||
border-radius: 14px;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(24, 24, 38, 0.98), rgba(12, 12, 18, 0.98));
|
||||
box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.08);
|
||||
box-sizing: border-box;
|
||||
align-content: start;
|
||||
}
|
||||
|
||||
.alpha-text-search-controls {
|
||||
@@ -3197,6 +3226,36 @@
|
||||
background:
|
||||
linear-gradient(180deg, rgba(24, 24, 38, 0.98), rgba(12, 12, 18, 0.98));
|
||||
box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.08);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.alpha-text-search-controls--heading {
|
||||
align-content: start;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.alpha-text-search-inline {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
gap: 8px;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.alpha-text-search-submit-inline {
|
||||
min-height: 42px;
|
||||
padding: 0 14px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
white-space: nowrap;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.alpha-text-detail-heading .detail-toggle-inline {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.alpha-text-control {
|
||||
@@ -3212,6 +3271,7 @@
|
||||
|
||||
.alpha-text-select {
|
||||
width: 100%;
|
||||
min-height: 42px;
|
||||
padding: 7px 8px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #3f3f46;
|
||||
@@ -3223,6 +3283,7 @@
|
||||
|
||||
.alpha-text-search-input {
|
||||
width: 100%;
|
||||
min-height: 42px;
|
||||
padding: 9px 10px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #4338ca;
|
||||
@@ -3269,6 +3330,31 @@
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1040px) {
|
||||
.alpha-text-heading-tools {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.alpha-text-detail-heading {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.alpha-text-controls--heading {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.alpha-text-search-inline {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.alpha-text-detail-heading .detail-toggle-inline {
|
||||
position: static;
|
||||
justify-self: start;
|
||||
}
|
||||
}
|
||||
|
||||
.alpha-text-meta-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||||
@@ -3276,6 +3362,30 @@
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.alpha-text-extra-card {
|
||||
align-content: start;
|
||||
}
|
||||
|
||||
.alpha-text-extra-group {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.alpha-text-extra-group + .alpha-text-extra-group {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.alpha-text-extra-label {
|
||||
color: #a1a1aa;
|
||||
font-size: 11px;
|
||||
letter-spacing: 0.03em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.alpha-text-extra-actions {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.alpha-text-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -3289,6 +3399,24 @@
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.alpha-text-reader-card {
|
||||
display: grid;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.alpha-text-reader-navigation {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
margin-top: 16px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid #27272a;
|
||||
}
|
||||
|
||||
.alpha-text-reader-nav-btn--next {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.alpha-text-search-summary {
|
||||
margin: 0 0 10px;
|
||||
color: #a1a1aa;
|
||||
@@ -3410,6 +3538,16 @@
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
.alpha-text-verse-text--original {
|
||||
color: #f5f3ff;
|
||||
font-family: var(--font-script-arabic), "Noto Serif", serif;
|
||||
}
|
||||
|
||||
.alpha-text-verse-text--transliteration {
|
||||
color: #cbd5f5;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.alpha-text-token-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -4629,11 +4767,11 @@
|
||||
font-weight: 700;
|
||||
}
|
||||
.now-stats-sabian {
|
||||
font-size: clamp(17px, 2.5vmin, 23px);
|
||||
font-weight: 550;
|
||||
line-height: 1.32;
|
||||
font-size: clamp(13px, 1.75vmin, 16px);
|
||||
font-weight: 500;
|
||||
line-height: 1.42;
|
||||
color: #f8fafc;
|
||||
white-space: pre-line;
|
||||
white-space: normal;
|
||||
overflow: visible;
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user