Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 104 KiB After Width: | Height: | Size: 104 KiB |
Before Width: | Height: | Size: 107 KiB After Width: | Height: | Size: 107 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
96
config/build/win/nsis/installer-for-.net45.nsh
Normal file
|
@ -0,0 +1,96 @@
|
||||||
|
Function CheckAndDownloadDotNet45
|
||||||
|
# Let's see if the user has the .NET Framework 4.5 installed on their system or not
|
||||||
|
# Remember: you need Vista SP2 or 7 SP1. It is built in to Windows 8, and not needed
|
||||||
|
# In case you're wondering, running this code on Windows 8 will correctly return is_equal
|
||||||
|
# or is_greater (maybe Microsoft releases .NET 4.5 SP1 for example)
|
||||||
|
|
||||||
|
# Set up our Variables
|
||||||
|
Var /GLOBAL dotNET45IsThere
|
||||||
|
Var /GLOBAL dotNET_CMD_LINE
|
||||||
|
Var /GLOBAL EXIT_CODE
|
||||||
|
|
||||||
|
ReadRegDWORD $dotNET45IsThere HKLM "SOFTWARE\Microsoft\NET Framework Setup\NDP\v4\Full" "Release"
|
||||||
|
IntCmp $dotNET45IsThere 378389 is_equal is_less is_greater
|
||||||
|
|
||||||
|
is_equal:
|
||||||
|
Goto done_compare_not_needed
|
||||||
|
is_greater:
|
||||||
|
# Useful if, for example, Microsoft releases .NET 4.5 SP1
|
||||||
|
# We want to be able to simply skip install since it's not
|
||||||
|
# needed on this system
|
||||||
|
Goto done_compare_not_needed
|
||||||
|
is_less:
|
||||||
|
Goto done_compare_needed
|
||||||
|
|
||||||
|
done_compare_needed:
|
||||||
|
#.NET Framework 4.5 install is *NEEDED*
|
||||||
|
|
||||||
|
# Microsoft Download Center EXE:
|
||||||
|
# Web Bootstrapper: http://go.microsoft.com/fwlink/?LinkId=225704
|
||||||
|
# Full Download: http://go.microsoft.com/fwlink/?LinkId=225702
|
||||||
|
|
||||||
|
# Setup looks for components\dotNET45Full.exe relative to the install EXE location
|
||||||
|
# This allows the installer to be placed on a USB stick (for computers without internet connections)
|
||||||
|
# If the .NET Framework 4.5 installer is *NOT* found, Setup will connect to Microsoft's website
|
||||||
|
# and download it for you
|
||||||
|
|
||||||
|
# Reboot Required with these Exit Codes:
|
||||||
|
# 1641 or 3010
|
||||||
|
|
||||||
|
# Command Line Switches:
|
||||||
|
# /showrmui /passive /norestart
|
||||||
|
|
||||||
|
# Silent Command Line Switches:
|
||||||
|
# /q /norestart
|
||||||
|
|
||||||
|
|
||||||
|
# Let's see if the user is doing a Silent install or not
|
||||||
|
IfSilent is_quiet is_not_quiet
|
||||||
|
|
||||||
|
is_quiet:
|
||||||
|
StrCpy $dotNET_CMD_LINE "/q /norestart"
|
||||||
|
Goto LookForLocalFile
|
||||||
|
is_not_quiet:
|
||||||
|
StrCpy $dotNET_CMD_LINE "/showrmui /passive /norestart"
|
||||||
|
Goto LookForLocalFile
|
||||||
|
|
||||||
|
LookForLocalFile:
|
||||||
|
# Let's see if the user stored the Full Installer
|
||||||
|
IfFileExists "$EXEPATH\components\dotNET45Full.exe" do_local_install do_network_install
|
||||||
|
|
||||||
|
do_local_install:
|
||||||
|
# .NET Framework found on the local disk. Use this copy
|
||||||
|
|
||||||
|
ExecWait '"$EXEPATH\components\dotNET45Full.exe" $dotNET_CMD_LINE' $EXIT_CODE
|
||||||
|
Goto is_reboot_requested
|
||||||
|
|
||||||
|
# Now, let's Download the .NET
|
||||||
|
do_network_install:
|
||||||
|
|
||||||
|
Var /GLOBAL dotNetDidDownload
|
||||||
|
NSISdl::download "http://go.microsoft.com/fwlink/?LinkId=225704" "$TEMP\dotNET45Web.exe" $dotNetDidDownload
|
||||||
|
|
||||||
|
StrCmp $dotNetDidDownload success fail
|
||||||
|
success:
|
||||||
|
ExecWait '"$TEMP\dotNET45Web.exe" $dotNET_CMD_LINE' $EXIT_CODE
|
||||||
|
Goto is_reboot_requested
|
||||||
|
|
||||||
|
fail:
|
||||||
|
MessageBox MB_OK|MB_ICONEXCLAMATION "Unable to download .NET Framework. ${PRODUCT_NAME} will be installed, but will not function without the Framework!"
|
||||||
|
Goto done_dotNET_function
|
||||||
|
|
||||||
|
# $EXIT_CODE contains the return codes. 1641 and 3010 means a Reboot has been requested
|
||||||
|
is_reboot_requested:
|
||||||
|
${If} $EXIT_CODE = 1641
|
||||||
|
${OrIf} $EXIT_CODE = 3010
|
||||||
|
SetRebootFlag true
|
||||||
|
${EndIf}
|
||||||
|
|
||||||
|
done_compare_not_needed:
|
||||||
|
# Done dotNET Install
|
||||||
|
Goto done_dotNET_function
|
||||||
|
|
||||||
|
#exit the function
|
||||||
|
done_dotNET_function:
|
||||||
|
|
||||||
|
FunctionEnd
|
8
config/build/win/nsis/installer.nsh
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
!macro customInit
|
||||||
|
|
||||||
|
!macroend
|
||||||
|
|
||||||
|
!macro customInstall
|
||||||
|
File "${BUILD_RESOURCES_DIR}\win\bin\npcap-0.99-r7.exe"
|
||||||
|
ExecWait '"$INSTDIR\npcap-0.99-r7.exe" /npf_startup=yes /loopback_support=yes /admin_only=no /dot11_support=yes /vlan_support=yes /winpcap_mode=yes'
|
||||||
|
!macroend
|
0
config/build/win/nsis/uninstaller-for-ucware.nsh
Normal file
|
@ -82,7 +82,7 @@ const mainConfig: webpack.Configuration = {
|
||||||
),
|
),
|
||||||
new CopyWebpackPlugin([
|
new CopyWebpackPlugin([
|
||||||
{
|
{
|
||||||
from: 'ucap-webmessenger-electron/resources/**/*',
|
from: 'ucap-webmessenger-electron/assets/**/*',
|
||||||
to: path.resolve(__dirname, '..', 'dist'),
|
to: path.resolve(__dirname, '..', 'dist'),
|
||||||
context: 'electron-projects'
|
context: 'electron-projects'
|
||||||
}
|
}
|
||||||
|
|
0
electron-builder.env
Normal file
|
@ -1,49 +1,18 @@
|
||||||
{
|
{
|
||||||
|
"appId": "com.lgucap.dstalk",
|
||||||
"productName": "DS Talk",
|
"productName": "DS Talk",
|
||||||
"appId": "com.lgucap.messenger",
|
|
||||||
"asar": true,
|
"asar": true,
|
||||||
"protocols": {
|
"extraMetadata": {
|
||||||
"name": "DS Talk",
|
"name": "DS Talk"
|
||||||
"schemes": ["DS Talk"]
|
|
||||||
},
|
|
||||||
"publish": {
|
|
||||||
"provider": "generic",
|
|
||||||
"url": "http://localhost:8099/client-updates/"
|
|
||||||
},
|
|
||||||
"mac": {
|
|
||||||
"target": ["default"],
|
|
||||||
"icon": "./dist/ucap-webmessenger-electron/resources/installer/woori.icns"
|
|
||||||
},
|
|
||||||
"dmg": {
|
|
||||||
"title": "DS Talk",
|
|
||||||
"icon": "./dist/ucap-webmessenger-electron/resources/installer/woori.icns"
|
|
||||||
},
|
|
||||||
"win": {
|
|
||||||
"target": ["zip", "nsis"],
|
|
||||||
"icon": "./dist/ucap-webmessenger-electron/resources/image/16_16.ico",
|
|
||||||
"legalTrademarks": "(c) 2015 lgucap.com",
|
|
||||||
"publisherName": "LGCNS",
|
|
||||||
"signingHashAlgorithms": ["sha1"],
|
|
||||||
"certificateFile": "./config/sign/www.lgcns.com.pfx",
|
|
||||||
"certificatePassword": "it15itsm"
|
|
||||||
},
|
|
||||||
"linux": {
|
|
||||||
"target": ["AppImage", "deb", "rpm", "zip", "tar.gz"],
|
|
||||||
"icon": "./dist/ucap-webmessenger-electron/resources/linuxicon"
|
|
||||||
},
|
|
||||||
"nsis": {
|
|
||||||
"oneClick": true,
|
|
||||||
"allowToChangeInstallationDirectory": false,
|
|
||||||
"perMachine": false,
|
|
||||||
"differentialPackage": true
|
|
||||||
},
|
},
|
||||||
"directories": {
|
"directories": {
|
||||||
"buildResources": "./dist/ucap-webmessenger-electron/resources/installer/",
|
"buildResources": "./config/build/",
|
||||||
"output": "./dist/electron/"
|
"output": "./dist/electron/"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"**/*",
|
"**/*",
|
||||||
"!**/*.ts",
|
"!**/*.ts",
|
||||||
|
"!**/*.scss",
|
||||||
"!LICENSE.md",
|
"!LICENSE.md",
|
||||||
"!package.json",
|
"!package.json",
|
||||||
"!package-lock.json",
|
"!package-lock.json",
|
||||||
|
@ -54,8 +23,58 @@
|
||||||
"!**/.awcache",
|
"!**/.awcache",
|
||||||
"!**/.vscode",
|
"!**/.vscode",
|
||||||
"!config/",
|
"!config/",
|
||||||
|
"!dist/",
|
||||||
"!docker/",
|
"!docker/",
|
||||||
"!tsconfig.json",
|
"!tsconfig.json",
|
||||||
"!tslint.json"
|
"!tslint.json",
|
||||||
]
|
{
|
||||||
|
"filter": ["**/*"],
|
||||||
|
"from": "./dist/ucap-webmessenger-app/",
|
||||||
|
"to": "./renderer/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"filter": ["**/*"],
|
||||||
|
"from": "./dist/ucap-webmessenger-electron/",
|
||||||
|
"to": "./electron/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"filter": ["**/*"],
|
||||||
|
"from": "./config/build/${os}/icon/daesang/",
|
||||||
|
"to": "./assets/icon/"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"protocols": {
|
||||||
|
"name": "DS Talk",
|
||||||
|
"schemes": ["DS Talk"]
|
||||||
|
},
|
||||||
|
"publish": {
|
||||||
|
"provider": "generic",
|
||||||
|
"url": "http://localhost:8099/client-updates/"
|
||||||
|
},
|
||||||
|
"mac": {
|
||||||
|
"target": ["default"],
|
||||||
|
"icon": "./config/build/mac/icon/woori.icns"
|
||||||
|
},
|
||||||
|
"dmg": {
|
||||||
|
"title": "DS Talk"
|
||||||
|
},
|
||||||
|
"win": {
|
||||||
|
"target": ["zip", "nsis"],
|
||||||
|
"icon": "./config/build/win/icon/daesang/16x16.ico",
|
||||||
|
"legalTrademarks": "(c) 2015 lgucap.com",
|
||||||
|
"publisherName": "LGCNS",
|
||||||
|
"signingHashAlgorithms": ["sha1"],
|
||||||
|
"certificateFile": "./config/sign/www.lgcns.com.pfx",
|
||||||
|
"certificatePassword": "it15itsm"
|
||||||
|
},
|
||||||
|
"linux": {
|
||||||
|
"target": ["AppImage", "deb", "rpm", "zip", "tar.gz"],
|
||||||
|
"icon": "./config/build/linux/icon/woori/"
|
||||||
|
},
|
||||||
|
"nsis": {
|
||||||
|
"oneClick": true,
|
||||||
|
"allowToChangeInstallationDirectory": false,
|
||||||
|
"perMachine": false,
|
||||||
|
"differentialPackage": true
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
Before Width: | Height: | Size: 503 B After Width: | Height: | Size: 503 B |
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 886 B After Width: | Height: | Size: 886 B |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 999 B After Width: | Height: | Size: 999 B |
Before Width: | Height: | Size: 107 KiB After Width: | Height: | Size: 107 KiB |
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 4.5 KiB |
Before Width: | Height: | Size: 551 B After Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 9.9 KiB After Width: | Height: | Size: 9.9 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 999 B After Width: | Height: | Size: 999 B |
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 31 KiB |
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 842 B After Width: | Height: | Size: 842 B |
Before Width: | Height: | Size: 643 B After Width: | Height: | Size: 643 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 226 B After Width: | Height: | Size: 226 B |
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
|
@ -165,11 +165,7 @@ export class AppWindow {
|
||||||
} else {
|
} else {
|
||||||
this.window.loadURL(
|
this.window.loadURL(
|
||||||
url.format({
|
url.format({
|
||||||
pathname: path.join(
|
pathname: path.join(__dirname, '..', 'renderer/index.html'),
|
||||||
__dirname,
|
|
||||||
'..',
|
|
||||||
'ucap-webmessenger-app/index.html'
|
|
||||||
),
|
|
||||||
protocol: 'file:',
|
protocol: 'file:',
|
||||||
slashes: true
|
slashes: true
|
||||||
})
|
})
|
||||||
|
|
|
@ -48,8 +48,22 @@ import { RendererUpdater } from './lib/renderer-updater';
|
||||||
import { Storage } from './lib/storage';
|
import { Storage } from './lib/storage';
|
||||||
|
|
||||||
const appIconPath = __LINUX__
|
const appIconPath = __LINUX__
|
||||||
? path.join(__dirname, 'resources/linuxicon', '256x256.png')
|
? __DEV__
|
||||||
: path.join(__dirname, 'resources/image', '64_64.png');
|
? path.join(
|
||||||
|
__dirname,
|
||||||
|
'../../',
|
||||||
|
'config/build/linux/icon/daesang/',
|
||||||
|
'256x256.png'
|
||||||
|
)
|
||||||
|
: path.join(__dirname, '..', '/assets/icon/', '256x256.png')
|
||||||
|
: __DEV__
|
||||||
|
? path.join(
|
||||||
|
__dirname,
|
||||||
|
'../../',
|
||||||
|
'config/build/win/icon/daesang/',
|
||||||
|
'16x16.ico'
|
||||||
|
)
|
||||||
|
: path.join(__dirname, '..', '/assets/icon/', '16x16.ico');
|
||||||
|
|
||||||
let appWindow: AppWindow | null = null;
|
let appWindow: AppWindow | null = null;
|
||||||
let appTray: Tray | null = null;
|
let appTray: Tray | null = null;
|
||||||
|
@ -257,12 +271,12 @@ app.on(ElectronAppChannel.Ready, () => {
|
||||||
|
|
||||||
notificationService.options.defaultWindow.webPreferences.preload = path.join(
|
notificationService.options.defaultWindow.webPreferences.preload = path.join(
|
||||||
__dirname,
|
__dirname,
|
||||||
'resources/notification/preload.js'
|
'assets/notification/preload.js'
|
||||||
);
|
);
|
||||||
|
|
||||||
notificationService.templatePath = path.join(
|
notificationService.templatePath = path.join(
|
||||||
__dirname,
|
__dirname,
|
||||||
'resources/notification/template.html'
|
'assets/notification/template.html'
|
||||||
);
|
);
|
||||||
|
|
||||||
updateWindowService = new ElectronUpdateWindowService({
|
updateWindowService = new ElectronUpdateWindowService({
|
||||||
|
@ -290,7 +304,7 @@ app.on(ElectronAppChannel.Ready, () => {
|
||||||
|
|
||||||
updateWindowService.templatePath = path.join(
|
updateWindowService.templatePath = path.join(
|
||||||
__dirname,
|
__dirname,
|
||||||
'resources/update-window/template.html'
|
'assets/update-window/template.html'
|
||||||
);
|
);
|
||||||
|
|
||||||
// updateWindowService.show();
|
// updateWindowService.show();
|
||||||
|
@ -580,15 +594,12 @@ ipcMain.on(
|
||||||
text: noti.contents,
|
text: noti.contents,
|
||||||
image:
|
image:
|
||||||
noti.image ||
|
noti.image ||
|
||||||
path.join(
|
path.join(__dirname, 'assets/notification/images/img_nophoto_50.png'),
|
||||||
__dirname,
|
|
||||||
'resources/notification/images/img_nophoto_50.png'
|
|
||||||
),
|
|
||||||
sound: noti.useSound
|
sound: noti.useSound
|
||||||
? path.join(
|
? path.join(
|
||||||
'file://',
|
'file://',
|
||||||
__dirname,
|
__dirname,
|
||||||
'resources/notification/sounds/messageAlarm.mp3'
|
'assets/notification/sounds/messageAlarm.mp3'
|
||||||
)
|
)
|
||||||
: '',
|
: '',
|
||||||
displayTime: !!noti.displayTime ? noti.displayTime : undefined,
|
displayTime: !!noti.displayTime ? noti.displayTime : undefined,
|
||||||
|
|
|
@ -3,7 +3,7 @@ import * as path from 'path';
|
||||||
// tslint:disable-next-line: variable-name
|
// tslint:disable-next-line: variable-name
|
||||||
const _root = __DEV__
|
const _root = __DEV__
|
||||||
? path.resolve(__dirname, '..', '..')
|
? path.resolve(__dirname, '..', '..')
|
||||||
: path.resolve(__dirname, '..', '..');
|
: path.resolve(__dirname, '..');
|
||||||
|
|
||||||
export function root(...paths: string[]) {
|
export function root(...paths: string[]) {
|
||||||
const args = Array.prototype.slice.call(paths, 0);
|
const args = Array.prototype.slice.call(paths, 0);
|
||||||
|
|
|
@ -145,5 +145,5 @@
|
||||||
"webpack-node-externals": "^1.7.2",
|
"webpack-node-externals": "^1.7.2",
|
||||||
"zone.js": "~0.9.1"
|
"zone.js": "~0.9.1"
|
||||||
},
|
},
|
||||||
"main": "./dist/ucap-webmessenger-electron/main.js"
|
"main": "./electron/main.js"
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,7 +19,7 @@ export function createTranslateLoader(nativeService: NativeService) {
|
||||||
break;
|
break;
|
||||||
case NativeType.Electron:
|
case NativeType.Electron:
|
||||||
prefix = environment.production
|
prefix = environment.production
|
||||||
? '/dist/ucap-webmessenger-app/assets/i18n/'
|
? '/renderer/assets/i18n/'
|
||||||
: '/projects/ucap-webmessenger-app/src/assets/i18n/';
|
: '/projects/ucap-webmessenger-app/src/assets/i18n/';
|
||||||
|
|
||||||
break;
|
break;
|
||||||
|
|
|
@ -50,6 +50,16 @@
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
&.thumbnail-mask {
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
img {
|
||||||
|
width: 50px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.room-info {
|
.room-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -90,8 +90,8 @@ $lg-red: (
|
||||||
$aquaBlue-daesang: (
|
$aquaBlue-daesang: (
|
||||||
50: #f9feff,
|
50: #f9feff,
|
||||||
//#e0f7fa,
|
//#e0f7fa,
|
||||||
100: #b2ebf2,
|
/* 100: #b2ebf2,*/ 100: #ebfdff,
|
||||||
200: #4dd0e1,
|
200: #65e4f5,
|
||||||
//#80deea,
|
//#80deea,
|
||||||
300: #4dd0e1,
|
300: #4dd0e1,
|
||||||
400: #26c6da,
|
400: #26c6da,
|
||||||
|
@ -221,6 +221,9 @@ $daesang-grey: (
|
||||||
.text-primary-color {
|
.text-primary-color {
|
||||||
color: mat-color($primary);
|
color: mat-color($primary);
|
||||||
}
|
}
|
||||||
|
.text-accent-dark {
|
||||||
|
color: mat-color($accent, 600);
|
||||||
|
}
|
||||||
.text-accent-darkest {
|
.text-accent-darkest {
|
||||||
color: mat-color($accent, 800);
|
color: mat-color($accent, 800);
|
||||||
}
|
}
|
||||||
|
@ -379,4 +382,25 @@ $daesang-grey: (
|
||||||
background-color: mat-color($accent, B100);
|
background-color: mat-color($accent, B100);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.message-row {
|
||||||
|
.message-main {
|
||||||
|
.bubble {
|
||||||
|
background-color: mat-color($accent, 100);
|
||||||
|
border: 1px solid mat-color($accent, 200);
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.me {
|
||||||
|
.message-main {
|
||||||
|
.bubble {
|
||||||
|
background-color: #ffffff;
|
||||||
|
border: 1px solid mat-color($primary, 300);
|
||||||
|
.event-info {
|
||||||
|
border-radius: 0 0 0 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="event-main">
|
<div class="event-main bg-accent-dark">
|
||||||
<div class="event-header">
|
<div class="event-header">
|
||||||
<ng-container
|
<ng-container
|
||||||
*ngIf="!!message.sentMessageJson && !!message.sentMessageJson.contents"
|
*ngIf="!!message.sentMessageJson && !!message.sentMessageJson.contents"
|
||||||
|
@ -20,15 +20,16 @@
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<ul class="event-info">
|
<ul class="event-info">
|
||||||
<li class="event-title">
|
<li class="event-date bg-accent-brightest">
|
||||||
|
<span class="bg-accent-dark">날짜</span
|
||||||
|
>{{ date | ucapDate: 'YYYY.MM.DD' }}
|
||||||
|
</li>
|
||||||
|
<li class="event-time bg-accent-brightest">
|
||||||
|
<span class="bg-accent-dark">시간</span>{{ date | ucapDate: 'a hh:mm' }}
|
||||||
|
</li>
|
||||||
|
<li class="event-content">
|
||||||
{{ message.sentMessageJson.title }}
|
{{ message.sentMessageJson.title }}
|
||||||
</li>
|
</li>
|
||||||
<li class="event-date">
|
|
||||||
<span>날짜</span>{{ date | ucapDate: 'YYYY.MM.DD' }}
|
|
||||||
</li>
|
|
||||||
<li class="event-time">
|
|
||||||
<span>시간</span>{{ date | ucapDate: 'a hh:mm' }}
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<!-- <div class="btn-box">
|
<!-- <div class="btn-box">
|
||||||
|
|
|
@ -1,32 +1,49 @@
|
||||||
.event-main {
|
.event-main {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
padding: 4px;
|
||||||
.event-header {
|
.event-header {
|
||||||
padding: 10px;
|
padding: 10px 10px 10px 36px;
|
||||||
background-color: #efefef;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-calendar'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: 10px center;
|
||||||
|
border-radius: 3px 3px 0 0;
|
||||||
|
min-width: 200px;
|
||||||
|
vertical-align: middle;
|
||||||
|
stroke: #ffffff;
|
||||||
}
|
}
|
||||||
.event-info {
|
.event-info {
|
||||||
padding: 10px 14px;
|
border-radius: 0 0 6px 6px;
|
||||||
line-height: 1.6em;
|
background-color: #ffffff;
|
||||||
li {
|
li {
|
||||||
margin-bottom: 4px;
|
|
||||||
&.event-title {
|
&.event-title {
|
||||||
border-bottom: 1px solid #dddddd;
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
&.event-date,
|
&.event-date,
|
||||||
&.event-time {
|
&.event-time {
|
||||||
color: #666666;
|
padding: 4px 10px;
|
||||||
}
|
border-bottom: 1px dotted #dddddd;
|
||||||
span {
|
span {
|
||||||
padding: 2px 6px;
|
width: 60px;
|
||||||
background-color: #efefef;
|
padding: 1px 6px;
|
||||||
margin-right: 10px;
|
margin-right: 6px;
|
||||||
|
border-radius: 100px;
|
||||||
|
line-height: 20px;
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 0.96em;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.event-content {
|
||||||
|
padding: 10px;
|
||||||
|
color: #444444;
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 1em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -40,3 +57,11 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .message-row.me > .event-info {
|
||||||
|
border-radius: 0 0 0 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.feather-calendar {
|
||||||
|
stroke: #ffffff;
|
||||||
|
}
|
||||||
|
|
|
@ -129,24 +129,10 @@
|
||||||
<ng-template #contents>
|
<ng-template #contents>
|
||||||
<div
|
<div
|
||||||
*ngIf="getUserProfile(message.senderSeq) != ''"
|
*ngIf="getUserProfile(message.senderSeq) != ''"
|
||||||
class="profile-img"
|
class="profile-img thumbnail-mask"
|
||||||
>
|
>
|
||||||
<!-- <img
|
|
||||||
class="avatar"
|
|
||||||
style="width: 50px; height: 50px;"
|
|
||||||
[src]="
|
|
||||||
profileImageRoot
|
|
||||||
| ucapUiImaage
|
|
||||||
: {
|
|
||||||
path: getUserProfile(message.senderSeq),
|
|
||||||
default: 'assets/images/img_nophoto_50.png'
|
|
||||||
}
|
|
||||||
| async
|
|
||||||
"
|
|
||||||
/> -->
|
|
||||||
<img
|
<img
|
||||||
class="avatar"
|
class="avatar"
|
||||||
style="width: 50px; height: 50px;"
|
|
||||||
ucapImage
|
ucapImage
|
||||||
[base]="profileImageRoot"
|
[base]="profileImageRoot"
|
||||||
[path]="getUserProfile(message.senderSeq)"
|
[path]="getUserProfile(message.senderSeq)"
|
||||||
|
|
|
@ -31,8 +31,15 @@ $meBox-bg: #ffffff;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
.profile-img {
|
.profile-img {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
img {
|
&.thumbnail-mask {
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
overflow: hidden;
|
||||||
|
img {
|
||||||
|
width: 50px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -58,7 +65,7 @@ $meBox-bg: #ffffff;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
margin-bottom: 6px;
|
margin-bottom: 6px;
|
||||||
}
|
}
|
||||||
.bubble {
|
/*.bubble {
|
||||||
border: 1px solid $otherBox-line;
|
border: 1px solid $otherBox-line;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -91,6 +98,14 @@ $meBox-bg: #ffffff;
|
||||||
left: -10px;
|
left: -10px;
|
||||||
top: 5px;
|
top: 5px;
|
||||||
}
|
}
|
||||||
|
}*/
|
||||||
|
.bubble {
|
||||||
|
border-radius: 0 10px 10px 10px;
|
||||||
|
font-weight: 900;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
|
||||||
|
word-break: break-all;
|
||||||
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.secondary-text {
|
.secondary-text {
|
||||||
|
@ -110,10 +125,10 @@ $meBox-bg: #ffffff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-row.me > .bubble {
|
/*.message-row.me > .bubble {
|
||||||
border: 1px solid $meBox-line;
|
border: 1px solid $meBox-line;
|
||||||
background-color: $meBox-bg;
|
background-color: $meBox-bg;
|
||||||
}
|
}*/
|
||||||
.message-row.me {
|
.message-row.me {
|
||||||
.profile-img {
|
.profile-img {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -125,7 +140,10 @@ $meBox-bg: #ffffff;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
& .bubble:before {
|
.bubble {
|
||||||
|
border-radius: 10px 10px 0 10px;
|
||||||
|
}
|
||||||
|
/* & .bubble:before {
|
||||||
content: '';
|
content: '';
|
||||||
width: 0px;
|
width: 0px;
|
||||||
height: 0px;
|
height: 0px;
|
||||||
|
@ -150,7 +168,7 @@ $meBox-bg: #ffffff;
|
||||||
left: initial;
|
left: initial;
|
||||||
right: -10px;
|
right: -10px;
|
||||||
top: 5px;
|
top: 5px;
|
||||||
}
|
}*/
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.bubble-main {
|
.bubble-main {
|
||||||
|
|
|
@ -25,14 +25,82 @@
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="btns">
|
<div class="btns">
|
||||||
<button mat-stroked-button (click)="onClickSearchAndPrev()">
|
<button
|
||||||
<span class="mdi mdi-arrow-up-bold-box-outline mid-18px"></span>
|
mat-stroked-button
|
||||||
|
(click)="onClickSearchAndPrev()"
|
||||||
|
class="btn-toggle"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="1.5"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
class="feather feather-arrow-up"
|
||||||
|
>
|
||||||
|
<path d="M3.3,9v6.7c0,0.9,0.7,1.7,1.7,1.7h10c0.9,0,1.7-0.7,1.7-1.7V9" />
|
||||||
|
<polyline class="st0" points="13.3,6 10,2.7 6.7,6 " />
|
||||||
|
<line class="st0" x1="10" y1="2.7" x2="10" y2="12.5" />
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<button mat-stroked-button (click)="onClickPrevSearch()">
|
<button mat-stroked-button (click)="onClickPrevSearch()" class="btn-toggle">
|
||||||
<span class="mdi mdi-arrow-up-bold mid-18px"></span>
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
class="feather feather-arrow-up"
|
||||||
|
>
|
||||||
|
<line class="st0" x1="10" y1="15.8" x2="10" y2="4.2" />
|
||||||
|
<polyline class="st0" points="4.2,10 10,4.2 15.8,10 " />
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<button mat-stroked-button (click)="onClickNextSearch()">
|
<button mat-stroked-button (click)="onClickNextSearch()" class="btn-toggle">
|
||||||
<span class="mdi mdi-arrow-down-bold mid-18px"></span>
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
class="feather feather-arrow-up"
|
||||||
|
>
|
||||||
|
<line class="st0" x1="10" y1="4.2" x2="10" y2="15.8" />
|
||||||
|
<polyline class="st0" points="15.8,10 10,15.8 4.2,10 " />
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
|
<!--<mat-button-toggle-group>
|
||||||
|
<mat-button-toggle></mat-button-toggle>
|
||||||
|
<mat-button-toggle >
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
class="feather feather-arrow-up"
|
||||||
|
>
|
||||||
|
<line x1="12" y1="19" x2="12" y2="5"></line>
|
||||||
|
<polyline points="5 12 12 5 19 12"></polyline>
|
||||||
|
</svg>
|
||||||
|
</mat-button-toggle>
|
||||||
|
<mat-button-toggle ></mat-button-toggle>
|
||||||
|
</mat-button-toggle-group>-->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
.chatroom-search {
|
.chatroom-search {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
justify-items: center;
|
||||||
.search-form {
|
.search-form {
|
||||||
flex-flow: row;
|
flex-flow: row;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
@ -11,6 +12,10 @@
|
||||||
flex-flow: row;
|
flex-flow: row;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
|
.mat-form-field-label,
|
||||||
|
.mat-hint {
|
||||||
|
color: rgba(0, 0, 0, 0.54);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.text-amount {
|
.text-amount {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
@ -24,3 +29,41 @@
|
||||||
flex: 0 0 0%;
|
flex: 0 0 0%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mat-form-field-label,
|
||||||
|
.mat-hint {
|
||||||
|
color: rgba(0, 0, 0, 0.54);
|
||||||
|
}
|
||||||
|
|
||||||
|
::ng-deep .btns {
|
||||||
|
border: 1px solid #dddddd;
|
||||||
|
border-radius: 4px;
|
||||||
|
height: 42px;
|
||||||
|
.mat-stroked-button {
|
||||||
|
border: none;
|
||||||
|
min-width: 40px;
|
||||||
|
height: 42px;
|
||||||
|
padding: 0 10px;
|
||||||
|
&.btn-toggle {
|
||||||
|
display: flex;
|
||||||
|
border-right: 1px solid #dddddd;
|
||||||
|
justify-items: center;
|
||||||
|
&:last-child {
|
||||||
|
border-right: none;
|
||||||
|
}
|
||||||
|
.mat-button-wrapper {
|
||||||
|
display: flex;
|
||||||
|
line-height: inherit;
|
||||||
|
justify-content: center;
|
||||||
|
justify-items: center;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
svg {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
stroke: #555555;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -12,9 +12,20 @@
|
||||||
(click)="onClickDownload()"
|
(click)="onClickDownload()"
|
||||||
>
|
>
|
||||||
<!--<mat-icon>get_app</mat-icon>-->
|
<!--<mat-icon>get_app</mat-icon>-->
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
<svg
|
||||||
stroke-width="2" stroke-linecap="butt" stroke-linejoin="round">
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
<path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5" />
|
width="21"
|
||||||
|
height="21"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="butt"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"
|
||||||
|
/>
|
||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<span class="stroke-bar"></span>
|
<span class="stroke-bar"></span>
|
||||||
|
@ -24,8 +35,17 @@
|
||||||
class="ucap-image-viewer-action btn-close"
|
class="ucap-image-viewer-action btn-close"
|
||||||
(click)="onClickClose()"
|
(click)="onClickClose()"
|
||||||
>
|
>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
<svg
|
||||||
stroke-width="2" stroke-linecap="butt" stroke-linejoin="round">
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="21"
|
||||||
|
height="21"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
stroke="currentColor"
|
||||||
|
stroke-width="2"
|
||||||
|
stroke-linecap="butt"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
>
|
||||||
<line x1="18" y1="6" x2="6" y2="18"></line>
|
<line x1="18" y1="6" x2="6" y2="18"></line>
|
||||||
<line x1="6" y1="6" x2="18" y2="18"></line>
|
<line x1="6" y1="6" x2="18" y2="18"></line>
|
||||||
</svg>
|
</svg>
|
||||||
|
@ -60,7 +80,21 @@
|
||||||
(loadeddata)="onLoadedDataAudio()"
|
(loadeddata)="onLoadedDataAudio()"
|
||||||
></audio>
|
></audio>
|
||||||
<div class="circle-box">
|
<div class="circle-box">
|
||||||
<mat-icon class="ucap-sound-viewer-icon">music_note</mat-icon>
|
<mat-icon class="ucap-sound-viewer-icon" *ngIf="!playing">
|
||||||
|
music_note
|
||||||
|
</mat-icon>
|
||||||
|
<div class="sound-wave" *ngIf="playing">
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
<div class="sound-bar bg-accent-dark"></div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="viewer-bottom">
|
<div class="viewer-bottom">
|
||||||
|
@ -83,7 +117,6 @@
|
||||||
class="ucap-sound-viewer-sound-controls"
|
class="ucap-sound-viewer-sound-controls"
|
||||||
fxLayout="row"
|
fxLayout="row"
|
||||||
fxLayout.xs="column"
|
fxLayout.xs="column"
|
||||||
fxLayoutAlign="center center"
|
|
||||||
>
|
>
|
||||||
<div class="ucap-sound-viewer-sound-time-current">
|
<div class="ucap-sound-viewer-sound-time-current">
|
||||||
{{ currentTime | ucapSecondsToMinutes }}
|
{{ currentTime | ucapSecondsToMinutes }}
|
||||||
|
|
|
@ -34,6 +34,7 @@
|
||||||
height: calc(100% - 60px);
|
height: calc(100% - 60px);
|
||||||
|
|
||||||
.circle-box {
|
.circle-box {
|
||||||
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 140px;
|
width: 140px;
|
||||||
height: 140px;
|
height: 140px;
|
||||||
|
@ -47,6 +48,14 @@
|
||||||
height: 100px;
|
height: 100px;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
}
|
}
|
||||||
|
.sound-wave {
|
||||||
|
height: 80px;
|
||||||
|
left: 50%;
|
||||||
|
margin: -35px 0 0 -35px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 30px;
|
||||||
|
width: 70px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.ucap-sound-viewer-sound-icon {
|
.ucap-sound-viewer-sound-icon {
|
||||||
|
@ -82,11 +91,70 @@
|
||||||
font-size: 40px;
|
font-size: 40px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
line-height:40px;
|
line-height: 50px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sound-bar {
|
||||||
|
bottom: 1px;
|
||||||
|
height: 10px;
|
||||||
|
position: absolute;
|
||||||
|
width: 5px;
|
||||||
|
animation: sound-play 0ms -800ms linear infinite alternate;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(1) {
|
||||||
|
left: 0px;
|
||||||
|
animation-duration: 474ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(2) {
|
||||||
|
left: 7px;
|
||||||
|
animation-duration: 433ms;
|
||||||
|
}
|
||||||
|
.sound-bar {
|
||||||
|
left: 14px;
|
||||||
|
animation-duration: 407ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(4) {
|
||||||
|
left: 21px;
|
||||||
|
animation-duration: 458ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(5) {
|
||||||
|
left: 28px;
|
||||||
|
animation-duration: 400ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(6) {
|
||||||
|
left: 35px;
|
||||||
|
animation-duration: 427ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(7) {
|
||||||
|
left: 42px;
|
||||||
|
animation-duration: 441ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(8) {
|
||||||
|
left: 49px;
|
||||||
|
animation-duration: 419ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(9) {
|
||||||
|
left: 56px;
|
||||||
|
animation-duration: 487ms;
|
||||||
|
}
|
||||||
|
.sound-bar:nth-child(10) {
|
||||||
|
left: 63px;
|
||||||
|
animation-duration: 442ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes sound-play {
|
||||||
|
0% {
|
||||||
|
opacity: 0.35;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
mat-slider {
|
mat-slider {
|
||||||
width: 94%;
|
width: 94%;
|
||||||
}
|
}
|
||||||
|
@ -94,6 +162,8 @@ mat-slider {
|
||||||
::ng-deep .mat-slider-horizontal .mat-slider-track-background {
|
::ng-deep .mat-slider-horizontal .mat-slider-track-background {
|
||||||
background-color: #999999 !important;
|
background-color: #999999 !important;
|
||||||
}
|
}
|
||||||
::ng-deep .mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb{
|
::ng-deep
|
||||||
|
.mat-slider-min-value:not(.mat-slider-thumb-label-showing)
|
||||||
|
.mat-slider-thumb {
|
||||||
border-color: #999999 !important;
|
border-color: #999999 !important;
|
||||||
}
|
}
|