CodeMirror/appwrite
1
0
Fork 0
mirror of synced 2024-05-21 05:02:37 +12:00
Code Issues Projects Releases Wiki Activity

Animation is off by default and turned on manually

Browse source
This commit is contained in:
Eldad Fux 2020-06-14 21:43:08 +03:00
parent 7c7a049b89
commit 56c3f3a946
9 changed files with 32 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/views/console/comps/footer.phtml
View file

@ -5,21 +5,21 @@ $version = $this->getParam('version', '').'.'.APP_CACHE_BUSTER;
<footer class="clear margin-top-large">
<ul class="copyright pull-start">
<li>
<a
<a class="link-animation-enabled"
data-analytics-event="click"
data-analytics-category="console/footer"
data-analytics-label="GitHub Link"
href="https://github.com/appwrite/appwrite" target="_blank" rel="noopener"><i class="icon-github-circled"></i> GitHub</a>
</li>
<li>
<a
<a class="link-animation-enabled"
data-analytics-event="click"
data-analytics-category="console/footer"
data-analytics-label="New GitHub Issue"
href="https://github.com/appwrite/appwrite/issues/new?body=%0A%0A%0A---%0AAppwrite Version:%20<?php echo $version; ?>" target="_blank" rel="noopener">Open an Issue</a>
</li>
<li>
<a
<a class="link-animation-enabled"
data-analytics-event="click"
data-analytics-category="console/footer"
data-analytics-label="Docs Link"

36
app/views/console/comps/header.phtml
View file

@ -1,5 +1,5 @@
<header class="clear">
<a href="/console" class="logo pull-start link-animation-disabled">
<a href="/console" class="logo pull-start">
<img src="/images/appwrite.svg" alt="Appwrite Light Logo" class="force-light" />
<img src="/images/appwrite-footer-dark.svg" alt="Appwrite Dark Logo" class="force-dark" />
</a>
@ -14,7 +14,7 @@
data-switch
data-ls-bind="{{router.params.project}}"
data-unsync="1"
data-ls-loop="projects" data-ls-as="option">
data-ls-loop="projects" data-ls-as="option" aria-label="Switch Project">
<option data-ls-attrs="value={{option.$id}}" data-ls-bind="{{option.name}}"></option>
</select>
</label>
@ -37,7 +37,7 @@
<a href="/console" class="link-return-animation--end">Back to Console &nbsp;<i class="icon-right-open"></i></a>
</div>
<div class="account link link-animation-disabled pull-end clear">
<div class="account link pull-end clear">
<img src="" data-ls-attrs="src={{account|avatar}}" alt="User Avatar" class="avatar margin-start pull-end" />
<span class="name pull-end desktops-only" data-ls-bind="{{account.name}}"></span>
</div>
@ -45,10 +45,10 @@
<div class="console-index drop-list bottom end" data-ls-ui-open="" data-button-text="" data-button-aria="Account Options" data-button-icon="" data-button-selector="[data-toggler]" data-button-class="account-button" data-blur="1">
<ul class="margin-top-large arrow-end">
<li>
<a href="/console/account" class="link-animation-disabled"><i class="icon-user"></i> &nbsp; Your Account</a>
<a href="/console/account"><i class="icon-user"></i> &nbsp; Your Account</a>
</li>
<li>
<span class="link link-animation-disabled"><i class="icon-sun-inv force-dark pull-start"></i><i class="icon-moon-inv force-light pull-start"></i> &nbsp; Change Theme
<span class="link"><i class="icon-sun-inv force-dark pull-start"></i><i class="icon-moon-inv force-light pull-start"></i> &nbsp; Change Theme
<div class="pull-end switch-theme">
<button data-general-theme
data-analytics-event="click"
@ -66,7 +66,7 @@
</div>
<nav class="project-only" data-ls-ui-open="" data-button-class="round icon-btn phones-only tablets-only" data-button-aria="Navigation" data-button-icon="icon-dot-3">
<a class="logo link-animation-disabled" href="/console"
<a class="logo" href="/console"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Logo Link">
@ -83,8 +83,7 @@
<a data-ls-attrs="href=/console/home?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Home Link"
class="link-animation-disabled">
data-analytics-label="Home Link">
<i class="icon-home"></i>
Home
</a>
@ -98,8 +97,7 @@
<a data-ls-attrs="href=/console/database?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Database Link"
class="link-animation-disabled">
data-analytics-label="Database Link">
<i class="icon-database"></i>
Database
</a>
@ -108,8 +106,7 @@
<a data-ls-attrs="href=/console/storage?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Storage Link"
class="link-animation-disabled">
data-analytics-label="Storage Link">
<i class="icon-folder"></i>
Storage
</a>
@ -118,8 +115,7 @@
<a data-ls-attrs="href=/console/users?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Users Link"
class="link-animation-disabled">
data-analytics-label="Users Link">
<i class="icon-users"></i>
Users
</a>
@ -133,8 +129,7 @@
<a data-ls-attrs="href=/console/tasks?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Tasks Link"
class="link-animation-disabled">
data-analytics-label="Tasks Link">
<i class="icon-clock"></i>
Tasks
</a>
@ -143,8 +138,7 @@
<a data-ls-attrs="href=/console/webhooks?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Webhooks Links"
class="link-animation-disabled">
data-analytics-label="Webhooks Links">
<i class="icon-link"></i>
Webhooks
</a>
@ -153,8 +147,7 @@
<a data-ls-attrs="href=/console/keys?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="API Keys Link"
class="link-animation-disabled">
data-analytics-label="API Keys Link">
<i class="icon-key-inv"></i>
API Keys
</a>
@ -167,8 +160,7 @@
<a data-ls-attrs="href=/console/settings?project={{router.params.project}}"
data-analytics-event="click"
data-analytics-category="console/navigation"
data-analytics-label="Settings Link"
class="link-animation-disabled">
data-analytics-label="Settings Link">
<i class="icon-cog"></i> Settings</a>
</li>
</ul>

2
app/views/console/database/index.phtml
View file

@ -65,7 +65,7 @@
<div data-ls-if="0 != {{project-collections.sum}}">
<ul data-ls-loop="project-collections.collections" data-ls-as="collection" data-ls-append="" class="tiles cell-3 margin-bottom-small" style="visibility: hidden">
<li class="margin-bottom">
<a data-ls-attrs="href=/console/database/collection?id={{collection.$id}}&project={{router.params.project}}" class="box link-animation-disabled">
<a data-ls-attrs="href=/console/database/collection?id={{collection.$id}}&project={{router.params.project}}" class="box">
<div data-ls-bind="{{collection.name}}" class="text-one-liner margin-bottom text-bold">&nbsp;</div>
<i class="icon-right-open"></i>

8
app/views/console/home/index.phtml
View file

@ -14,10 +14,10 @@ $graph = $this->getParam('graph', false);
</h1>
<ul class="margin-top-negative-small margin-bottom clear">
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/settings?project={{router.params.project}}"><i class="icon-cog"></i> &nbsp;Settings</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/keys?project={{router.params.project}}"><i class="icon-key-inv"></i> &nbsp;API Keys</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/webhooks?project={{router.params.project}}"><i class="icon-link"></i> &nbsp;Webhooks</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/tasks?project={{router.params.project}}"><i class="icon-clock"></i> &nbsp;Tasks</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/settings?project={{router.params.project}}" class="link-animation-enabled"><i class="icon-cog"></i> &nbsp;Settings</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/keys?project={{router.params.project}}" class="link-animation-enabled"><i class="icon-key-inv"></i> &nbsp;API Keys</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/webhooks?project={{router.params.project}}" class="link-animation-enabled"><i class="icon-link"></i> &nbsp;Webhooks</a> &nbsp;&nbsp;</li>
<li class="pull-start margin-end margin-bottom-small"><a data-ls-attrs="href=/console/tasks?project={{router.params.project}}" class="link-animation-enabled"><i class="icon-clock"></i> &nbsp;Tasks</a> &nbsp;&nbsp;</li>
<!-- <li class="pull-end margin-start margin-bottom-small text-size-small margin-top-tiny"><a data-ls-attrs="href=/console/tasks?project={{router.params.project}}">May 2020 &nbsp; <i class="icon-down-dir"></i></a></li> -->
</ul>
</div>

2
app/views/console/index.phtml
View file

@ -32,7 +32,7 @@ $home = $this->getParam('home', '');
<ul data-ls-loop="console-projects" data-ls-as="project" data-ls-append="" class="tiles cell-3" style="visibility: hidden">
<li class="margin-bottom">
<a data-ls-attrs="href=/console/home?project={{project.$id}}" class="box link-animation-disabled">
<a data-ls-attrs="href=/console/home?project={{project.$id}}" class="box">
<div data-ls-bind="{{project.name}}" class="text-one-liner margin-bottom-tiny text-bold">&nbsp;</div>
<p data-ls-if="({{project.platforms.length}})" class="text-fade text-size-small" data-ls-bind="{{project.platforms.length}} apps"></p>

2
app/views/home/comps/header.phtml
View file

@ -1,5 +1,5 @@
<div class="logo text-align-center margin-bottom-xl">
<a href="/" class="link-animation-disabled">
<a href="/">
<img src="/images/appwrite.svg" alt="Appwrite Light Logo" class="force-light" />
<img src="/images/appwrite-footer-dark.svg" alt="Appwrite Dark Logo" class="force-dark" />
</a>

2
public/dist/styles/default-ltr.css vendored
View file

File diff suppressed because one or more lines are too long

2
public/dist/styles/default-rtl.css vendored
View file

File diff suppressed because one or more lines are too long

18
public/styles/typography.less
View file

@ -18,23 +18,17 @@ a, .link {
border-left: 2px solid transparent;
border-right: 2px solid transparent;
transition: 200ms;
display: inline-block;
cursor: pointer;
&:hover {
transform: translateY(-2px);
//transform: translateY(-2px);
}
&.disabled {
opacity: .5;
}
&.disabled:hover {
.link.link-animation-disabled();
}
&.tag:hover {
.link.link-animation-disabled();
opacity: .9;
}
@ -43,16 +37,16 @@ a, .link {
}
}
a.link-animation-disabled,
.link.link-animation-disabled {
a.link-animation-enabled,
.link.link-animation-enabled {
display: inline-block;
&:hover {
transform: translateY(0);
transform: translateY(-2px);
}
}
.func-link-return-animation(@pos) {
.link.link-animation-disabled();
& > i {
display: inline-block;
transition: 200ms;