Appwrite/appwrite
1
0 Fork 0
mirror of https://github.com/appwrite/appwrite.git synced 2026-05-26 13:51:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

DB UI - Work in progress

Browse Source
This commit is contained in:
Eldad Fux committed 2020-04-03 22:27:18 +03:00
1 parent 0ab706a443
commit 01c93b2d0a
9 files changed
+148 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/views/console/database/collection.phtml
+58 -9
View File
@@ -211,7 +211,7 @@
</div>
</div>
</div>
<label data-ls-attrs="for=rule-type-{{rule.$id}}">Rule Type</label>
<select data-ls-attrs="id=rule-type-{{rule.$id}}" name="type" required data-ls-bind="{{rule.type}}">
@@ -225,13 +225,9 @@
<option value="email">Email</option>
<option value="url">URL</option>
<option value="ip">IP</option>
<option value="document">Document</option>
</optgroup>
</select>
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-{{rule.$id}}">Default</label>
<input name="default" type="text" data-ls-bind="{{rule.default}}" />
</div>
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-ls-bind="{{rule.required}}" data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
@@ -240,6 +236,8 @@
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-ls-bind="{{rule.array}}" data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<div data-ls-template="template-validation-{{rule.type}}" data-type="script" class="margin-bottom"></div>
</fieldset>
<button type="button" data-remove="" class="reverse danger margin-bottom">Remove</button>
@@ -304,7 +302,7 @@
<div data-ui-modal class="box modal close" data-button-alias="none" data-open-event="add-rule">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Attribute</h1>
<h1>Add Rule</h1>
<form
data-analytics-event="submit"
@@ -352,9 +350,15 @@
<option value="email">Email</option>
<option value="url">URL</option>
<option value="ip">IP</option>
<option value="document">Document</option>
</optgroup>
</select>
<input name="default" type="hidden" value="" />
<input name="required" type="hidden" value="false" data-cast-to="boolean" />
<input name="array" type="hidden" value="false" data-cast-to="boolean" />
<!--
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-new">Default</label>
<input name="default" type="text" />
@@ -367,7 +371,7 @@
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
</div> -->
</fieldset>
@@ -379,4 +383,49 @@
</li>
</ul>
</div>
</div>
<script type="text/html" id="template-validation-text">
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-{{rule.$id}}">Default Value</label>
<input name="default" type="text" data-ls-bind="{{rule.default}}" />
</div>
</script>
<script type="text/html" id="template-validation-numeric">
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-{{rule.$id}}">Default Value</label>
<input name="default" type="number" data-ls-bind="{{rule.default}}" data-cast-to="integer" placeholder="0" />
</div>
</script>
<script type="text/html" id="template-validation-boolean">
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-{{rule.$id}}">Default Value</label>
<input name="default" data-ls-bind="{{rule.default}}" type="hidden" data-forms-switch data-cast-to="boolean" />
</div>
</script>
<script type="text/html" id="template-validation-text">
<div class="margin-bottom">
<label data-ls-attrs="for=rule-default-{{rule.$id}}">Default Value</label>
<input name="default" type="text" data-ls-bind="{{rule.default}}" />
</div>
</script>
<script type="text/html" id="template-validation-document">
<label data-ls-attrs="for=rule-list-{{rule.$id}}" class="margin-bottom">Allowed Collections</label>
<div data-ls-loop="project-collections.collections" data-ls-as="project" class="tiles cell-3 margin-bottom-negative" style="visibility: hidden">
<div class="margin-bottom">
<input type="checkbox" name="list" data-ls-attrs="value={{project.$id}}" data-ls-bind="{{rule.list}}" /> <span data-ls-bind="{{project.name}}"></span>
</div>
</div>
</script>
<div class="margin-top"
data-service="database.listCollections"
data-event="load,database.createCollection,database.updateCollection,database.deleteCollection"
data-scope="sdk"
data-name="project-collections">
</div>
app/views/console/database/document.phtml
+70 -7
View File
@@ -166,29 +166,85 @@ $list = [
[
'key' => '',
'bind' => ' data-ls-bind="{{project-document|documentLabel}}"',
'bind' => '{{project-document|documentLabel}}',
],
[
'key' => '-array',
'bind' => ' data-ls-bind="{{node}}"',
'bind' => '{{node}}',
],
];
?>
<?php foreach($list as $mode): ?>
<script type="text/html" id="template-string-form<?php echo $mode['key']; ?>">
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="text" autocomplete="off"<?php echo $mode['bind']; ?> data-forms-text-direction data-forms-text-count />
<script type="text/html" id="template-document-form<?php echo $mode['key']; ?>">
<div class="info margin-bottom-small">
<div class="">document link here</div>
</div>
<button type="button" class="reverse margin-end-small">Add</button>
<button type="button" class="reverse">Search</button>
</script>
<script type="text/html" id="xtemplate-document-form<?php echo $mode['key']; ?>">
<fieldset data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" data-cast-to="object">
<input name="$id" type="hidden" data-ls-bind="{{project-document.$id}}" />
<input name="$collection" type="hidden" data-ls-bind="{{project-collection.$id}}" />
<ul data-ls-loop="project-collection.rules" data-ls-as="rule">
<li>
<label class="margin-bottom-no">
<span data-ls-bind="{{rule.label}}"></span>
<span data-ls-if="{{rule.array}}.toString() == 'true'">
<span class="text-size-small text-fade">&nbsp;&nbsp;(Array)</span>
</span>
</label>
<div data-ls-if="{{rule.required}}.toString() == 'true'" class="margin-bottom-small">
<span class="text-size-xs text-danger text-fade">required</span>
</div>
<div data-ls-if="({{rule.required}}.toString() == 'false')" class="margin-bottom-small">
<span class="text-size-xs text-fade">optional</span>
</div>
<div data-ls-if="({{rule.array}}.toString() == 'false')">
<div data-ls-template="template-{{rule.type}}-form" data-type="script" class="margin-bottom"></div>
</div>
<div data-ls-if="({{rule.array}}.toString() == 'true')">
<div data-ls-template="template-array-form" data-type="script" class="margin-bottom"></div>
</div>
</li>
</ul>
</fieldset>
</script>
<script type="text/html" id="template-text-form<?php echo $mode['key']; ?>">
<textarea data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="text" autocomplete="off"<?php echo $mode['bind']; ?> data-forms-text-direction data-forms-text-count></textarea>
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="text" autocomplete="off" data-ls-bind="<?php echo $mode['bind']; ?>" data-forms-text-direction data-forms-text-count />
</script>
<script type="text/html" id="template-string-form<?php echo $mode['key']; ?>">
<textarea data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="text" autocomplete="off" data-ls-bind="<?php echo $mode['bind']; ?>" data-forms-text-direction data-forms-text-count></textarea>
</script>
<script type="text/html" id="template-numeric-form<?php echo $mode['key']; ?>">
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="number" autocomplete="off"<?php echo $mode['bind']; ?> data-cast-to="integer" />
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="number" autocomplete="off" data-ls-bind="<?php echo $mode['bind']; ?>" data-cast-to="integer" />
</script>
<script type="text/html" id="template-boolean-form<?php echo $mode['key']; ?>">
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="hidden" data-forms-switch<?php echo $mode['bind']; ?> data-cast-to="boolean" />
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="hidden" data-forms-switch data-ls-bind="<?php echo $mode['bind']; ?>" data-cast-to="boolean" />
</script>
<script type="text/html" id="template-url-form<?php echo $mode['key']; ?>">
<input data-ls-attrs="name={{rule.key}},{{rule.required|documentRequired}}" type="url" data-ls-bind="<?php echo $mode['bind']; ?>" />
<div class="preview" data-ls-if="(<?php echo $mode['bind']; ?>.toString() !== '')">
</div>
</script>
<?php endforeach; ?>
@@ -220,4 +276,11 @@ $list = [
</li>
</ul>
</script>
</script>
<div class="margin-top"
data-service="database.listCollections"
data-event="load,database.createCollection,database.updateCollection,database.deleteCollection"
data-scope="sdk"
data-name="project-collections">
</div>
app/views/console/home/index.phtml
+4 -4
View File
@@ -140,16 +140,16 @@ $graph = $this->getParam('graph', false);
<div class="drop-list pull-start" data-ls-ui-open="" data-button-text="Add Platform" data-button-class="button" data-blur="1" tabindex="1">
<ul>
<li>
<div class="link web-new"><img src="/images/clients/web.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Web Platform Logo" class="avatar xs margin-end" /> New Web App</div>
<button class="link web-new"><img src="/images/clients/web.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Web Platform Logo" class="avatar xs margin-end" /> New Web App</button>
</li>
<li class="disabled">
<div class="link ios-new"><img src="/images/clients/ios.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="iOS Platform Logo" class="avatar xs margin-end" /> New iOS App</div>
<button class="link ios-new"><img src="/images/clients/ios.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="iOS Platform Logo" class="avatar xs margin-end" /> New iOS App</button>
</li>
<li class="disabled">
<div class="link android-new"><img src="/images/clients/android.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Android Platform Logo" class="avatar xs margin-end" /> New Android App</div>
<button class="link android-new"><img src="/images/clients/android.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Android Platform Logo" class="avatar xs margin-end" /> New Android App</button>
</li>
<li class="disabled">
<div class="link unity-new"><img src="/images/clients/unity.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Unity Platform Logo" class="avatar xs margin-end" /> New Unity Game</div>
<button class="link unity-new"><img src="/images/clients/unity.png?v=<?php echo APP_CACHE_BUSTER; ?>" alt="Unity Platform Logo" class="avatar xs margin-end" /> New Unity Game</button>
</li>
</ul>
</div>
app/views/layouts/default.phtml
+2 -1
View File
@@ -125,7 +125,8 @@ if(!empty($platforms)) {
<ul data-ls-loop="alerts.list" data-ls-as="alert">
<li data-forms-remove>
<div data-ls-attrs="class={{alert.class}} message">
<i class="icon-cancel" data-remove></i>
<i class="icon-cancel" data-forms-run="alert.remove"></i>
<span data-ls-bind="{{alert.text}}"></span>
<span data-ls-if="undefined !== {{alert.link}}">
gulpfile.js
+1
View File
@@ -45,6 +45,7 @@ const configApp = {
'public/scripts/views/forms/password-meter.js',
'public/scripts/views/forms/pell.js',
'public/scripts/views/forms/remove.js',
'public/scripts/views/forms/run.js',
'public/scripts/views/forms/switch.js',
'public/scripts/views/forms/tags.js',
'public/scripts/views/forms/text-count.js',
public/dist/styles/default-ltr.css
Vendored
+1 -1
View File
@@ -1 +1 @@
.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#818181;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#ffed4d;--config-color-info:#386fd2;--config-border-color:#f5f5f5;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#373738;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#2bb1f0;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-border-color:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#1F253F;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--config-language-javascript:var(--config-color-normal);--config-language-javascript-contrast:var(--config-color-background);--config-language-html:var(--config-color-normal);--config-language-html-contrast:var(--config-color-background);--config-language-php:var(--config-color-normal);--config-language-php-contrast:var(--config-color-background);--config-language-nodejs:var(--config-color-normal);--config-language-nodejs-contrast:var(--config-color-background);--config-language-ruby:var(--config-color-normal);--config-language-ruby-contrast:var(--config-color-background);--config-language-python:var(--config-color-normal);--config-language-python-contrast:var(--config-color-background);--config-language-go:var(--config-color-normal);--config-language-go-contrast:var(--config-color-background);--config-language-dart:var(--config-color-normal);--config-languLine truncated
.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#818181;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#ffed4d;--config-color-info:#386fd2;--config-border-color:#f5f5f5;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#373738;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#2bb1f0;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-border-color:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#1F253F;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--config-language-javascript:var(--config-color-normal);--config-language-javascript-contrast:var(--config-color-background);--config-language-html:var(--config-color-normal);--config-language-html-contrast:var(--config-color-background);--config-language-php:var(--config-color-normal);--config-language-php-contrast:var(--config-color-background);--config-language-nodejs:var(--config-color-normal);--config-language-nodejs-contrast:var(--config-color-background);--config-language-ruby:var(--config-color-normal);--config-language-ruby-contrast:var(--config-color-background);--config-language-python:var(--config-color-normal);--config-language-python-contrast:var(--config-color-background);--config-language-go:var(--config-color-normal);--config-language-go-contrast:var(--config-color-background);--config-language-dart:var(--config-color-normal);--config-languLine truncated
public/dist/styles/default-rtl.css
Vendored
+1 -1
View File
@@ -1 +1 @@
.pull-start{float:right}.pull-end{float:left}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#818181;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#ffed4d;--config-color-info:#386fd2;--config-border-color:#f5f5f5;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#373738;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#2bb1f0;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-border-color:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#1F253F;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--config-language-javascript:var(--config-color-normal);--config-language-javascript-contrast:var(--config-color-background);--config-language-html:var(--config-color-normal);--config-language-html-contrast:var(--config-color-background);--config-language-php:var(--config-color-normal);--config-language-php-contrast:var(--config-color-background);--config-language-nodejs:var(--config-color-normal);--config-language-nodejs-contrast:var(--config-color-background);--config-language-ruby:var(--config-color-normal);--config-language-ruby-contrast:var(--config-color-background);--config-language-python:var(--config-color-normal);--config-language-python-contrast:var(--config-color-background);--config-language-go:var(--config-color-normal);--config-language-go-contrast:var(--config-color-background);--config-language-dart:var(--config-color-normal);--config-languLine truncated
.pull-start{float:right}.pull-end{float:left}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#818181;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#ffed4d;--config-color-info:#386fd2;--config-border-color:#f5f5f5;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#373738;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#2bb1f0;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-border-color:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#1F253F;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--config-language-javascript:var(--config-color-normal);--config-language-javascript-contrast:var(--config-color-background);--config-language-html:var(--config-color-normal);--config-language-html-contrast:var(--config-color-background);--config-language-php:var(--config-color-normal);--config-language-php-contrast:var(--config-color-background);--config-language-nodejs:var(--config-color-normal);--config-language-nodejs-contrast:var(--config-color-background);--config-language-ruby:var(--config-color-normal);--config-language-ruby-contrast:var(--config-color-background);--config-language-python:var(--config-color-normal);--config-language-python-contrast:var(--config-color-background);--config-language-go:var(--config-color-normal);--config-language-go-contrast:var(--config-color-background);--config-language-dart:var(--config-color-normal);--config-languLine truncated
public/styles/comps/box.less
+9
View File
@@ -213,6 +213,15 @@
}
}
.info {
margin: 0 -30px;
padding: 20px 30px;
background: var(--config-modal-note-background);
color: var(--config-modal-note-color);
border-top: solid 1px var(--config-modal-note-border);
border-bottom: solid 1px var(--config-modal-note-border);
}
@media @phones, @tablets {
//padding: 20px;
}
public/styles/grid.less
+2 -2
View File
@@ -284,10 +284,10 @@
.clear;
position: relative;
li {
> * {
.margin-end-large;
.pull-start;
width: ~"calc(33% - 30.333px)";
width: ~"calc(33.3333% - 33.3333px)";
.photo-title {
width: ~"calc(100% + 30px)";