UI enhancements
This commit is contained in:
sairaj mote
parent
42762d944b
commit
dbe59026f7
30
css/main.css
30
css/main.css
@ -117,6 +117,13 @@ button,
|
||||
color: rgba(var(--background-color), 1);
|
||||
}
|
||||
|
||||
.cta {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.icon-only {
|
||||
padding: 0.5rem;
|
||||
border-radius: 0.3rem;
|
||||
@ -569,7 +576,6 @@ sm-copy {
|
||||
}
|
||||
|
||||
#main {
|
||||
overflow-y: hidden;
|
||||
display: grid;
|
||||
height: 100%;
|
||||
grid-template-rows: auto 1fr;
|
||||
@ -647,29 +653,30 @@ theme-toggle {
|
||||
padding: 0.8rem 0.5rem;
|
||||
color: inherit;
|
||||
font-size: 0.8rem;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
border-radius: 0.5rem;
|
||||
min-width: 4rem;
|
||||
width: 5rem;
|
||||
text-align: center;
|
||||
background-color: rgba(var(--text-color), 0.02);
|
||||
}
|
||||
.category .icon {
|
||||
margin-bottom: 1rem;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
.category:hover .icon {
|
||||
transform: scale(1.3);
|
||||
fill: var(--accent-color);
|
||||
}
|
||||
.category span {
|
||||
margin-top: 0.5rem;
|
||||
.category div {
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
#query_results_list,
|
||||
#written_article_list {
|
||||
margin: 1rem 0;
|
||||
padding-bottom: 2rem;
|
||||
gap: 1.6rem;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.article-card {
|
||||
@ -685,9 +692,9 @@ theme-toggle {
|
||||
line-height: 1.4;
|
||||
}
|
||||
.article-card__category {
|
||||
border: solid thin rgba(var(--text-color), 0.3);
|
||||
border: solid thin rgba(var(--text-color), 0.5);
|
||||
margin-right: 0.5rem;
|
||||
border-radius: 1rem;
|
||||
border-radius: 0.3rem;
|
||||
font-size: 0.8rem;
|
||||
padding: 0.3rem 0.6rem;
|
||||
font-weight: 700;
|
||||
@ -719,6 +726,7 @@ theme-toggle {
|
||||
}
|
||||
|
||||
#explore {
|
||||
align-items: flex-start;
|
||||
padding-top: 1.5rem;
|
||||
}
|
||||
|
||||
@ -901,12 +909,6 @@ theme-toggle {
|
||||
grid-row: span 2;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
.request-card .publish-button {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.article-row {
|
||||
align-items: center;
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -115,6 +115,12 @@ button,
|
||||
color: rgba(var(--background-color), 1);
|
||||
}
|
||||
}
|
||||
.cta {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.icon-only {
|
||||
padding: 0.5rem;
|
||||
border-radius: 0.3rem;
|
||||
@ -539,7 +545,6 @@ sm-copy {
|
||||
}
|
||||
|
||||
#main {
|
||||
overflow-y: hidden;
|
||||
display: grid;
|
||||
height: 100%;
|
||||
grid-template-rows: auto 1fr;
|
||||
@ -611,13 +616,14 @@ theme-toggle {
|
||||
padding: 0.8rem 0.5rem;
|
||||
color: inherit;
|
||||
font-size: 0.8rem;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
border-radius: 0.5rem;
|
||||
min-width: 4rem;
|
||||
width: 5rem;
|
||||
text-align: center;
|
||||
background-color: rgba(var(--text-color), 0.02);
|
||||
.icon {
|
||||
margin-bottom: 1rem;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
&:hover {
|
||||
@ -626,8 +632,8 @@ theme-toggle {
|
||||
fill: var(--accent-color);
|
||||
}
|
||||
}
|
||||
span {
|
||||
margin-top: 0.5rem;
|
||||
div {
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@ -635,7 +641,7 @@ theme-toggle {
|
||||
#written_article_list {
|
||||
margin: 1rem 0;
|
||||
padding-bottom: 2rem;
|
||||
gap: 1.6rem;
|
||||
gap: 2rem;
|
||||
}
|
||||
.article-card {
|
||||
gap: 0.3rem;
|
||||
@ -649,9 +655,9 @@ theme-toggle {
|
||||
line-height: 1.4;
|
||||
}
|
||||
&__category {
|
||||
border: solid thin rgba(var(--text-color), 0.3);
|
||||
border: solid thin rgba(var(--text-color), 0.5);
|
||||
margin-right: 0.5rem;
|
||||
border-radius: 1rem;
|
||||
border-radius: 0.3rem;
|
||||
font-size: 0.8rem;
|
||||
padding: 0.3rem 0.6rem;
|
||||
font-weight: 700;
|
||||
@ -683,6 +689,7 @@ theme-toggle {
|
||||
}
|
||||
|
||||
#explore {
|
||||
align-items: flex-start;
|
||||
padding-top: 1.5rem;
|
||||
}
|
||||
|
||||
@ -860,12 +867,6 @@ theme-toggle {
|
||||
grid-row: span 2;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
.publish-button {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.article-row {
|
||||
|
||||
95
index.html
95
index.html
@ -177,7 +177,7 @@
|
||||
</section>
|
||||
</article>
|
||||
<article id="explore" class="page page-layout hide">
|
||||
<section class="flex direction-column">
|
||||
<section class="grid gap-1-5">
|
||||
<h1 id="explore_heading">Explore</h1>
|
||||
<div id="query_results_list" class="grid observe-empty-state"></div>
|
||||
<p class="empty-state">No related articles</p>
|
||||
@ -284,7 +284,7 @@
|
||||
<p class="empty-state">No requests</p>
|
||||
</section>
|
||||
<section id="writers_section" class="admin-section hide">
|
||||
<button id="add_writer_button" class="floating-button" onclick="showAddWriterPopup()">
|
||||
<button id="add_writer_button" class="floating-button cta" onclick="showAddWriterPopup()">
|
||||
<svg class="icon button__icon--left" xmlns="http://www.w3.org/2000/svg" height="24px"
|
||||
viewBox="0 0 24 24" width="24px" fill="#000000">
|
||||
<path d="M0 0h24v24H0V0z" fill="none" />
|
||||
@ -333,7 +333,7 @@
|
||||
<sm-form>
|
||||
<sm-input id="private_key_field" type="password" placeholder="FLO private key"
|
||||
error-text="Private key is invalid" data-private-key autofocus required></sm-input>
|
||||
<sm-button id="sign_in_button" variant="primary" disabled>Sign In</sm-button>
|
||||
<sm-button id="sign_in_button" class="cta" variant="primary" disabled>Sign In</sm-button>
|
||||
</sm-form>
|
||||
<div class="grid gap-0-5">
|
||||
<p>New here? Generate your FLO credentials below to continue</p>
|
||||
@ -435,15 +435,7 @@
|
||||
</div>
|
||||
<div class="grid gap-0-5">
|
||||
<h5>Select category</h5>
|
||||
<sm-select id="edit_category">
|
||||
<sm-option value="art">Art</sm-option>
|
||||
<sm-option value="culture">Culture</sm-option>
|
||||
<sm-option value="entertainment">Entertainment</sm-option>
|
||||
<sm-option value="politics">Politics</sm-option>
|
||||
<sm-option value="science">Science</sm-option>
|
||||
<sm-option value="sports">Sports</sm-option>
|
||||
<sm-option value="tech">Tech</sm-option>
|
||||
</sm-select>
|
||||
<sm-select id="edit_category"></sm-select>
|
||||
</div>
|
||||
<div class="grid gap-0-5">
|
||||
<h5>Summary</h5>
|
||||
@ -463,7 +455,8 @@
|
||||
<h5>Publishing date</h5>
|
||||
<input type="datetime-local" id="edit_published">
|
||||
</label>
|
||||
<sm-button id="set_article_meta" onclick="defineArticle()" variant="primary">Save</sm-button>
|
||||
<sm-button id="set_article_meta" class="cta" onclick="defineArticle()" variant="primary">Save
|
||||
</sm-button>
|
||||
</div>
|
||||
</section>
|
||||
</sm-popup>
|
||||
@ -495,7 +488,7 @@
|
||||
<h5 class="label">Bio</h5>
|
||||
<sm-textarea id="get_writer_bio" rows="2"></sm-textarea>
|
||||
</div>
|
||||
<sm-button id="save_writer" variant="primary" onclick="saveWriter()">Add writer</sm-button>
|
||||
<sm-button id="save_writer" variant="primary" class="cta" onclick="saveWriter()">Add writer</sm-button>
|
||||
</sm-form>
|
||||
</sm-popup>
|
||||
<sm-popup id="user_popup">
|
||||
@ -532,7 +525,7 @@
|
||||
<h5>My FLO ID</h5>
|
||||
<sm-copy id="user_flo_id"></sm-copy>
|
||||
</div>
|
||||
<sm-button class="danger" onclick="signOut()">Sign out</sm-button>
|
||||
<sm-button class="danger cta" onclick="signOut()">Sign out</sm-button>
|
||||
</div>
|
||||
<a href="#/dashboard" class="button hide admin-option" onclick="hidePopup()">Admin dashboard</a>
|
||||
</section>
|
||||
@ -610,7 +603,7 @@
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<button class="button button--primary publish-button">Publish</button>
|
||||
<button class="button button--primary publish-button cta">Publish</button>
|
||||
</div>
|
||||
</li>
|
||||
</template>
|
||||
@ -1165,35 +1158,47 @@
|
||||
return arr
|
||||
}
|
||||
|
||||
const categories = [
|
||||
{
|
||||
title: 'Art & Culture',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g><g><g><path d="M12,22C6.49,22,2,17.51,2,12S6.49,2,12,2s10,4.04,10,9c0,3.31-2.69,6-6,6h-1.77c-0.28,0-0.5,0.22-0.5,0.5 c0,0.12,0.05,0.23,0.13,0.33c0.41,0.47,0.64,1.06,0.64,1.67C14.5,20.88,13.38,22,12,22z M12,4c-4.41,0-8,3.59-8,8s3.59,8,8,8 c0.28,0,0.5-0.22,0.5-0.5c0-0.16-0.08-0.28-0.14-0.35c-0.41-0.46-0.63-1.05-0.63-1.65c0-1.38,1.12-2.5,2.5-2.5H16 c2.21,0,4-1.79,4-4C20,7.14,16.41,4,12,4z"/><circle cx="6.5" cy="11.5" r="1.5"/><circle cx="9.5" cy="7.5" r="1.5"/><circle cx="14.5" cy="7.5" r="1.5"/><circle cx="17.5" cy="11.5" r="1.5"/></g></g></g></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Biography',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24" x="0"/></g><g><path d="M22.47,5.2C22,4.96,21.51,4.76,21,4.59v12.03C19.86,16.21,18.69,16,17.5,16c-1.9,0-3.78,0.54-5.5,1.58V5.48 C10.38,4.55,8.51,4,6.5,4C4.71,4,3.02,4.44,1.53,5.2C1.2,5.36,1,5.71,1,6.08v12.08c0,0.58,0.47,0.99,1,0.99 c0.16,0,0.32-0.04,0.48-0.12C3.69,18.4,5.05,18,6.5,18c2.07,0,3.98,0.82,5.5,2c1.52-1.18,3.43-2,5.5-2c1.45,0,2.81,0.4,4.02,1.04 c0.16,0.08,0.32,0.12,0.48,0.12c0.52,0,1-0.41,1-0.99V6.08C23,5.71,22.8,5.36,22.47,5.2z M10,16.62C8.86,16.21,7.69,16,6.5,16 c-1.19,0-2.36,0.21-3.5,0.62V6.71C4.11,6.24,5.28,6,6.5,6C7.7,6,8.89,6.25,10,6.72V16.62z M19,0.5l-5,5V15l5-4.5V0.5z"/></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Business',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M20 7h-4V5l-2-2h-4L8 5v2H4c-1.1 0-2 .9-2 2v5c0 .75.4 1.38 1 1.73V19c0 1.11.89 2 2 2h14c1.11 0 2-.89 2-2v-3.28c.59-.35 1-.99 1-1.72V9c0-1.1-.9-2-2-2zM10 5h4v2h-4V5zM4 9h16v5h-5v-3H9v3H4V9zm9 6h-2v-2h2v2zm6 4H5v-3h4v1h6v-1h4v3z"/></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Crypto & Blockchain',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><rect fill="none" height="24" width="24"/><path d="M22,11V3h-7v3H9V3H2v8h7V8h2v10h4v3h7v-8h-7v3h-2V8h2v3H22z M7,9H4V5h3V9z M17,15h3v4h-3V15z M17,5h3v4h-3V5z"/></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Discover',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-5.5-2.5l7.51-3.49L17.5 6.5 9.99 9.99 6.5 17.5zm5.5-6.6c.61 0 1.1.49 1.1 1.1s-.49 1.1-1.1 1.1-1.1-.49-1.1-1.1.49-1.1 1.1-1.1z"/></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Fiction',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g/><g><path d="M12,3c-0.46,0-0.93,0.04-1.4,0.14C7.84,3.67,5.64,5.9,5.12,8.66c-0.48,2.61,0.48,5.01,2.22,6.56 C7.77,15.6,8,16.13,8,16.69V19c0,1.1,0.9,2,2,2h0.28c0.35,0.6,0.98,1,1.72,1s1.38-0.4,1.72-1H14c1.1,0,2-0.9,2-2v-2.31 c0-0.55,0.22-1.09,0.64-1.46C18.09,13.95,19,12.08,19,10C19,6.13,15.87,3,12,3z M14,17h-4v-1h4V17z M10,19v-1h4v1H10z M15.31,13.74c-0.09,0.08-0.16,0.18-0.24,0.26H8.92c-0.08-0.09-0.15-0.19-0.24-0.27c-1.32-1.18-1.91-2.94-1.59-4.7 c0.36-1.94,1.96-3.55,3.89-3.93C11.32,5.03,11.66,5,12,5c2.76,0,5,2.24,5,5C17,11.43,16.39,12.79,15.31,13.74z"/></g><g><rect height="3" width="1" x="11.5" y="11"/><rect height="3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.0312 10.8536)" width="1" x="10.59" y="8.79"/><rect height="3" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 14.7678 26.7028)" width="1" x="12.41" y="8.79"/></g></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'History & Politics',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M6.5 10h-2v7h2v-7zm6 0h-2v7h2v-7zm8.5 9H2v2h19v-2zm-2.5-9h-2v7h2v-7zm-7-6.74L16.71 6H6.29l5.21-2.74m0-2.26L2 6v2h19V6l-9.5-5z"/></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Science & Tech',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M19.93,8.35l-3.6,1.68L14,7.7V6.3l2.33-2.33l3.6,1.68c0.38,0.18,0.82,0.01,1-0.36c0.18-0.38,0.01-0.82-0.36-1l-3.92-1.83 c-0.38-0.18-0.83-0.1-1.13,0.2L13.78,4.4C13.6,4.16,13.32,4,13,4c-0.55,0-1,0.45-1,1v1H8.82C8.4,4.84,7.3,4,6,4C4.34,4,3,5.34,3,7 c0,1.1,0.6,2.05,1.48,2.58L7.08,18H6c-1.1,0-2,0.9-2,2v1h13v-1c0-1.1-0.9-2-2-2h-1.62L8.41,8.77C8.58,8.53,8.72,8.28,8.82,8H12v1 c0,0.55,0.45,1,1,1c0.32,0,0.6-0.16,0.78-0.4l1.74,1.74c0.3,0.3,0.75,0.38,1.13,0.2l3.92-1.83c0.38-0.18,0.54-0.62,0.36-1 C20.75,8.34,20.31,8.17,19.93,8.35z M6,8C5.45,8,5,7.55,5,7c0-0.55,0.45-1,1-1s1,0.45,1,1C7,7.55,6.55,8,6,8z M11.11,18H9.17 l-2.46-8h0.1L11.11,18z"/></g></svg>`
|
||||
}
|
||||
]
|
||||
function renderHomepage() {
|
||||
const frag = document.createDocumentFragment()
|
||||
// Render article topics
|
||||
const categories = [
|
||||
{
|
||||
title: 'Art',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g><g><g><path d="M12,22C6.49,22,2,17.51,2,12S6.49,2,12,2s10,4.04,10,9c0,3.31-2.69,6-6,6h-1.77c-0.28,0-0.5,0.22-0.5,0.5 c0,0.12,0.05,0.23,0.13,0.33c0.41,0.47,0.64,1.06,0.64,1.67C14.5,20.88,13.38,22,12,22z M12,4c-4.41,0-8,3.59-8,8s3.59,8,8,8 c0.28,0,0.5-0.22,0.5-0.5c0-0.16-0.08-0.28-0.14-0.35c-0.41-0.46-0.63-1.05-0.63-1.65c0-1.38,1.12-2.5,2.5-2.5H16 c2.21,0,4-1.79,4-4C20,7.14,16.41,4,12,4z"/><circle cx="6.5" cy="11.5" r="1.5"/><circle cx="9.5" cy="7.5" r="1.5"/><circle cx="14.5" cy="7.5" r="1.5"/><circle cx="17.5" cy="11.5" r="1.5"/></g></g></g></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Culture',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g><circle cx="19" cy="6.5" r="1"/><circle cx="15" cy="6.5" r="1"/><path d="M16.99,9c-1.38,0-2.5,0.84-2.5,1.88h5C19.49,9.84,18.37,9,16.99,9z"/><path d="M1,16c0,3.31,2.69,6,6,6s6-2.69,6-6V9H1V16z M3,11h8v5c0,2.21-1.79,4-4,4s-4-1.79-4-4V11z"/><path d="M11,2v5.5h2V4h8v5c0,2.21-1.79,4-4,4c-0.95,0-1.81-0.35-2.5-0.9v2.35C15.26,14.8,16.11,15,17,15c3.31,0,6-2.69,6-6V2H11z"/><circle cx="5" cy="13.5" r="1"/><circle cx="9" cy="13.5" r="1"/><path d="M7,17.88c1.38,0,2.5-0.84,2.5-1.88h-5C4.5,17.04,5.62,17.88,7,17.88z"/></g></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Politics',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M6.5 10h-2v7h2v-7zm6 0h-2v7h2v-7zm8.5 9H2v2h19v-2zm-2.5-9h-2v7h2v-7zm-7-6.74L16.71 6H6.29l5.21-2.74m0-2.26L2 6v2h19V6l-9.5-5z"/></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Science',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M13,11.33L18,18H6l5-6.67V6h2 M15.96,4H8.04C7.62,4,7.39,4.48,7.65,4.81L9,6.5v4.17L3.2,18.4C2.71,19.06,3.18,20,4,20h16 c0.82,0,1.29-0.94,0.8-1.6L15,10.67V6.5l1.35-1.69C16.61,4.48,16.38,4,15.96,4L15.96,4z"/></g></svg>`
|
||||
},
|
||||
{
|
||||
title: 'Tech',
|
||||
icon: `<svg class="icon" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M19.93,8.35l-3.6,1.68L14,7.7V6.3l2.33-2.33l3.6,1.68c0.38,0.18,0.82,0.01,1-0.36c0.18-0.38,0.01-0.82-0.36-1l-3.92-1.83 c-0.38-0.18-0.83-0.1-1.13,0.2L13.78,4.4C13.6,4.16,13.32,4,13,4c-0.55,0-1,0.45-1,1v1H8.82C8.4,4.84,7.3,4,6,4C4.34,4,3,5.34,3,7 c0,1.1,0.6,2.05,1.48,2.58L7.08,18H6c-1.1,0-2,0.9-2,2v1h13v-1c0-1.1-0.9-2-2-2h-1.62L8.41,8.77C8.58,8.53,8.72,8.28,8.82,8H12v1 c0,0.55,0.45,1,1,1c0.32,0,0.6-0.16,0.78-0.4l1.74,1.74c0.3,0.3,0.75,0.38,1.13,0.2l3.92-1.83c0.38-0.18,0.54-0.62,0.36-1 C20.75,8.34,20.31,8.17,19.93,8.35z M6,8C5.45,8,5,7.55,5,7c0-0.55,0.45-1,1-1s1,0.45,1,1C7,7.55,6.55,8,6,8z M11.11,18H9.17 l-2.46-8h0.1L11.11,18z"/></g></svg>`
|
||||
}
|
||||
]
|
||||
categories.forEach(({ title, icon }) => frag.append(createElement('a', {
|
||||
attributes: { href: `#/explore?type=category&query=${title.toLowerCase()}` },
|
||||
className: 'category interact',
|
||||
innerHTML: `${icon}<span>${title}</span>`,
|
||||
innerHTML: `${icon}<div>${title}</div>`,
|
||||
})))
|
||||
getRef('news_categories_list').innerHTML = ''
|
||||
getRef('news_categories_list').append(frag)
|
||||
@ -1696,6 +1701,15 @@
|
||||
}
|
||||
getRef('approved_ids').innerHTML = ''
|
||||
getRef('approved_ids').append(frag)
|
||||
|
||||
categories.forEach(({ title }) => {
|
||||
frag.append(createElement('sm-option', {
|
||||
textContent: title,
|
||||
attributes: { value: title.toLowerCase() }
|
||||
}))
|
||||
})
|
||||
getRef('edit_category').innerHTML = ''
|
||||
getRef('edit_category').append(frag)
|
||||
}
|
||||
|
||||
function publishArticle(vc) {
|
||||
@ -1728,6 +1742,9 @@
|
||||
floCloudAPI.updateObjectData('articlesContent'),
|
||||
]).then(() => {
|
||||
notify(`${isPublished ? 'Updated' : 'Published'} article`, 'success')
|
||||
if (!isPublished) {
|
||||
getRef('article_analytics').prepend(render.articleRow(articleID))
|
||||
}
|
||||
document.querySelector(`.request-card[data-vc="${vc}"]`).remove()
|
||||
hidePopup()
|
||||
})
|
||||
|
||||
Loading…
Reference in New Issue
Block a user