xarvh/fipamo
1
0
Fork 0
forked from projects/fipamo
Code Pull requests Activity

removed all font icons

Browse source 
the notifications and page editor ui elements where the only remaining
space that still contained font icons, so they've been removed and
replaced with svg

some styling tweaks are still needed so that will handlded as the css
edits continue
This commit is contained in:
ro 2024-03-21 20:10:09 -06:00
parent 33d6688af3
commit 989a4c7b69
No known key found for this signature in database
GPG key ID: 29B551CDBD4D3B50
8 changed files with 124 additions and 11191 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
public/assets/css/dash/frame.css
View file

@ -49,15 +49,6 @@ code {
padding: 3px; padding: 3px;
} }
svg[role="icon"] {
transition: all 0.3s linear;
fill: var(--secondary);
width: 25px;
height: 25px;
padding-top: 5px;
color: var(--secondary);
}
/* HEADER /* HEADER
Navigation Navigation
Notificiations Notificiations
@ -125,22 +116,6 @@ header > nav > div.nav-right div.submenu button {
font-size: 0.8em; font-size: 0.8em;
} }
button[data-render="true"] {
background: var(--primary);
}
button[data-render="true"] svg {
fill: var(--primary-highlight);
}
button[data-render="false"] svg {
fill: var(--secondary);
}
button[data-enabled="false"] svg {
fill: var(--primary);
}
/* RESPONSIVE */ /* RESPONSIVE */
@media only screen and (max-width: 900px) { @media only screen and (max-width: 900px) {

11155
public/assets/css/dash/icons.css
View file

File diff suppressed because it is too large Load diff

2
public/assets/css/dash/page-editor.css
View file

@ -92,6 +92,8 @@ main
> button.media-remove { > button.media-remove {
color: var(--white); color: var(--white);
margin: 5px; margin: 5px;
padding: 10px 15px 7px;
font-size: 1.5em;
} }
main main

55
public/assets/images/global/sprite.svg
View file

@ -820,4 +820,57 @@
<path d="M11.603 9.833L9.357 8.785C9.161 8.694 9 8.796 9 9.013v1.974c0 .217.161.319.357.228l2.245-1.048c.197-.092.197-.242.001-.334zM10 .4C4.698.4.4 4.698.4 10s4.298 9.6 9.6 9.6 9.6-4.298 9.6-9.6S15.302.4 10 .4zm0 13.5c-4.914 0-5-.443-5-3.9s.086-3.9 5-3.9 5 .443 5 3.9-.086 3.9-5 3.9z"></path> <path d="M11.603 9.833L9.357 8.785C9.161 8.694 9 8.796 9 9.013v1.974c0 .217.161.319.357.228l2.245-1.048c.197-.092.197-.242.001-.334zM10 .4C4.698.4.4 4.698.4 10s4.298 9.6 9.6 9.6 9.6-4.298 9.6-9.6S15.302.4 10 .4zm0 13.5c-4.914 0-5-.443-5-3.9s.086-3.9 5-3.9 5 .443 5 3.9-.086 3.9-5 3.9z"></path>
</symbol><symbol viewBox='0 0 20 20' id='entypo-youtube'> </symbol><symbol viewBox='0 0 20 20' id='entypo-youtube'>
<path d="M10 2.3C.172 2.3 0 3.174 0 10s.172 7.7 10 7.7 10-.874 10-7.7-.172-7.7-10-7.7zm3.205 8.034l-4.49 2.096c-.393.182-.715-.022-.715-.456V8.026c0-.433.322-.638.715-.456l4.49 2.096c.393.184.393.484 0 .668z"></path> <path d="M10 2.3C.172 2.3 0 3.174 0 10s.172 7.7 10 7.7 10-.874 10-7.7-.172-7.7-10-7.7zm3.205 8.034l-4.49 2.096c-.393.182-.715-.022-.715-.456V8.026c0-.433.322-.638.715-.456l4.49 2.096c.393.184.393.484 0 .668z"></path>
</symbol><symbol viewBox='0 0 22 22' id='tabler-clipboard-check' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" ><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M9 14l2 2l4 -4" /></symbol></svg> </symbol>
<symbol viewBox='0 0 22 22' id='tabler-bold' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" ><path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M7 5h6a3.5 3.5 0 0 1 0 7h-6z" />
<path d="M13 12h1a3.5 3.5 0 0 1 0 7h-7v-7" />
</symbol>
<symbol viewBox='0 0 22 22' id='tabler-italic' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" >
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M11 5l6 0" />
<path d="M7 19l6 0" />
<path d="M14 5l-4 14" />
</symbol>
<symbol viewBox='0 0 22 22' id='tabler-strikethrough' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" >
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M5 12l14 0" />
<path d="M16 6.5a4 2 0 0 0 -4 -1.5h-1a3.5 3.5 0 0 0 0 7h2a3.5 3.5 0 0 1 0 7h-1.5a4 2 0 0 1 -4 -1.5" />
</symbol>
<symbol viewBox='0 0 22 22' id='tabler-heading-1' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" >
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M19 18v-8l-2 2" />
<path d="M4 6v12" />
<path d="M12 6v12" />
<path d="M11 18h2" />
<path d="M3 18h2" />
<path d="M4 12h8" />
<path d="M3 6h2" />
<path d="M11 6h2" />
</symbol>
<symbol viewBox='0 0 22 22' id='tabler-heading-2' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" >
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M17 12a2 2 0 1 1 4 0c0 .591 -.417 1.318 -.816 1.858l-3.184 4.143l4 0" />
<path d="M4 6v12" />
<path d="M12 6v12" />
<path d="M11 18h2" />
<path d="M3 18h2" />
<path d="M4 12h8" />
<path d="M3 6h2" />
<path d="M11 6h2" />
</symbol>
<symbol viewBox='0 0 22 22' id='tabler-heading-3' fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" >
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M19 14a2 2 0 1 0 -2 -2" />
<path d="M17 16a2 2 0 1 0 2 -2" />
<path d="M4 6v12" />
<path d="M12 6v12" />
<path d="M11 18h2" />
<path d="M3 18h2" />
<path d="M4 12h8" />
<path d="M3 6h2" />
<path d="M11 6h2" />
</symbol>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 202 KiB

After

Width:  |  Height:  |  Size: 204 KiB

7
public/assets/scripts/dash/app/ui/FileManager.js
View file

@ -85,10 +85,11 @@ export default class FileManager {
return function (f) { return function (f) {
//create remove button object //create remove button object
var remove = document.createElement('button'); var remove = document.createElement('button');
var removeIcon = document.createElement('i'); //var removeIcon = document.createElement('i');
removeIcon.classList.add('ti', 'ti-x'); //removeIcon.classList.add('ti', 'ti-x');
remove.innerHTML = 'X';
remove.className = 'media-remove'; remove.className = 'media-remove';
remove.appendChild(removeIcon); //remove.appendChild(removeIcon);
//remove.setAttribute('id', mediaCount); //remove.setAttribute('id', mediaCount);
remove.addEventListener( remove.addEventListener(
'click', 'click',

16
resources/views/back/page.blade.php
View file

@ -55,13 +55,13 @@
<source src="{{ $item['file'] }}"/> <source src="{{ $item['file'] }}"/>
</video> </video>
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@else @else
<div id="{{ $loop->index }}" class="img-item" data-id="{{ $item['file'] }}" style="background: url({{ $item['file'] }}) no-repeat center center / cover"> <div id="{{ $loop->index }}" class="img-item" data-id="{{ $item['file'] }}" style="background: url({{ $item['file'] }}) no-repeat center center / cover">
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@endif @endif
@ -74,9 +74,7 @@
</div> </div>
@else @else
<div id="0" class="img-item" data-id="{{ $media[0]['file'] }}" style="background: url({{ $media[0]['file'] }}) no-repeat center center / cover"> <div id="0" class="img-item" data-id="{{ $media[0]['file'] }}" style="background: url({{ $media[0]['file'] }}) no-repeat center center / cover">
<button id="0" class="media-remove"> <button id="0" class="media-remove">X</button>
<i class="ti ti-x"></i>
</button>
</div> </div>
@endif @endif
@endif @endif
@ -95,14 +93,14 @@
<source src="{{ $item['file'] }}"/> <source src="{{ $item['file'] }}"/>
</audio> </audio>
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@else @else
<div id="{{ $loop->index }}" class="file-item" data-id="{{ $item['file'] }}"> <div id="{{ $loop->index }}" class="file-item" data-id="{{ $item['file'] }}">
<a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a> <a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a>
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@endif @endif
@ -118,14 +116,14 @@
<source src="{{ $files[0]['file'] }}"/> <source src="{{ $files[0]['file'] }}"/>
</audio> </audio>
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@else @else
<div id="0" class="file-item" data-id="{{ $files[0]['file'] }}"> <div id="0" class="file-item" data-id="{{ $files[0]['file'] }}">
<a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a> <a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a>
<button id="{{ $loop->index }}" class="media-remove"> <button id="{{ $loop->index }}" class="media-remove">
<i class="ti ti-x"></i> X
</button> </button>
</div> </div>
@endif @endif

44
resources/views/includes/editor.blade.php
View file

@ -1,38 +1,60 @@
<div role="text-editor-control"> <div role="text-editor-control">
<button id="edit-bold" class="content-editor-btn-text editor-button" title="bold"> <button id="edit-bold" class="content-editor-btn-text editor-button" title="bold">
<i id="edit-bold" class="ti ti-bold"></i> <svg id="edit-bold" role="icon">
<use id="edit-bold" xlink:href="/assets/images/global/sprite.svg#tabler-bold"/>
</svg>
</button> </button>
<button id="edit-italic" class="content-editor-btn-text editor-button" title="italic"> <button id="edit-italic" class="content-editor-btn-text editor-button" title="italic">
<i id="edit-italic" class="ti ti-italic"></i> <svg id="edit-italic" role="icon">
<use id="edit-italic" xlink:href="/assets/images/global/sprite.svg#tabler-italic"/>
</svg>
</button> </button>
<button id="edit-strikethrough" class="content-editor-btn-text editor-button" title="strikethrough"> <button id="edit-strikethrough" class="content-editor-btn-text editor-button" title="strikethrough">
<i id="edit-strikethrough" class="ti ti-strikethrough"></i> <svg id="edit-strikethrough" role="icon">
<use id="edit-strikethrough" xlink:href="/assets/images/global/sprite.svg#tabler-strikethrough"/>
</svg>
</button> </button>
<button id="edit-link" class="content-editor-btn-icon editor-button" title="insert link"> <button id="edit-link" class="content-editor-btn-icon editor-button" title="insert link">
<i id="edit-link" class="ti ti-link"></i> <svg id="edit-link" role="icon">
<use id="edit-link" xlink:href="/assets/images/global/sprite.svg#entypo-link"/>
</svg>
</button> </button>
<button id="edit-header1" class="content-editor-btn-text editor-button" title="header 1"> <button id="edit-header1" class="content-editor-btn-text editor-button" title="header 1">
<i id="edit-header1" class="ti ti-h-1"></i> <svg id="edit-header1" role="icon">
<use id="edit-header1" xlink:href="/assets/images/global/sprite.svg#tabler-heading-1"/>
</svg>
</button> </button>
<button id="edit-header2" class="content-editor-btn-text editor-button" title="header 2"> <button id="edit-header2" class="content-editor-btn-text editor-button" title="header 2">
<i id="edit-header2" class="ti ti-h-2"></i> <svg id="edit-header2" role="icon">
<use id="edit-header2" xlink:href="/assets/images/global/sprite.svg#tabler-heading-2"/>
</svg>
</button> </button>
<button id="edit-header3" class="content-editor-btn-text editor-button" title="header 3"> <button id="edit-header3" class="content-editor-btn-text editor-button" title="header 3">
<i id="edit-header3" class="ti ti-h-3"></i> <svg id="edit-header3" role="icon">
<use id="edit-header3" xlink:href="/assets/images/global/sprite.svg#tabler-heading-3"/>
</svg>
</button> </button>
<button id="edit-image" class="content-editor-btn-icon editor-button" title="insert image"> <button id="edit-image" class="content-editor-btn-icon editor-button" title="insert image">
<i id="edit-image" class="ti ti-photo"></i> <svg id="edit-image" role="icon">
<use id="edit-image" xlink:href="/assets/images/global/sprite.svg#entypo-image"/>
</svg>
</button> </button>
@if($mode == "edit") @if($mode == "edit")
<button id="edit-update" class="post-sumbit-btn submit-start editor-button" data-action='blog-update' data-id="{{ $page['uuid'] }} type='submit' title=" bold"> <button id="edit-update" class="post-sumbit-btn submit-start editor-button" data-action='blog-update' data-id="{{ $page['uuid'] }} type='submit' title=" bold">
<i id="edit-update" class="ti ti-device-floppy"></i> <svg id="edit-update" role="icon">
<use id="edit-update" xlink:href="/assets/images/global/sprite.svg#entypo-save"/>
</svg>
</button> </button>
<button id="edit-delete" class="content-editor-btn-icon editor-button submit-delete" for="post-delete" title='delete post'> <button id="edit-delete" class="content-editor-btn-icon editor-button submit-delete" for="post-delete" title='delete post'>
<i id="edit-delete" class="ti ti-x"></i> <svg id="edit-delete" role="icon">
<use id="edit-delete" xlink:href="/assets/images/global/sprite.svg#entypo-cross"/>
</svg>
</button> </button>
@else @else
<button id="edit-save" class="post-sumbit-btn submit-start editor-button" data-action='blog-add' type='submit'> <button id="edit-save" class="post-sumbit-btn submit-start editor-button" data-action='blog-add' type='submit'>
<i id="edit-save" class="ti ti-file-plus"></i> <svg id="edit-save" role="icon">
<use id="edit-save" xlink:href="/assets/images/global/sprite.svg#entypo-plus"/>
</svg>
</button> </button>
@endif @endif
</div> </div>

11
resources/views/includes/notifications.blade.php
View file

@ -1,7 +1,14 @@
<div class="notify-message"> <div class="notify-message">
<div class="notify-icons"> <div class="notify-icons">
<i class="ti ti-mood-smile notify-good"></i> <svg id="nav-menu-icon" role="icon" class="notify-good">
<i class="ti ti-mood-sad notify-notgood"></i> <use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-emoji-happy"/>
</svg>
<svg id="nav-menu-icon" role="icon" class="notify-notgood">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-emoji-sad"/>
</svg>
<svg id="nav-menu-icon" role="icon" class="notify-working">
<use id="nav-menu-icon" xlink:href="/assets/images/global/sprite.svg#entypo-hour-glass"/>
</svg>
<i class="ti ti-settings notify-working"></i> <i class="ti ti-settings notify-working"></i>
</div> </div>
<div class="notify-text"> <div class="notify-text">